相互切换按钮 - 使用两个切换按钮来表示使用触发器的三态

Question

我需要两个切换按钮来相互重置。类似于单选按钮，但具有三态。即

按钮 1 已选中
按钮 2 已选中
None勾选

我尝试了以下方法：

    <ToggleButton x:Name="Button1" IsEnabled="{Binding IsConnected}">
        <ToggleButton.Style>
            <Style TargetType="ToggleButton" BasedOn="{StaticResource DetailedSettingsButtonStyle}" >
                <Setter Property="IsChecked" Value="False" />
                <Style.Triggers>
                    <DataTrigger  Binding="{Binding ElementName=Button2, Path=IsChecked}" Value="True">
                        <Setter Property="IsChecked" Value="False" />
                    </DataTrigger>
                </Style.Triggers>
            </Style>
        </ToggleButton.Style>
    </ToggleButton>

    <ToggleButton x:Name="Button2"
                  IsEnabled="{Binding IsConnected}">
        <ToggleButton.Style>
            <Style TargetType="ToggleButton" BasedOn="{StaticResource DetailedSettingsButtonStyle}" >
                <Setter Property="IsChecked" Value="False" />
                <Style.Triggers>
                    <DataTrigger  Binding="{Binding ElementName=Button1, Path=IsChecked}" Value="True">
                        <Setter Property="IsChecked" Value="False" />
                    </DataTrigger>
                </Style.Triggers>
            </Style>
        </ToggleButton.Style>
    </ToggleButton>

结果是当按钮 1 被选中并且我单击按钮 2 时，按钮 1 按预期取消选中，但按钮 2 保持未选中状态，直到我再次按下它。

因此，为了在按钮 1 和 2 之间切换，我必须在按钮 2 上单击两次。

换句话说，考虑到我要创建的三个状态，我每次都必须通过非被选中的状态，而不能直接在其他两个状态之间移动。

知道我做错了什么吗？

Answer 1

您应该可以使用 Storyboards:

<ToggleButton x:Name="Button1" IsEnabled="{Binding IsConnected}">
    <ToggleButton.Style>
        <Style TargetType="ToggleButton" BasedOn="{StaticResource DetailedSettingsButtonStyle}">
            <Setter Property="IsChecked" Value="False"/>
            <Style.Triggers>
                <DataTrigger Binding="{Binding IsChecked, ElementName=Button2}" Value="True">
                    <DataTrigger.EnterActions>
                        <BeginStoryboard>
                            <Storyboard>
                                <BooleanAnimationUsingKeyFrames Storyboard.TargetProperty="IsChecked">
                                    <DiscreteBooleanKeyFrame KeyTime="0" Value="False" />
                                </BooleanAnimationUsingKeyFrames>
                            </Storyboard>
                        </BeginStoryboard>
                    </DataTrigger.EnterActions>
                </DataTrigger>
            </Style.Triggers>
        </Style>
    </ToggleButton.Style>
</ToggleButton>

<ToggleButton x:Name="Button2" IsEnabled="{Binding IsConnected}">
    <ToggleButton.Style>
        <Style TargetType="ToggleButton" BasedOn="{StaticResource DetailedSettingsButtonStyle}">
            <Setter Property="IsChecked" Value="False"/>
            <Style.Triggers>
                <DataTrigger Binding="{Binding IsChecked, ElementName=Button1}" Value="True">
                    <DataTrigger.EnterActions>
                        <BeginStoryboard>
                            <Storyboard>
                                <BooleanAnimationUsingKeyFrames Storyboard.TargetProperty="IsChecked">
                                    <DiscreteBooleanKeyFrame KeyTime="0" Value="False" />
                                </BooleanAnimationUsingKeyFrames>
                            </Storyboard>
                        </BeginStoryboard>
                    </DataTrigger.EnterActions>
                </DataTrigger>
            </Style.Triggers>
        </Style>
    </ToggleButton.Style>
</ToggleButton>

Answer 2

您也可以为其他情况添加数据触发（Value=False，Set IsChecked=True）。

<DataTrigger  Binding="{Binding ElementName=Button1, Path=IsChecked}" Value="False">
    <Setter Property="IsChecked" Value="True" />
</DataTrigger>

但是你会失去三态行为。最好创建转换器并将它们绑定到视图模型属性.

相互切换按钮 - 使用两个切换按钮来表示使用触发器的三态

Mutual Toggle buttons - Using two toggle buttons to represent tri-state using triggers

wpf

xaml

triggers

togglebutton