c# - 带图像的 WPF 单选按钮

Question

我必须创建类似于图片的东西。如果单击其中一个按钮，其他按钮应该变暗。非常感谢!

这就是我想要的

Answer 1

当 RadioButton 未通过样式触发器选中时，您可以更改 Opacity

<RadioButton.Style>                    
    <Style TargetType="RadioButton">                        
        <Style.Triggers>
            <Trigger Property="IsChecked" Value="False">
                <Setter Property="Opacity" Value="0.5"></Setter>
            </Trigger>
        </Style.Triggers>
    </Style>
</RadioButton.Style>

里面的图片可以通过修改Template来创建

<RadioButton.Template>
    <ControlTemplate TargetType="RadioButton">
        <!-- new template -->
    </ControlTemplate>
</RadioButton.Template>

可以找到默认模板here

---

我的原始模板看起来像这样(我在 ItemsControl 中添加了 3 个单选按钮，第 2 个已选中)

<StackPanel Grid.Row="0" Grid.Column="1">
    <StackPanel.Resources>
        <Style x:Key="Flag" TargetType="RadioButton">
            <Style.Triggers>
                <Trigger Property="IsChecked" Value="False">
                    <Setter Property="Opacity" Value="0.5"/>
                </Trigger>
            </Style.Triggers>

            <Setter Property="BorderThickness" Value="2"/>

            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="RadioButton">
                        <Border BorderThickness="{TemplateBinding BorderThickness}"
                                BorderBrush="{TemplateBinding BorderBrush}"
                                Background="Transparent"
                                CornerRadius="20">                                    
                            <Image Source="{Binding Path=Content, RelativeSource={RelativeSource TemplatedParent}}"/>
                        </Border>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </StackPanel.Resources>

    <ItemsControl>
        <RadioButton Content="../Resources/radio.png" Style="{StaticResource Flag}" BorderBrush="Red" Width="40" Height="40"/>
        <RadioButton Content="../Resources/radio.png" Style="{StaticResource Flag}" BorderBrush="Orange" Width="40" Height="40"/>
        <RadioButton Content="../Resources/radio.png" Style="{StaticResource Flag}" BorderBrush="Green" Width="40" Height="40"/>
    </ItemsControl>
</StackPanel>