【发布时间】：2013-07-14 08:22:55
【问题描述】：
现在我有一个ToggleButton 样式，然后我将Chrome.Visibility = Visibility.Hidden 设置为隐藏了ToggleButton，但事实并非如此。
我使用 snoop，发现 ToggleButton's Visibility 是可见。如何更改 ToggleButton's 样式的可见性？
风格如下：
<Style x:Key="ToggleButtonStyle"
TargetType="{x:Type ToggleButton}">
<Setter Property="FocusVisualStyle"
Value="{StaticResource ButtonFocusVisual}" />
<Setter Property="Background"
Value="{StaticResource ButtonNormalBackground}" />
<Setter Property="BorderBrush"
Value="{StaticResource ButtonNormalBorder}" />
<Setter Property="BorderThickness"
Value="1" />
<Setter Property="Foreground"
Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}" />
<Setter Property="HorizontalContentAlignment"
Value="Center" />
<Setter Property="VerticalContentAlignment"
Value="Center" />
<Setter Property="Padding"
Value="1" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type ToggleButton}">
<ControlTemplate.Resources>
<Storyboard x:Key="go">
<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)"
Storyboard.TargetName="grid">
<DiscreteObjectKeyFrame KeyTime="0:0:0.5"
Value="{x:Static Visibility.Collapsed}" />
</ObjectAnimationUsingKeyFrames>
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[2].(RotateTransform.Angle)"
Storyboard.TargetName="grid">
<EasingDoubleKeyFrame KeyTime="0:0:0.5"
Value="720" />
</DoubleAnimationUsingKeyFrames>
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleX)"
Storyboard.TargetName="grid">
<EasingDoubleKeyFrame KeyTime="0:0:0.5"
Value="0.15" />
</DoubleAnimationUsingKeyFrames>
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleY)"
Storyboard.TargetName="grid">
<EasingDoubleKeyFrame KeyTime="0:0:0.5"
Value="0.15" />
</DoubleAnimationUsingKeyFrames>
</Storyboard>
</ControlTemplate.Resources>
<Grid x:Name="grid"
RenderTransformOrigin="0.5,0.5">
<Grid.RenderTransform>
<TransformGroup>
<ScaleTransform />
<SkewTransform />
<RotateTransform />
<TranslateTransform />
</TransformGroup>
</Grid.RenderTransform>
<Border x:Name="Chrome"
BorderThickness="5"
CornerRadius="10"
BorderBrush="#FFD7FF25"
Grid.ColumnSpan="2">
<ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
Margin="{TemplateBinding Padding}"
RecognizesAccessKey="True"
SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"
VerticalAlignment="{TemplateBinding VerticalContentAlignment}" />
</Border>
<Button x:Name="button"
HorizontalAlignment="Right"
VerticalAlignment="Top"
Height="16.333"
Width="Auto"
Background="#FFD7FF25"
Foreground="#FFFF0B0B"
HorizontalContentAlignment="Center"
VerticalContentAlignment="Center"
BorderBrush="#FFD7FF25"
Padding="0,-6,0,0"
FontSize="16"
Margin="0,-4.167,-3.334,0"
Content="x"
Focusable="False"
Visibility="Collapsed"
Click="Button_OnClick"
BorderThickness="1" />
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver"
Value="True"
SourceName="grid">
<Setter Property="Visibility"
TargetName="button"
Value="Visible" />
<Setter Property="BorderBrush"
TargetName="Chrome"
Value="#FF4DFF25" />
<Setter Property="BorderBrush"
TargetName="button"
Value="#FF4DFF25" />
<Setter Property="Background"
TargetName="button"
Value="#FF4DFF25" />
</Trigger>
<EventTrigger RoutedEvent="ButtonBase.Click"
SourceName="button">
<BeginStoryboard x:Name="go_BeginStoryboard"
Storyboard="{StaticResource go}" />
</EventTrigger>
<Trigger Property="IsChecked"
Value="true">
<Setter Property="BorderBrush"
TargetName="Chrome"
Value="Red" />
</Trigger>
<Trigger Property="IsEnabled"
Value="false">
<Setter Property="Foreground"
Value="#ADADAD" />
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
当你鼠标点击时，ToggleButton 会显示一个Button 和X，点击它，这个ToggleButton 会消失。
Note: 把ToggleButton放在一个WrapPanel里，不止一个，可以看WrapPanel前面的空白。
【问题讨论】：
-
请写一些关于这个问题的代码。
-
我不能放图片。我在样式中编辑切换按钮的内容，现在网格是它的根元素，我在样式中更改了网格的可见性，但切换按钮的可见性没有改变（我在snoop(a spy++ for wpf))，它留下一个空白。我不知道在 Style 中设置切换按钮的可见性。
-
我运行了您的示例。有一个绿色按钮，当您将鼠标悬停时，红十字会出现。我点击
X的切换按钮消失了。你有同样的工作吗？如果是这样，你应该怎么做？ -
@Anatoliy Nikolaev 谢谢，你可以这样做，把togglebutton放在一个wrappanel中，越来越多，点击x关闭它，你可以在wrappanel前面看一个空白
-
嗯，这是正常行为。有一个面板，里面有他们的按钮。您将按钮隐藏在它的位置有一个空的地方。您要删除隐藏按钮的空白区域吗？
标签： wpf styles mouseevent visibility togglebutton