如何将扩展控件的切换按钮图标更改为“+”和“-”而不是箭头

Question

我想将扩展器控件的切换按钮图标的图标更改为“+”和“-”而不是箭头...我已经尝试对 Blend 做同样的事情...但我无法做到这一点。任何人都可以帮助实现这一目标......

Answer 1

您需要将模板编辑几层。

1) 在 Blend 中，选择 Expander > Edit Template > Edit a Copy

这将创建一个扩展器样式，但会打开样式内的“扩展器模板”。

2) 打开 DockPanel 并找到“HeaderSite”切换按钮。再次选择编辑模板 > 编辑副本。

这将创建一个切换按钮样式并打开“切换按钮模板”进行编辑。

3) 打开边框内的网格并找到“箭头”和“圆圈”路径。您需要将这些替换为所需的图形。

目前我不确定是什么导致箭头翻转。我以为它会是视觉状态，但它们似乎没有在模板中设置。话虽如此，我的猜测是您将希望使用视觉状态来控制您在什么时间显示哪个图像。由于这是一个 ToggleButton，请检查 Checked 和 Unchecked 状态。

编辑：扩展器模板中的 HeaderSite ToggleButton IsChecked 属性正在驱动箭头的翻转。它的值是模板绑定到父级的 IsExpanded 属性。 ToggleButton Style 有一个 ControlTemplate 触发器，当 IsChecked 为 True 时，它​​会覆盖箭头 Path 的 Data 属性。

如果您按照自己的意愿替换箭头属性，则需要替换此功能。我仍然认为视觉状态会比 ControlTemplate 触发器更可取。