使用 Expression Blend 使矩形像 RadioButtons 一样工作答案

【问题标题】：Making Rectangles to work like RadioButtons using Expression Blend使用 Expression Blend 使矩形像 RadioButtons 一样工作
【发布时间】：2013-07-03 23:24:41
【问题描述】：

假设我有 n 个矩形。我希望它们表现得这样，当我单击任何矩形时，它应该被填充为白色，而所有其他矩形都应该被填充为黑色。

我知道我可以创造一种风格。但是在创建样式时，我可以告诉触发器用黑色填充矩形，但我怎么能说用白色填充所有剩余的矩形。

谁能推荐我？我只想要一个小提示。

【问题讨论】：

为什么需要使用矩形？为什么不将RadioButton 模板化为矩形？

标签： wpf xaml radio-button expression-blend rectangles

【解决方案1】：

不要让矩形像RadioButtons 那样工作，让RadioButtons 看起来像矩形。
我建议改用RadioButton 并更改模板以使其看起来像矩形。然后您可以根据RadioButton.IsChecked 属性触发背景更改。这样RadioButton 将负责勾选/取消勾选操作并触发同一组中其他RadioButtons 的背景更改。

<Style TargetType="{x:Type RadioButton}">
   <Setter Property="Template">
       <Setter.Value>
           <ControlTemplate TargetType="{x:Type RadioButton}">
               <Border BorderBrush="Black" BorderThickness="1" Background="Black" x:Name="PART_Border">
                  <ContentPresenter/>  
               </Border> 
               <ControlTemplate.Triggers>
                   <Trigger Property="IsChecked" Value="True">
                       <Setter TargetName="PART_Border" Property="Background" Value="White"/>
                   </Trigger>
               </ControlTemplate.Triggers>
           </ControlTemplate>
       </Setter.Value>
   </Setter>
</Style>

并像这样使用您的RadioButton：

<RadioButton>
   <RadioButton.Content>
      <!-- content to be displayer inside border -->
   </RadioButton.Content>
</RadioButton>

【讨论】：

谢谢。这是你的一个很好的建议。现在我有一个矩形和里面的图像。它们都绑定到一个 ViewBox 中。现在我有 5 个这样的视图框。我试图将它们转换为 RadioButtons。在这里我成功了。但是问题现在出现了。我希望所有五个 RadioButton 都有不同的图像。
@user2524507 更新了我的答案。基本上将ContentPresenter 放在Border 中，当您添加RadioButton 时，将其内容指定为您的图像

【解决方案2】：

您自己已经回答了这个问题。选择两个单选按钮并尝试编辑模板。基本上，当您仔细查看模板时，您会发现一个带有点的椭圆，其可见性在鼠标单击时被关闭

您可以使用具有一定厚度的矩形/边框来代替椭圆，并在鼠标单击时设置其背景颜色

【讨论】：

谢谢。这是你的一个很好的建议。现在我有一个矩形和里面的图像。它们都绑定到一个 ViewBox 中。现在我有 5 个这样的视图框。我试图将它们转换为 RadioButtons。在这里我成功了。但是问题现在出现了。我希望所有五个 RadioButton 都有不同的图像。