XAML 悬停时,此处的属性发生了什么变化?

slsn1g29  于 2023-08-01  发布在  其他
关注(0)|答案(1)|浏览(96)

是什么属性导致这个蓝色矩形出现在鼠标悬停这个自定义切换按钮?我有一种感觉,这可能是一个非常愚蠢的问题,但我似乎无法找到答案的搜索。我对XAML有点陌生,但我想我学得很快。下面是鼠标悬停时按钮打开和关闭的图像。
Button on hover
Button off hover
下面是我在资源字典中创建此样式的代码。

<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
    <Style BasedOn="{StaticResource {x:Type ToggleButton}}"
           TargetType="{x:Type ToggleButton}"
           x:Key="ControlButtonToggle">
        <Style.Setters>
            <Setter Property="Background" Value="Transparent"/>
            <Setter Property="BorderThickness" Value="0"/>
            <Setter Property="OverridesDefaultStyle" Value="True"/>
            <Setter Property="Background" Value="Transparent"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="ToggleButton">
                        <Border Background="{TemplateBinding Background}"
                                BorderBrush="{TemplateBinding BorderBrush}"
                                BorderThickness="{TemplateBinding BorderThickness}"
                                CornerRadius="20">
                            <ContentPresenter HorizontalAlignment="Center"
                                              VerticalAlignment="Center"/>
                        </Border>
                        <ControlTemplate.Triggers>
                            <Trigger Property="IsMouseOver" Value="True">
                                <Setter Property="Background" Value="Yellow"/>
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style.Setters>

        <Style.Triggers>
            <!-- TRUE TRIGGER -->
            <Trigger Property="IsChecked"
                     Value="True">
                <Setter Property="Background" Value="LightGreen"/>
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="ToggleButton">
                            <Border CornerRadius="10"
                                    Background="LightGreen"
                                    Width="{TemplateBinding Width}"
                                    Height="{TemplateBinding Height}"
                                    BorderBrush="Green"
                                    BorderThickness="2">
                                <Grid>
                                    <Rectangle StrokeThickness="1"/>
                                    <Button Margin="1"
                                            Content="Enabled"
                                            BorderThickness="0"
                                            Background="Transparent"
                                            VerticalContentAlignment="Center"
                                            Padding="5"
                                            Foreground="Black"
                                            BorderBrush="Green"/>
                                </Grid>
                            </Border>
                            <ControlTemplate.Triggers>
                                <Trigger Property="IsMouseOver" Value="True">
                                    <Setter Property="Opacity" Value="0.8"/>
                                </Trigger>
                            </ControlTemplate.Triggers>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Trigger>

            <!-- FALSE TRIGGER -->
            <Trigger Property="IsChecked"
                     Value="False">
                <Setter Property="Background" Value="#FFFF5454"/>
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="ToggleButton">
                            <Border CornerRadius="10"
                                    Background="#FFFF5454"
                                    Width="{TemplateBinding Width}"
                                    Height="{TemplateBinding Height}"
                                    BorderBrush="Red"
                                    BorderThickness="2">
                                <Grid>
                                    <Rectangle StrokeThickness="1"/>
                                    <Button Margin="1"
                                            Content="Disabled"
                                            BorderThickness="0"
                                            Background="Transparent"
                                            VerticalContentAlignment="Center"
                                            Padding="5"
                                            Foreground="Black"
                                            BorderBrush="Red"/>
                                </Grid>
                            </Border>
                            <ControlTemplate.Triggers>
                                <Trigger Property="IsMouseOver" Value="True">
                                    <Setter Property="Opacity" Value="0.8"/>
                                </Trigger>
                            </ControlTemplate.Triggers>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Trigger>
        </Style.Triggers>
    </Style>
</ResourceDictionary>

字符串
我试过让OnMouseHover的ControlTemplate.Trigger改变背景,我也在ControlTemplate本身之外做了一个通用触发器,但似乎都不起作用。我已经搜索了这种风格的元素的属性,但我似乎不能弄清楚是什么导致了这种外观。我想要么变暗整个圆形领域悬停,或只是使这个属性只是透明的光标变化悬停反正。任何帮助是非常感谢,我道歉,如果这是一个非常简单的问题哈哈。

z5btuh9x

z5btuh9x1#

现在我甚至不能点击你的ToggleButton将其状态更改为:开启/关闭
1.这个矩形是你的ToggleButton里面的Button造成的,为什么不用Label或者TextBlock?如果你这样做,然后不要忘记添加到您的网格HorizontalAlignment="Center"中心后,您的文本。
1.或者如果你不想摆脱你的按钮,你可以添加:IsHitTestVisible="False"到这两个按钮禁用他们的风格/点击/互动,但这不是真的很好。
1.或者在触发IsMouseOver时,在您的[ToggleButton]中更改[Buttons]的[Background]。

相关问题