就像在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>
时间: 2024-10-10 08:54:55