Question

我正致力于创建此控件：

我发现图形表示比代码更能描述控件：

以及我如何称呼它：

<local:MagicalButton Content="Watch Now" SubTitle="Movie: " FontSize="10" FontStretch="Condensed" FontWeight="Bold" HorizontalAlignment="Center" Style="{StaticResource newBtn}" 
x:Name="togg" ItemsSource="{Binding Movies}"/>

所以ToggleButton是控件的基类，我覆盖了它的模板，但这是不公平的，因为控件由三个相等的部分组成（功能和职责）：

ToggleButton（或可能是Expander）
ListBox
按钮（不退出）

目前的实施有一个优点：每当ToggleButton的IsChecked发生变化时，我都可以为列表框的高度设置动画，因为ListBox位于ToggleButton的模板中：

  <ControlTemplate.Triggers>
                            <Trigger Property="IsChecked" Value="true">
                                <Trigger.EnterActions>
                                    <BeginStoryboard>
                                        <Storyboard>
                                            <DoubleAnimation Storyboard.TargetName="rotRect" Storyboard.TargetProperty="Angle" From="0" To="90" Duration="0:0:0.5"/>
                                            <DoubleAnimation Storyboard.TargetName="lstBx" Storyboard.TargetProperty="Height" From="0" To="60" Duration="0:0:0.5"/>
                                        </Storyboard>
                                    </BeginStoryboard>
                                </Trigger.EnterActions>
                                <Trigger.ExitActions>
                                    <BeginStoryboard>
                                        <Storyboard>
                                            <DoubleAnimation Storyboard.TargetName="rotRect" Storyboard.TargetProperty="Angle" From="90" To="0" Duration="0:0:0.5"/>
                                            <DoubleAnimation Storyboard.TargetName="lstBx" Storyboard.TargetProperty="Height" From="60" To="0" Duration="0:0:0.5"/>
                                        </Storyboard>
                                    </BeginStoryboard>
                                </Trigger.ExitActions>
                            </Trigger>
                            <Trigger Property="IsMouseOver" Value="true">
                                <Setter Property="Cursor" Value="Hand"/>
                            </Trigger>
                        </ControlTemplate.Triggers>

但有一些缺点：

我无法定义一个绑定到ListBox中所选项目的按钮（它既困难又复杂）
我无法将切换区域限制在三角形区域，因此控件的右侧部分仍可用作切换按钮，并且无法为其指定特殊功能（按钮）将点击处理程序绑定到所选项目。

所以我想重组控件并将基类更改为更通用的ContentControl：

但是现在我没有从ToggleButton控制ListBox，这让我陷入了隔离通用容器中每个控件的障碍可能会影响它们之间的通信（连续的部分无法进行通信彼此相对，但更高的控件可以与较低的控件进行通信 - 在之前的实现中，ToggleButton和ListBox，但现在我无法从Toggle Button控制ListBox的属性，同样按钮也不能被绑定到ListBox的选定项目

所以我想要实现的目标： - 首先;保持相同的风格 - 左侧部分是一个切换按钮，只能为ListBox的高度设置动画 - 右边的部分是一个Button，它绑定到ListBox中的选定项目

总结一下，主要的问题是什么是最合适的基本控件，我可以覆盖它的模板以包含所有这三个控件，以及如何构建它以便我可以实现它们之间的通信：

我试图尽可能详细地描述问题，希望找到一些帮助

这是第一个代码实现： https://gist.github.com/mshwf/b30364049d1d8291a877e7a9a574d4dc

和新的实施： https://github.com/mshwf/WPFTest/blob/master/WPFTest/MagicButton.xaml

从多个控件合成创建自定义控件的正确方法？

0 个答案: