WPF-控件样式设置

1、控件样式设置

  • 1.1、内嵌式为相同控件设置样式
  • `
复制代码
  <Window.Resources>
   <Style  TargetType="Button">
       <Setter Property="Background" Value="Yellow"></Setter>
       <Setter Property="Width" Value="60"></Setter>
       <Setter Property="Height" Value="80"></Setter>
       <Setter Property="FontSize" Value="18"></Setter>
   </Style>    
   </Window.Resources> 
   <Button  Content="通用"></Button>`
    <!--为指定key设置样式-->
            <Style x:Key="loginStyle" TargetType="Button">
       <Setter Property="Background" Value="Red"></Setter>
       <Setter Property="Width" Value="60"></Setter>
       <Setter Property="Height" Value="80"></Setter>
       <Setter Property="FontSize" Value="18"></Setter>
   </Style>
    <Button Style="{StaticResource loginStyle}" Content="登录"></Button>
            <!--动态资源可以通过方法更改相关信息-->
   <Button  Style="{DynamicResource loginStyle }" Content="动态资源" Click="Button_Click"></Button>

1.2、外联式

csharp 复制代码
BaseButtonStyle.xaml文件
 <ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
    <!--设置一个基础样式-->
    <Style TargetType="Button">
        <Setter Property="FontSize" Value="18"></Setter>
        <Setter Property="Margin" Value="20,30"></Setter>
    </Style>
    <!--为指定button设置样式并且继承基础样式-->
    <Style x:Key="quitStyle" TargetType="Button" BasedOn="{StaticResource {x:Type Button}}">
        <Setter Property="Background" Value="Yellow"></Setter>
        <Setter Property="Width" Value="60"></Setter>
        <Setter Property="Height" Value="80"></Setter>
    </Style>
</ResourceDictionary>

     <!--使用BaseButtonStyle里全局样式-->
    <StackPanel>
        <Button  Content="登录"></Button>
        <Button Style="{StaticResource quitStyle}" Content="退出"></Button>
        <Button  Content="通用"></Button>
    </StackPanel>

1.3、控制内置模板(触发器Triggers)

csharp 复制代码
<Grid>
    <!--<Button Width="100" Height="50" Content="自定义按钮" Background="Red" Foreground="Wheat"></Button>-->
    <Button Width="100" Height="50"  Content="自定义按钮" Background="Red" Foreground="Wheat">
        <Button.Template>
           <ControlTemplate TargetType="Button">
                <!--等价 <ControlTemplate TargetType="{x:Type Button}">-->
                <!-- border 属性都可以,如颜色也可以这么写Background="{TemplateBinding Background}"-->
                <Border x:Name="border" Background="Red" BorderBrush="Black" BorderThickness="2" CornerRadius="10">
                    <!-- <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" Content="自定义内容">                            
                    </ContentPresenter>-->
                    <TextBlock Text="{TemplateBinding Content}" HorizontalAlignment="Center" VerticalAlignment="Center"></TextBlock>
                </Border>
               <!--触发器鼠标放上去改变属性-->
                <ControlTemplate.Triggers>
                    <Trigger Property="IsMouseOver" Value="True">
                        <Setter TargetName="border" Property="Background" Value="Black"></Setter>
                        
                    </Trigger>
                </ControlTemplate.Triggers>
                
            </ControlTemplate>
        </Button.Template>
    </Button>

    <!-- 延伸CornerRadius 假如CornerRadius属性也想使用绑定,但是Button是没有CornerRadius属性的,可以采用自定义一个Button,然后定义一个依赖属性,来实现-->

</Grid>
事件触发器
      <Style.Triggers>
                <EventTrigger RoutedEvent="Button.Click">
                    <BeginStoryboard>
                        <Storyboard>
                            <ColorAnimation Storyboard.TargetProperty="(Button.Background).(SolidColorBrush.Color)"
                                            To="Green" Duration="0:0:0.5" />
                        </Storyboard>
                    </BeginStoryboard>
                </EventTrigger>
            </Style.Triggers>

1.4、抽离模板(控件模板)

    <!--将第三个模板提取出来-->
    <Window.Resources>
        <ControlTemplate x:Key="ButtonTemplated" TargetType="{x:Type Button}">
            <Border Name="Border" BorderThickness="2" CornerRadius="3" BorderBrush="AliceBlue" Background="Aqua" TextBlock.Foreground="White">
                <ContentPresenter Margin="{TemplateBinding Padding}" HorizontalAlignment="Center" VerticalAlignment="Center" >
                </ContentPresenter>
            </Border>
            <ControlTemplate.Triggers>
                <Trigger Property="IsMouseOver" Value="True" >
                    <Setter TargetName="Border"   Property="Background" Value="Red"></Setter>
                </Trigger>
                <Trigger Property="IsPressed" Value="True">
                    <Setter TargetName="Border"   Property="Background" Value="White"></Setter>
                </Trigger>
            </ControlTemplate.Triggers>

        </ControlTemplate>
    </Window.Resources>
    <StackPanel Margin="5">
        <Button Margin="5" Padding="3">Normal Button</Button>
        <Button Name="mybutton" Margin="5" Padding="3" Template="{StaticResource ResourceKey=ButtonTemplated}">Templated Button</Button>
  </StackPanel>
   <!--数据模板-->
 <DataTemplate x:Key="CustomItemTemplate">
     <StackPanel Orientation="Horizontal">
         <TextBlock Text="{Binding name}" Width="100"/>
         <TextBlock Text="{Binding age}" Width="100"/>
     </StackPanel>            
 </DataTemplate>
  <ListBox x:Name="listBox" ItemTemplate="{StaticResource CustomItemTemplate}"></ListBox>

2.1点击事件

csharp 复制代码
 <Button Width="50" Height="50" Background="Red" Content="点击" Click="Button_Click"></Button>
     public partial class Window5 : Window
    {
        public Window5()
        {
            InitializeComponent();
        }

        private void Button_Click(object sender, RoutedEventArgs e)
        {

        }
    }
相关推荐
桂月二二29 分钟前
实时事件流处理架构的容错设计
架构·wpf
车载小杜1 小时前
基于指针的线程池
开发语言·c++
沐知全栈开发1 小时前
Servlet 点击计数器
开发语言
m0Java门徒1 小时前
Java 递归全解析:从原理到优化的实战指南
java·开发语言
桃子酱紫君2 小时前
华为配置篇-BGP实验
开发语言·华为·php
QTX187302 小时前
JavaScript 中的原型链与继承
开发语言·javascript·原型模式
shaoing2 小时前
MySQL 错误 报错:Table ‘performance_schema.session_variables’ Doesn’t Exist
java·开发语言·数据库
源之缘-OFD先行者3 小时前
GMap.NET + WPF:构建高性能 ADS-B 航空器追踪平台
.net·wpf·ads-b
The Future is mine3 小时前
Python计算经纬度两点之间距离
开发语言·python
Enti7c3 小时前
HTML5和CSS3的一些特性
开发语言·css3