Silverlight初探(一) - Style設定篇

Silverlight這個技術剛出來的時候，小弟我其實就想學了，但是一直拖到現在才開始訴諸行動，為什麼拖了這麼久，不是我懶惰，只是Silverlight1.0的時候我就有稍微喵了一下書籍，那時候書本一直提到Silverlight不是Flash，光是這點我就有點心動了，因為我本身也有想要學Flash這塊，但是本人美工不強，而且一直走C#這塊實在沒有餘力再走ActionScript了，於是就想說乾脆來學Silverlight好了，但是書本一翻開，shit.... 為什麼不是用C# ~"~ ，用的還是JavaScript，而且看來看去怎們感覺好像Flash，似乎跟書本說的不太一樣，要是要重學我乾脆學ActionScript，所以就放棄了。
時光飛梭，如今Silverlight 4 也上市了，小弟我又不放棄的跑去書局翻了翻書，這次終於本書買回家了，微軟還是有在做事的，Silverlight 4 開始支援C#語法(更早的版本就有支援了)，而且加強了資料庫的操作，所以我又回來了，說了一堆廢話，這篇文章我要介紹一下在Silverlight中Style的設定。

相信大家都有寫過網頁，網頁中我們常常會用CSS來定義一些字型、框線等等，以避免要調整風格的時候要整個網頁打開一支一支修改，而Silverlight中當然也有這樣的設定。前些日子我在網路上搜索了幾篇文章有教到使用Visual Studio 2010建置Silverlight商業網站(如下圖)，建置完後我打開程式碼一看，我的媽呀，好陌生~~，書中似乎也沒有寫這些是幹嘛的，所以才決定寫下這篇文章。

首先我們可以看到建立一個Silverlight App後會有一個App.xaml檔，這個檔的目的就像是Winform的Program.cs，專門在設定程式進入點的，因此我們把要載入的Style檔就寫在這頁，其中Assets/Style.xaml就是我們預先設定好的Style檔

接下來就是來看Style定義的部分，如果專案裡面沒有Style.xaml檔，可以透過加入新項目，選擇Silverlight Resource Dictionary來建立，建立完後就可以開始設定自己要的Style了。


我從商業網站所產生的程式碼看來，Style有兩種定義方式，一種是直接定義，從下面的程式碼可以看到一個Style的定義必須有id，也就是【x:Key】，這樣程式端才有辦法選定，這點跟CSS一樣，但是如果沒有給定【x:Key】也可以正常執行，只是套用的類別會變成TargetType所指定的所有物件，另外還必須指定要套用的物件【Grid】，而裡面的Setter Property這個我就不多加解釋了。

另外一種方式是套用先前定義的Style,下面的語法我們先定義一個共用的Style【NavigationBackgroundColorBrush】，並且注意一下下面設定屬性部分的Value,就直接套用這個Style。

最後就是該如何使用了，在我們設計好的xaml檔裡面，遇到需要套用特定Style的時候我們只需要使用下面語法即可，就是如此簡單。至於StaticResource與DynamicResource並不在本文的討論範圍，後續有機會在說明，或者可以參考阿諭的WPF技術應用天堂。

本文附件 : 

Style.xaml