NET開發Silverlight程式：界面和對象模型

Silverlight是用XAML語言來描述界面的。XAML是eXtensible Application Markup Language的縮寫，也就是可擴充的應用程式标記語言。在WPF(Windows Presentation Foundation)中，第一次出現了XAML，用來描述.NET語言。而Silverlight中的XAML隻用來對使用者界面作出統一的描述，彌補HTML/CSS等在界面定制上的不足，并使開發人員和設計人員可以運用同一種語言進行交流，減少額外的工作量。是以，Silverlight XAML的文法相對WPF中的XAML相對要簡單一些，也更容易上手。

雖然我們可以使用Microsoft Expression Studio的視覺化方式設計界面，但是了解XAML的基本文法可以幫助我們更好的定制自己的界面。如果想要直接編寫XAML，使用Visual Studio 2008則可以提高編寫的效率，因為裡面有自動感應功能(Intellisense)。

Canvas容器和各種元素

任何Silverlight應用程式的界面描述都是以一個叫Canvas(畫布)的容器為根開始的。當我們在Microsoft Expression Blend或者Visual Studio 2008中建立一個新的Silverlight項目後，總會生成一個隻包含根Canvas的.xaml檔案，如下所示：

Loaded="Page_Loaded" 

x:Class="SilverlightTestProject.Page;assembly=ClientBin/SilverlightTestProject.dll" 

Width="640" 

Height="480" 

Background="White">

任何元素都必須添加在這個根Canvas容器的裡面，因為一個界面裡隻能有一個這樣的根Canvas容器。我們可以在這個根容器裡加入子容器或者其他元素。每個元素都有一個标簽相對應。比如在子容器中添加一個矩形，并在根容器中添加一個橢圓形：

Background="White"> 

Silverlight定義的常見的幾何圖形包括矩形，橢圓，直線，多邊形，多叉線(不封閉的折線)，路徑(可以畫出任意的形狀和線條，比如不封閉的曲線)，等等。允許我們定制顯示在界面上的文字。

附加元素屬性

嘗試以上代碼，可以發覺我們其實看不到任何我們想要的性狀，因為它們的預設的大小屬性均為0。可見，僅使用這些元素标簽還不足以得到我們想要得形狀，我們需要在标簽中設定它的屬性值，确定它的大小、位置等等。

觀察根Canvas，我們已經可以了解到一些屬性的定制，比如隻在根節點出現的定義xml名字空間(xmlns)以及自定義的xml名字空間(xmlns:x)。其中還有一些常用的屬性，如寬(Width)，高(Height)。在Canvas中，這兩個屬性既可以用像素值來表示，也可以用百分比來表示。x:Name表示該元素示例的名稱，有了這個名稱，我們就可以在.NET代碼中操作這個元素示例。Background屬性設定了背景的顔色，不設定這個值，則該元素透明。

每個元素都有屬于自己的一組屬性。比如，我們可以将剛才的代碼改進一下：

    則可以看到以下效果：

其中Fill指定了填充色，Stroke和StrokeThickness定制了形狀的輪廓線條的顔色和粗細。我們可以看到根Canvas下的子元素(包括子容器Canvas)的位置屬性均表示相對上一級Canvas的坐标位置。值得注意的是這裡雖然矩形myRect超出了subCanvas定義的邊界範圍，但它并不會被subCanvas剪裁，且仍屬于subCanvas中的元素。

順便一提，目前我們隻有Canvas一種容器，在不久的将來，Silverlight将會提供更多的容器，使布局管理更友善。

對象模型

在WPF中，XAML是.NET代碼的xml表現形式;而在Silverlight中，我們同樣有與XAML相對應的.NET語言程式設計方式。其中，每一個元素對應一個對象，元素屬性在其.NET對象中都有對應的屬性。例如先前一個例子中的矩形就可以用以下C#語言來表示：

Rectangle myRect = new Rectangle(); 

myRect .SetValue(Canvas.TopProperty, 117); 

myRect .SetValue(Canvas.LeftProperty, 123); 

myRect .Width = 100; 

myRect .Height = 100; 

SolidColorBrush brushBlue = new SolidColorBrush(); 

brushBlue.Color = Colors.Blue; 

myRect .Fill = brushBlue; 

SolidColorBrush brushRed = new SolidColorBrush(); 

brushRed.Color = Colors.Red; 

myRect .Stroke = brushRed; 

myRect .StrokeThickness = 3;

這裡SolidColorBrush對象派生自Brush，是畫刷的一種。Silverlight裡定義了好幾種不同的畫刷對圖形進行填充。屬性Fill的預設畫刷是SolidColorBrush，是以可以在.xaml檔案中可以直接給Fill屬性指派，但在.NET語言中則必須明确指出畫刷的類型。有關畫刷的具體内容我們會在以後介紹。

剛才用C#定義出來的矩形還是獨立的，如果要把它在界面上表示出來，則需要在其後加上下面這句代碼将矩形加入上一級Canvas中：

Children.Add(myRect);

本文轉自dotfun 51CTO部落格，原文連結:http://blog.51cto.com/dotfun/285734