windows phone8.1样式

就像在html中使用css一样,在XAML元素中应用style可以对界面进行美化。

在控件Resource属性里面创建样式

   <StackPanel>

            <StackPanel.Resources>

                <Style x:Key="commonStyle" TargetType="Button">

                    <Setter Property="Width" Value="200"></Setter>

                    <Setter Property="Height" Value="15"></Setter>

                    <Setter Property="FontSize" Value="20"></Setter>

                    <Setter Property="Foreground" Value="Red"></Setter>

                    <Setter Property="FontFamily" Value="Arial"></Setter>

                </Style>

            </StackPanel.Resources>

            <Button Style="{StaticResource commonStyle}">局部样式</Button>



          

        </StackPanel>

在Resource中创建的样式只能作用于局部,如上面样式只能作用于StackPanel范围内。有时我们希望创建的样式在整个页面都可以使用,那么我们在Page节点下创建样式

 <Page.Resources>

        <Style TargetType="Button" x:Key="pageStyle">

            <Setter Property="Width" Value="200"></Setter>

            <Setter Property="Height" Value="30"> </Setter>

            <Setter Property="Foreground" Value="Green"></Setter>

        </Style>

   

    </Page.Resources>

在做应用的时候我们不可能就一个界面,当多个页面有公共的样式,我们就需要创建一个让每个界面都可以使用的样式,而不是ctrl+c、ctrl+v。在App.xaml文件中创建的样式可以在整个应用程序中使用

 <Application.Resources>

        <Style TargetType="Button" x:Key="outStyle">

            <Setter Property="Width" Value="200"></Setter>

            <Setter Property="Height" Value="15"></Setter>

            <Setter Property="FontSize" Value="20"></Setter>

            <Setter Property="Foreground" Value="Blue"></Setter>

            <Setter Property="FontFamily" Value="Arial"></Setter>

        </Style>

    </Application.Resources>

如果程序比较大,界面比较多我们在使用上面方式创建样式,就会使用程序在维护起来比较困难,这是我们就需要创建样式文件,就像在使用css时,把css样式单独放到一个文件中一样。在程序中添加一个ButtonStyle.xaml样式文件

<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:local="using:AppTheme">

    <Style x:Key="style1" TargetType="Button">

        <Setter Property="Width" Value="250"></Setter>

        <Setter Property="Height" Value="50"></Setter>

        <Setter Property="Foreground" Value="BurlyWood"></Setter>

    </Style>

</ResourceDictionary>

样式文件创建好之后,我们只需要在引用一下就可以使用了,我们可以在app.xaml文件中引用或者在普通页面引用,在APP.xaml引用是全局的,在普通页面引用只能作用于当前的页面,引用方式如下

在app.xaml中引用

 <Application.Resources>

        <ResourceDictionary>

            <ResourceDictionary.MergedDictionaries>

                <ResourceDictionary Source="buttonStyle.xaml"></ResourceDictionary>

            </ResourceDictionary.MergedDictionaries>

        </ResourceDictionary>



        

    </Application.Resources>

在页面引用

 <Page.Resources>

        

        <ResourceDictionary>

            <ResourceDictionary.MergedDictionaries>

                <ResourceDictionary Source="ButtonStyle.xaml"/>

            </ResourceDictionary.MergedDictionaries>

        </ResourceDictionary>

    </Page.Resources>

windows phone中的样式支持继承,这样在使用样式的更加灵活,同时也可以减少代码的冗余。

          <Style TargetType="Button" x:Key="pageStyle">

            <Setter Property="Width" Value="200"></Setter>

            <Setter Property="Height" Value="30"> </Setter>

            <Setter Property="Foreground" Value="Green"></Setter>

        </Style>

        <!--样式继承-->

        <Style TargetType="TextBlock" BasedOn="{StaticResource pageStyle}" x:Key="textBlockStyle">

            <Setter Property="TextWrapping" Value="Wrap"></Setter>

        </Style>

 

 


 

 

 

 

                                                                                                                                     

你可能感兴趣的:(windows phone)