WPF 点击按钮切换Style

先看效果图
在这里插入图片描述

<Window x:Class="WpfApp1.FragmentWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:WpfApp1"
        mc:Ignorable="d"
        Name="FragmentWindow1"
        Title="FragmentWindow" Height="450" Width="800">
    <Window.Resources>
        <Style x:Key="One" TargetType="{x:Type Grid}">
            <Style.Setters>
                <Setter Property="Background" Value="AliceBlue"></Setter>
            </Style.Setters>
        </Style>
        <Style x:Key="Two" TargetType="{x:Type Grid}">
            <Style.Setters>
                <Setter Property="Background" Value="Black"></Setter>
            </Style.Setters>
        </Style>
        <Style x:Key="Three" TargetType="{x:Type Grid}">
            <Style.Setters>
                <Setter Property="Background" Value="Red"></Setter>
            </Style.Setters>
        </Style>
        <Style x:Key="Four" TargetType="{x:Type Grid}">
            <Style.Setters>
                <Setter Property="Background" Value="Yellow"></Setter>
            </Style.Setters>
        </Style>
    </Window.Resources>
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="111"/>
            <ColumnDefinition Width="*"/>
        </Grid.ColumnDefinitions>
        <Grid Grid.Column="0">
            <Grid.RowDefinitions>
                <RowDefinition Height="*"/>
                <RowDefinition Height="*"/>
                <RowDefinition Height="*"/>
                <RowDefinition Height="*"/>
            </Grid.RowDefinitions>

            <Button Grid.Row="0" Content="One" Name="btnOne" Click="BtnOne_Click"></Button>
            <Button Grid.Row="1" Content="Two" Name="btnTwo" Click="BtnTwo_Click"></Button>
            <Button Grid.Row="2" Content="Three" Name="btnThree" Click="BtnThree_Click"></Button>
            <Button Grid.Row="3" Content="Four" Name="btnFour" Click="BtnFour_Click"></Button>

        </Grid>
        <Grid Grid.Column="1" Name="gridStyle">
        </Grid>
    </Grid>
</Window>
using System;
using System.ComponentModel;
using System.Globalization;
using System.Runtime.CompilerServices;
using System.Windows;
using System.Windows.Data;

namespace WpfApp1
{
    public partial class FragmentWindow : Window
    {
        public FragmentWindow()
        {
            InitializeComponent();
        }

        private void BtnOne_Click(object sender, RoutedEventArgs e)
        {
            var style = this.TryFindResource(GridStyle.One.ToString()) as Style;

            if (style != null)
            {
                gridStyle.Style = style;
            }
        }

        private void BtnTwo_Click(object sender, RoutedEventArgs e)
        {
            var style = this.TryFindResource(GridStyle.Two.ToString()) as Style;

            if (style != null)
            {
                gridStyle.Style = style;
            }
        }

        private void BtnThree_Click(object sender, RoutedEventArgs e)
        {
            var style = this.TryFindResource(GridStyle.Three.ToString()) as Style;

            if (style != null)
            {
                gridStyle.Style = style;
            }
        }

        private void BtnFour_Click(object sender, RoutedEventArgs e)
        {
            var style = this.TryFindResource(GridStyle.Four.ToString()) as Style;

            if (style != null)
            {
                gridStyle.Style = style;
            }
        }
    }
    
    public enum GridStyle
    {
        One = 1,
        Two,
        Three,
        Four
    }
}



参考:
IValueConverter Example and Usage in WPF
在这里插入图片描述

<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                    xmlns:local="clr-namespace:WpfApp1.style">
    <Style x:Key="One" TargetType="{x:Type Grid}">
        <Style.Setters>
            <Setter Property="Background" Value="AliceBlue"></Setter>
        </Style.Setters>
    </Style>
    <Style x:Key="Two" TargetType="{x:Type Grid}">
        <Style.Setters>
            <Setter Property="Background" Value="AntiqueWhite"></Setter>
        </Style.Setters>
    </Style>
    <Style x:Key="Three" TargetType="{x:Type Grid}">
        <Style.Setters>
            <Setter Property="Background" Value="Aqua"></Setter>
        </Style.Setters>
    </Style>
    <Style x:Key="Four" TargetType="{x:Type Grid}">
        <Style.Setters>
            <Setter Property="Background" Value="Aquamarine"></Setter>
        </Style.Setters>
    </Style>
</ResourceDictionary>


<Window x:Class="WpfApp1.FragmentWindowByConverter"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:WpfApp1"
        mc:Ignorable="d"
        Title="FragmentWindowByConverter" Height="450" Width="800"
        Name ="FragmentWindowByConverterName">
    <Window.Resources>
        <local:FragmentWindowConverter x:Key="FWC"/>
    </Window.Resources>
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="111"/>
            <ColumnDefinition Width="*"/>
        </Grid.ColumnDefinitions>
        <Grid Grid.Column="0">
            <Grid.RowDefinitions>
                <RowDefinition Height="*"/>
                <RowDefinition Height="*"/>
                <RowDefinition Height="*"/>
                <RowDefinition Height="*"/>
            </Grid.RowDefinitions>
            <RadioButton Grid.Row="0" Width="50" Height="50" VerticalContentAlignment="Center" Content="One" Name="btnOne" IsChecked="{Binding ElementName=gridStyle,Path=Style,Converter={StaticResource FWC},ConverterParameter=One}"></RadioButton>
            <RadioButton Grid.Row="1" Width="50" Height="50" VerticalContentAlignment="Center" Content="Two" Name="btnTwo" IsChecked="{Binding ElementName=gridStyle,Path=Style,Converter={StaticResource FWC},ConverterParameter=Two}"></RadioButton>
            <RadioButton Grid.Row="2" Width="50" Height="50" VerticalContentAlignment="Center" Content="Three" Name="btnThree" IsChecked="{Binding ElementName=gridStyle,Path=Style,Converter={StaticResource FWC},ConverterParameter=Three}"></RadioButton>
            <RadioButton Grid.Row="3" Width="50" Height="50" VerticalContentAlignment="Center" Content="Four" Name="btnFour" IsChecked="{Binding ElementName=gridStyle,Path=Style,Converter={StaticResource FWC},ConverterParameter=Four}"></RadioButton>
        </Grid>
        <Grid Grid.Column="2" Name="gridStyle"/>
    </Grid>
</Window>
using System;
using System.ComponentModel;
using System.Globalization;
using System.Runtime.CompilerServices;
using System.Windows;
using System.Windows.Data;

namespace WpfApp1
{
    public partial class FragmentWindowByConverter : Window
    {
        public FragmentWindowByConverter()
        {
            InitializeComponent();
        }

        public enum TypeFragmentWindowStyle
        {
            One = 1,
            Two,
            Three,
            Four
        }
    }

    public class FragmentWindowConverter : IValueConverter
    {
        public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
        {
            return Maybe(parameter);
        }

        public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
        {
            return Maybe(parameter);
        }

        private object Maybe(object obj)
        {
            if (obj != null)
            {
                Style style = Application.Current.TryFindResource(obj.ToString()) as Style;
                return style;
            }
            return Binding.DoNothing;
        }
    }
}
  • 0
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
您好!要在WPF中实现按钮的材质切换,您可以使用以下步骤: 1. 首先,确保您已经添加了Material Design的相关资源到您的项目中您可以通过NuGet包管理器安装MaterialDesignThemes和MaterialDesignColors。 2. 在XAML中,将按钮的样式设置为Material Design的样式。例如: ```xaml <Button Style="{StaticResource MaterialDesignRaisedButton}" Content="切换按钮" /> ``` 3. 现在,我们需要为按钮的不同状态创建样式。您可以使用VisualStateManager来定义这些样式。例如,您可以为按钮的正常状态和按下状态创建两个样式: ```xaml <Button Style="{StaticResource MaterialDesignRaisedButton}"> <VisualStateManager.VisualStateGroups> <VisualStateGroup> <VisualState x:Name="Normal"> <Storyboard> <ColorAnimation Storyboard.TargetProperty="(Button.Background).(SolidColorBrush.Color)" To="Green" Duration="0:0:0.2" /> </Storyboard> </VisualState> <VisualState x:Name="Pressed"> <Storyboard> <ColorAnimation Storyboard.TargetProperty="(Button.Background).(SolidColorBrush.Color)" To="Red" Duration="0:0:0.2" /> </Storyboard> </VisualState> </VisualStateGroup> </VisualStateManager.VisualStateGroups> 切换按钮 </Button> ``` 在上述示例中,我们为正常状态定义了一个颜色动画,将按钮背景色设置为绿色。当按钮按下时,我们为按下状态定义了另一个颜色动画,将按钮背景色设置为红色。 通过使用VisualStateManager,您可以根据按钮的不同状态来定义不同的样式,以实现材质切换的效果。 希望能对您有所帮助!如果您有任何其他问题,请随时提问。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值