首页 > 代码库 > windows phone8.1样式

windows phone8.1样式

2024-11-15 02:46:02   202人阅读

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

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

   <StackPanel>            <StackPanel.Resources>                <Style x:Key="commonStyle" TargetType="Button">                    <Setter Property="Width" Value=http://www.mamicode.com/"200"></Setter>                    <Setter Property="Height" Value=http://www.mamicode.com/"15"></Setter>                    <Setter Property="FontSize" Value=http://www.mamicode.com/"20"></Setter>                    <Setter Property="Foreground" Value=http://www.mamicode.com/"Red"></Setter>                    <Setter Property="FontFamily" Value=http://www.mamicode.com/"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=http://www.mamicode.com/"200"></Setter>            <Setter Property="Height" Value=http://www.mamicode.com/"30"> </Setter>            <Setter Property="Foreground" Value=http://www.mamicode.com/"Green"></Setter>        </Style>       </Page.Resources>

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

 <Application.Resources>        <Style TargetType="Button" x:Key="outStyle">            <Setter Property="Width" Value=http://www.mamicode.com/"200"></Setter>            <Setter Property="Height" Value=http://www.mamicode.com/"15"></Setter>            <Setter Property="FontSize" Value=http://www.mamicode.com/"20"></Setter>            <Setter Property="Foreground" Value=http://www.mamicode.com/"Blue"></Setter>            <Setter Property="FontFamily" Value=http://www.mamicode.com/"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=http://www.mamicode.com/"250"></Setter>        <Setter Property="Height" Value=http://www.mamicode.com/"50"></Setter>        <Setter Property="Foreground" Value=http://www.mamicode.com/"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=http://www.mamicode.com/"200"></Setter>            <Setter Property="Height" Value=http://www.mamicode.com/"30"> </Setter>            <Setter Property="Foreground" Value=http://www.mamicode.com/"Green"></Setter>        </Style>        <!--样式继承-->        <Style TargetType="TextBlock" BasedOn="{StaticResource pageStyle}" x:Key="textBlockStyle">            <Setter Property="TextWrapping" Value=http://www.mamicode.com/"Wrap"></Setter>        </Style>

 

 

 
 
 
 
                                                                                                                                     
windows phone8.1样式






























        

            
                
                  
                
                

                    联系

                    我们