【WP開發學習筆記】之樣式（style）

標籤：style   blog   http   color   io   os   ar   for   sp   

今天練習控制項時第一次見到style（樣式），通過設定style可以大幅提高用xaml寫UI的效率；

我在之前的學習中，每寫一個控制項就要寫出與之匹配的一大堆屬性，比如每次寫一個button就要寫一個background,一個foreground,一個width,一個height、一個fontsize、一個fontfamily，一個margin等等，有時需要寫出一大推button時就必須把上面的屬性在重複寫n次，寫其他控制項時也是這樣，這樣相當麻煩。而今天剛剛看到的樣式（style)就能很好的解決這個問題,只需要在資源中寫一次，然後在後面的同類控制項中就能自動引用，就可以將其應用到資源有效範圍內的所有同類控制項中。當然還可以通過x:KEY來設定是否需要手動引用。

在中，

文本一，文本二是自動引用樣式；

button1，button2手動引用樣式Mystyle1；

button3，button4手動引用樣式Mystyle2;

button5則不引用任何樣式；

XAML原始碼如下；

<phone:PhoneApplicationPage    x:Class="style.MainPage"    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"    xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"    xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"    mc:Ignorable="d"    FontFamily="{StaticResource PhoneFontFamilyNormal}"    FontSize="{StaticResource PhoneFontSizeNormal}"    Foreground="{StaticResource PhoneForegroundBrush}"    SupportedOrientations="Portrait" Orientation="Portrait"    shell:SystemTray.IsVisible="True">    <phone:PhoneApplicationPage.Resources>        <Style TargetType="TextBlock">            <Setter Property="FontFamily" Value="宋體"/>            <Setter Property="FontSize" Value="50"/>            <Setter Property="Foreground" Value="WhiteSmoke"/>            <Setter Property="HorizontalAlignment" Value="Center" />        </Style>        <Style x:Key="MyStyle1" TargetType="Button" >            <Setter Property="Background" Value="Blue"/>            <Setter Property="Foreground" Value="Black"/>             <Setter Property="FontSize" Value="35"/>            <Setter Property="BorderThickness" Value="5"/>        </Style>        <Style x:Key="Mystyle2" TargetType="Button">            <Setter Property="Background" >                <Setter.Value>                    <LinearGradientBrush StartPoint="0,0" EndPoint="1,1">                        <GradientStop Color="Red" Offset="0.3" />                        <GradientStop Color="Orange" Offset="0.6"/>                        <GradientStop Color="Purple" Offset="1"/>                     </LinearGradientBrush>                </Setter.Value>            </Setter>        </Style>    </phone:PhoneApplicationPage.Resources>    <Grid >        <StackPanel>            <TextBlock Text="文本一"/>            <TextBlock Text="文本二"/>            <Button Content="button1" Style="{StaticResource MyStyle1 }"/>            <Button Content="button2" Style="{StaticResource MyStyle1 }"/>            <Button Content="button3" Style="{StaticResource Mystyle2}"/>            <Button Content="button4" Style="{StaticResource Mystyle2 }"/>            <Button Content="button5"/>        </StackPanel>    </Grid></phone:PhoneApplicationPage>

 作者是wp學習者，現在還是小白，歡迎交流，微博@馬and康

【WP開發學習筆記】之樣式（style）