1

现在我有了一种ToggleButton风格，然后我将Chrome.Visibility = Visibility.Hidden它设置为ToggleButton隐藏的，但事实并非如此。

我使用窥探，找出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。

4

2 回答 2

0

您可以像这样添加可见性设置器..

 <Style TargetType="Button" x:Key="hello" >
        <Setter Property="Visibility" Value="Visible">

        </Setter>
    </Style>

在这样的任何按钮上使用 thi..

<Button Style="{Binding Source={StaticResource hello}}" Width="100" Background="Red" Height="100" />

希望这会有所帮助..查询请在下面发表评论..

于 2013-07-16T09:01:04.293 回答
0

如果我理解正确，动画会正常工作，ToggleButton消失。但是你希望他从面板上消失（WrapPanel）释放的地方和相邻的元素移动了他。

您的示例不起作用，因为在您指定的动画中Grid：

<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="grid">
     <DiscreteObjectKeyFrame KeyTime="0:0:0.5" Value="{x:Static Visibility.Collapsed}" />
</ObjectAnimationUsingKeyFrames>

而他，正如我们所知道的，好东西消失了。物理上，ToggleButton还在内存中，所以你只是躲在 中Grid，所以你可以看到它的空白空间。

你必须为所有的 制作动画ToggleButtons，然后它就会消失并且不会留下空白空间。也就是说，在属性中TargetName指定自身ToggleButton。一个简单的例子：

    <WrapPanel MinWidth="100" Width="200">
        <WrapPanel.Triggers>
            <EventTrigger RoutedEvent="Button.Click" SourceName="MyButton1">
                <BeginStoryboard>
                    <Storyboard>
                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="MyButton1">
                            <DiscreteObjectKeyFrame KeyTime="0:0:0.5" Value="{x:Static Visibility.Collapsed}" />
                        </ObjectAnimationUsingKeyFrames>
                    </Storyboard>
                </BeginStoryboard>
            </EventTrigger>

            <EventTrigger RoutedEvent="Button.Click" SourceName="MyButton2">
                <BeginStoryboard>
                    <Storyboard>
                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="MyButton2">
                            <DiscreteObjectKeyFrame KeyTime="0:0:0.5" Value="{x:Static Visibility.Collapsed}" />
                        </ObjectAnimationUsingKeyFrames>
                    </Storyboard>
                </BeginStoryboard>
            </EventTrigger>

            <EventTrigger RoutedEvent="Button.Click" SourceName="MyButton3">
                <BeginStoryboard>
                    <Storyboard>
                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="MyButton3">
                            <DiscreteObjectKeyFrame KeyTime="0:0:0.5" Value="{x:Static Visibility.Collapsed}" />
                        </ObjectAnimationUsingKeyFrames>
                    </Storyboard>
                </BeginStoryboard>
            </EventTrigger>
        </WrapPanel.Triggers>

        <ToggleButton Name="MyButton1" Style="{StaticResource ToggleButtonStyle}" Width="30" Height="30" />
        <ToggleButton Name="MyButton2" Style="{StaticResource ToggleButtonStyle}" Width="30" Height="30" />
        <ToggleButton Name="MyButton3" Style="{StaticResource ToggleButtonStyle}" Width="30" Height="30" />            
    </WrapPanel>
于 2013-07-16T11:39:53.823 回答