Silverlight控件樣式相關技巧應用解析

 Silverlight控件樣式相關技巧應用解析

Silverlight開發工具是由微軟公司推出的一款專門應用于圖形及多媒體操作的輔助工具。對于開發人員來說，使用它可以輕松的實作各種以前難以實作的視覺效果。Silverlight控件樣式都具有MS為我們賦予的預設樣式，雖然這個樣式也不怎麼難看，但任何産品都很少用這個預設的樣式去做最後的呈現，是以我們就需要對其進行修改。

• SilverLight動畫緩沖具體操作指南
• SilverLight内置緩存清單總結
• Silverlight浏覽器控件應用指導手冊
• Silverlight渲染速度提高方法介紹
• Silverlight事件處理相關操作指南

首先，根據我的了解，我想到的改變控件預設樣式的方法有：一、直接在控件本身上寫樣式；二、定義一個公共的樣式标，就像CSS一樣；三、運作時樣式，前面兩個的樣式定義好以後就生效了，而運作時樣式，隻有在程式運作的某一個階段才會生效。

第一個方法很簡單，我們隻需要在XAML中加入希望的樣式，或者通過Expression Blend在右側屬性中進行修改就可以了。

當然，我們仍然可以通過編寫代碼來實作動态的控制控件的樣式。

第二個Silverlight控件樣式的改變方法就是通過編輯外部的樣式來實作改變的目的。這個方法在參考資料[1]中有詳細的描述。

這裡，補充一點定義樣式的時候關于位置的定義，定義在程式級别 Application ，會将樣式寫在 App.xaml 中，如果定義在本文檔的話，會在頁面的上方寫入。個人了解就和CSS的文檔内寫入和外部樣式檔案類同。

當我們寫入 Application 時，标簽是這樣： < Application.Resources>

當我們寫入 Document 時， 标簽是這樣：< UserControl.Resources>

關于Silverlight控件樣式更多的内容，可以在MSDN的資料中看到[2]。

第三個方法我是在MSDN上看到的，貌似很強大，因為“屬性設定和樣式可以更改控件外觀的某些方面，但應用新模闆可以完全更改控件的外觀。盡管模闆不能更改控件類型的方法和事件，但它可以更改控件的外觀，具體取決于不同的狀态，如按下或禁用。使用 XAML 可以定義和設定控件的模闆。每個控件都有一個可以替換為自定義模闆的預設模闆。”。 這就是通過 ControlTemplate 來改變控件的外觀。

Cotrol Template 的設定有三種方式：

将 Template 本地設定成内聯定義的 ControlTemplate；

将 Template 本地設定成對定義資源的 ControlTemplate 的引用；

用 Style 設定 Template 和 定義 ControlTemplate；

下面分别是三種Silverlight控件樣式改變方式的定義方法： 

1. < Button Content="Button1"> 
2. < Button.Template> 
3. < ControlTemplate TargetType="Button"> 
4. < !--Define the ControlTemplate here.--> 
5. < /ControlTemplate> 
6. < /Button.Template> 
7. < /Button>   
8. < StackPanel> 
9. < StackPanel.Resources> 

10. < ControlTemplate TargetType="Button" 

    x:Key="newTemplate"> 

11. < !--Define the ControlTemplate here.--> 
12. < /ControlTemplate> 
13. < /StackPanel.Resources> 

14. < Button Template="{StaticResource 

    newTemplate}" Content="Button1"/> 

15. < /StackPanel> 
16. < StackPanel> 
17. < StackPanel.Resources> 

18. < Style TargetType="Button"

     x:Key="newTemplate">   

19. < Setter Property="Template"> 
20. < Setter.Value> 
21. < ControlTemplate TargetType="Button"> 
22. < !--Define the ControlTemplate here.--> 
23. < /ControlTemplate> 
24. < /Setter.Value> 
25. < /Setter> 
26. < /Style> 
27. < /StackPanel.Resources> 

28. < Button Style="{StaticResource

     newTemplate}" Content="Button1"/> 

29. < /StackPanel>