如何在ToggleButton选中、ComboBox展开时修改ToggleButton的底部边框圆角？

解决方案 #

你可以通过给ToggleButton内部的Border样式添加数据触发器，绑定ToggleButton的IsChecked属性（已经关联ComboBox的下拉展开状态），动态修改圆角值实现效果，需要修改的代码如下：

1. 修改左侧ToggleButton的资源样式

找到ComboBox模板中第一个PART_EditableTextBox对应的ToggleButton，修改其内部的Border样式，新增展开状态的圆角规则：

<ToggleButton Name="PART_EditableTextBox"            
              Style="{StaticResource MyButton}"                  
              IsChecked="{Binding Path=IsDropDownOpen, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}}"
              Padding="5,0,0,0" BorderThickness="0"
              Height="{TemplateBinding Height}">
    <ToggleButton.Resources>
        <Style TargetType="{x:Type Border}">
            <Setter Property="CornerRadius" Value="10 0 0 10"/>
            <!-- 新增触发器，下拉展开时去掉底部圆角 -->
            <Style.Triggers>
                <DataTrigger Binding="{Binding IsChecked, RelativeSource={RelativeSource AncestorType=ToggleButton}}" Value="True">
                    <Setter Property="CornerRadius" Value="10 0 0 0"/>
                </DataTrigger>
            </Style.Triggers>
        </Style>
    </ToggleButton.Resources>
</ToggleButton>

2. 修改右侧带箭头的ToggleButton资源样式

同理修改第二个ToggleButton的Border样式：

<ToggleButton Grid.Column="1" Margin="0" Background="#2C2F33"
             Height="{TemplateBinding Height}" Style="{StaticResource MyButton}"
             Focusable="False" BorderThickness="0" 
             IsChecked="{Binding Path=IsDropDownOpen, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}}"
             ClickMode="Press">
    <Path Grid.Column="1" 
          HorizontalAlignment="Center"
          VerticalAlignment="Center" 
          Data="M 0 0 L 4 4 L 8 0 Z"
          Fill="LightBlue" />
    <ToggleButton.Resources>
        <Style TargetType="{x:Type Border}">
            <Setter Property="CornerRadius" Value="0 10 10 0"/>
            <!-- 新增触发器，下拉展开时去掉底部圆角 -->
            <Style.Triggers>
                <DataTrigger Binding="{Binding IsChecked, RelativeSource={RelativeSource AncestorType=ToggleButton}}" Value="True">
                    <Setter Property="CornerRadius" Value="0 10 0 0"/>
                </DataTrigger>
            </Style.Triggers>
        </Style>
    </ToggleButton.Resources>
</ToggleButton>

3. 修正MyButton样式中空的触发器

你的ToggleButton样式中IsChecked触发器当前没有指定目标和属性，补充完整避免报错：

<Trigger Property="IsChecked" Value="True">
    <Setter TargetName="border" Property="Opacity" Value="0.8" />
</Trigger>

补充说明 #

修改后下拉展开时两个ToggleButton的底部圆角会自动变为0，和你已经设置为顶部直角的下拉框DropDownBorder（CornerRadius为0 0 7 7）完美衔接。如果出现衔接间隙，可以给Popup控件添加PlacementOffset="0,-1"属性调整位置，消除缝隙。

内容的提问来源于stack exchange，提问作者user16713737