Question

我正在尝试制作一个由多个按钮和几个标签组成的自定义控件，但这些按钮应该是不可见的，只显示其中的内容。我可以通过将它们设置为透明来消除边框，背景等。但每当我将它们鼠标移动时，默认的窗口悬停效果会再次显示整个按钮。我已经尝试了很多关于自定义控件的指南，但最终还是无法弄清楚如何覆盖它。基本上我的问题归结为，在generic.xaml文件中可以放置多少，我必须在该文件中使用哪个组织，还有其他任何地方应该使用这些样式吗？我确实意识到这是一个非常基本的问题，但它只是让我疯狂无法弄清楚具体的答案。谢谢！

当前的xaml：

<Style TargetType="{x:Type local:TimePicker}">
    <Setter Property="Background" Value="Transparent" />
    <Setter Property="BorderBrush" Value="Transparent" />
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type local:TimePicker}">
                <Border Background="{TemplateBinding Background}"
                        BorderBrush="{TemplateBinding BorderBrush}"
                        BorderThickness="{TemplateBinding BorderThickness}"
                        Height="{TemplateBinding Height}"
                        Width="{TemplateBinding Width}">
                    <StackPanel Orientation="Horizontal">
                        <StackPanel x:Name="PART_Root"
                                    Orientation="Horizontal"
                                    HorizontalAlignment="Center">
                            <ToggleButton x:Name="PART_HourButton"
                                          HorizontalAlignment="Center"
                                          VerticalAlignment="Center"
                                          Margin="0"
                                          Background="Transparent"
                                          BorderBrush="Transparent"
                                          BorderThickness="0"
                                          Height="{Binding ElementName=PART_IncDecPanel, Path=ActualHeight}"
                                          Width="{Binding ElementName=PART_HourButton, Path=ActualHeight}"
                                          Content="{Binding RelativeSource={RelativeSource TemplatedParent},Path=Hour}">
                                                                    <ToggleButton.Triggers>
                                    <Trigger Property="IsMouseOver" Value="True">
                                        <Setter Property="Background" Value="Transparent" />
                                    </Trigger>
                                </ToggleButton.Triggers>
                            </ToggleButton>
                            <Label x:Name="PART_HourMinSeparator"
                                   HorizontalAlignment="Center"
                                   VerticalAlignment="Center"
                                   Margin="0"
                                   Content=":" />
                            <ToggleButton x:Name="PART_MinButton"
                                          HorizontalAlignment="Center"
                                          VerticalAlignment="Center"
                                          Margin="0"
                                          Background="Transparent"
                                          BorderBrush="Transparent"
                                          BorderThickness="0"
                                          Height="{Binding ElementName=PART_HourButton, Path=ActualHeight}"
                                          Width="{Binding ElementName=PART_HourButton, Path=ActualWidth}"
                                          Content="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=Minute}" />
                            <StackPanel x:Name="PART_IncDecPanel" HorizontalAlignment="Center" VerticalAlignment="Center">
                                <Button x:Name="PART_IncreaseTime"
                                        Background="Transparent"
                                        BorderBrush="Transparent"
                                        BorderThickness="0"
                                        HorizontalAlignment="Center"
                                        HorizontalContentAlignment="Center"
                                        VerticalAlignment="Center"
                                        VerticalContentAlignment="Center"
                                        Margin="0"
                                        Padding="0"
                                        Width="22"
                                        Height="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=IncreaseImage.ActualHeight}">
                                    <Image Source="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=IncreaseImage}" />
                                </Button>
                                <Button x:Name="PART_DecreaseTime"
                                        Background="Transparent"
                                        BorderBrush="Transparent"
                                        BorderThickness="0"
                                        HorizontalContentAlignment="Center"
                                        HorizontalAlignment="Center"
                                        VerticalAlignment="Center"
                                        VerticalContentAlignment="Center"
                                        Margin="0"
                                        Padding="0"
                                        Height="{Binding ElementName=PART_IncreaseTime, Path=ActualHeight}"
                                        Width="{Binding ElementName=PART_IncreaseTime, Path=ActualWidth}">
                                    <Image Source="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=DecreaseImage}" />
                                </Button>
                            </StackPanel>
                        </StackPanel>
                    </StackPanel>
                </Border>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

Answer 1

WPF使用“无视控件”，这基本上意味着您可以更改控件的整个可视部分（在设计或运行时），而无需更改其代码或该代码的行为。您已经在使用此概念为TimePicker控件创建默认样式。如果要从该样式中删除ControlTemplate，则在运行时将看不到任何内容，因为控件本身只是C＃或VB代码中定义的行为。

由于听起来您希望保持按钮的行为，但完全改变外观，这是重新模板化的理想方案。这是一个非常简单的示例，仅显示内容（在ContentPresenter中）：

<Button Content="Hello Template">
    <Button.Template>
        <ControlTemplate TargetType="{x:Type Button}">
            <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                                VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
        </ControlTemplate>
    </Button.Template>
</Button>

您可能希望在模板中添加更多内容，例如用于捕捉鼠标输入的透明边框以及一些触发器。您在示例中尝试在ToggleButton上使用Trigger的方式不正确（FrameworkElement触发器集合仅适用于EventTriggers），但在ControlTemplate或Style中，该模式将起作用。

如果要将相同的Style应用于TimePicker ControlTemplate中的每个Button，可以将默认的Button Style添加到ControlTemplate的Resources集合中：

<ControlTemplate TargetType="{x:Type MyControl}">
    <ControlTemplate.Resources>
        <Style TargetType="{x:Type Button}">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type Button}">
                        <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                            VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </ControlTemplate.Resources>
    ...
</ControlTemplate>

自定义控件样式/触发器

1 个答案: