是什么属性导致这个蓝色矩形出现在鼠标悬停这个自定义切换按钮?我有一种感觉,这可能是一个非常愚蠢的问题,但我似乎无法找到答案的搜索。我对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本身之外做了一个通用触发器,但似乎都不起作用。我已经搜索了这种风格的元素的属性,但我似乎不能弄清楚是什么导致了这种外观。我想要么变暗整个圆形领域悬停,或只是使这个属性只是透明的光标变化悬停反正。任何帮助是非常感谢,我道歉,如果这是一个非常简单的问题哈哈。
1条答案
按热度按时间z5btuh9x1#
现在我甚至不能点击你的ToggleButton将其状态更改为:开启/关闭
1.这个矩形是你的ToggleButton里面的Button造成的,为什么不用Label或者TextBlock?如果你这样做,然后不要忘记添加到您的网格
HorizontalAlignment="Center"
中心后,您的文本。1.或者如果你不想摆脱你的按钮,你可以添加:
IsHitTestVisible="False"
到这两个按钮禁用他们的风格/点击/互动,但这不是真的很好。1.或者在触发IsMouseOver时,在您的[ToggleButton]中更改[Buttons]的[Background]。