如何在WPF中设置切换按钮的属性?

bf1o4zei  于 2022-11-18  发布在  其他
关注(0)|答案(1)|浏览(131)

这是切换按钮的源代码。

<Window.Resources>
    
    <Style TargetType="CheckBox">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="CheckBox">
                    <StackPanel Orientation="Horizontal">
                        <Grid >
                            <Border Width="45" Height="20" Background="LightGray" CornerRadius="10" Margin="5,0"></Border>
                            <Border x:Name="button" Height="25" Width="25" CornerRadius="12.5" HorizontalAlignment="Left"  ></Border>
                        </Grid>
                        <ContentPresenter x:Name="content" Margin="10,0,0,0" Content="{TemplateBinding Content}" VerticalAlignment="Center"/>
                    </StackPanel>
                    <ControlTemplate.Resources>
                        <Storyboard x:Key="right">
                            <ThicknessAnimation Storyboard.TargetProperty="Margin" Storyboard.TargetName="button" Duration="0:0:0.4" From="0,0,0,0" To="28,0,0,0" >
                                <ThicknessAnimation.EasingFunction>
                                    <CircleEase EasingMode="EaseOut"/>
                                </ThicknessAnimation.EasingFunction>
                            </ThicknessAnimation>
                        </Storyboard>
                        <Storyboard x:Key="left">
                            <ThicknessAnimation Storyboard.TargetProperty="Margin" Storyboard.TargetName="button" Duration="0:0:0.4" From="28,0,0,0" To="0,0,0,0" >
                                <ThicknessAnimation.EasingFunction>
                                    <CircleEase EasingMode="EaseOut"/>
                                </ThicknessAnimation.EasingFunction>
                            </ThicknessAnimation>
                        </Storyboard>
                    </ControlTemplate.Resources>
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsChecked" Value="false">
                            <Trigger.ExitActions>
                                <RemoveStoryboard BeginStoryboardName="leftt"></RemoveStoryboard>
                                <BeginStoryboard Storyboard="{StaticResource right}" x:Name="rightt" ></BeginStoryboard>
                            </Trigger.ExitActions>
                            <Setter TargetName="button" Property="Background" Value="#757575"></Setter>
                        </Trigger>
                        <Trigger Property="IsChecked" Value="true">
                            <Trigger.ExitActions>
                                <RemoveStoryboard BeginStoryboardName="rightt"></RemoveStoryboard>
                                <BeginStoryboard Storyboard="{StaticResource left}" x:Name="leftt" ></BeginStoryboard>
                            </Trigger.ExitActions>
                            <Setter TargetName="button" Property="Background" Value="#20BF55"></Setter>
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
</Window.Resources>
<StackPanel VerticalAlignment="Center">
    <CheckBox  HorizontalAlignment="Center" VerticalAlignment="Center" FontSize="26" Foreground="#0B4F6C" >Option 1</CheckBox>
    <CheckBox  HorizontalAlignment="Center" VerticalAlignment="Center" FontSize="26" Foreground="#0B4F6C" >Option 2</CheckBox>
    <CheckBox  HorizontalAlignment="Center" VerticalAlignment="Center" FontSize="26" Foreground="#0B4F6C" >Option 3</CheckBox>
    <CheckBox  HorizontalAlignment="Center" VerticalAlignment="Center" FontSize="26" Foreground="#0B4F6C" >Option 4</CheckBox>
    <CheckBox  HorizontalAlignment="Center" VerticalAlignment="Center" FontSize="26" Foreground="#0B4F6C" >Option 5</CheckBox>
</StackPanel>

所以我想在这里做的是运行一个命令时,切换按钮是启用和运行另一个命令时,切换按钮是禁用。我是新的WPF。所以请帮助我这样做,并提前感谢。

tv6aics1

tv6aics11#

使用WPF的XAML行为。

  • 复选框示例
<CheckBox 
    xmlns:i="http://schemas.microsoft.com/xaml/behaviors"
    Content="Some Choice">

    <i:Interaction.Triggers>
        <i:EventTrigger EventName="Unchecked">
            <i:InvokeCommandAction Command="{Binding UnCheckedCommand}"/>
        </i:EventTrigger>
        <i:EventTrigger EventName="Checked">
            <i:InvokeCommandAction Command="{Binding CheckedCommand}"/>
        </i:EventTrigger>
    </i:Interaction.Triggers>
</CheckBox>
  • 切换按钮示例
<ToggleButton 
    xmlns:i="http://schemas.microsoft.com/xaml/behaviors"
    Content="Some Toggle">

    <i:Interaction.Triggers>
        <i:EventTrigger EventName="Unchecked">
            <i:InvokeCommandAction Command="{Binding UnCheckedCommand}"/>
        </i:EventTrigger>
        <i:EventTrigger EventName="Checked">
            <i:InvokeCommandAction Command="{Binding CheckedCommand}"/>
        </i:EventTrigger>
    </i:Interaction.Triggers>
</ToggleButton>

您使用的是复选框,而不是切换按钮。

相关问题