按钮点击触发故事板

时间:2016-06-23 17:42:07

标签: c# wpf xaml triggers styles

我有一个包含一些按钮的Stackpanel。

(这些按钮的作用是什么,每一个按钮都将一个页面加载到一个框架上)

<StackPanel x:Name="Buttons" HorizontalAlignment="Left" VerticalAlignment="Top" Height="64" Width="1100" Orientation="Horizontal" Margin="0,31,0,0">
        <Button x:Name="AjoutButton" Width="64" Content="" Style="{DynamicResource MyButton}" Click="AjoutPressed">
            <Button.Background>
                <ImageBrush ImageSource="Backgrounds/Buttons/AjoutButton.png" Stretch="UniformToFill" AlignmentX="Left"/>
            </Button.Background>
        </Button>
        <Button x:Name="ConsulterButton" Width="64" Content="" Style="{DynamicResource MyButton}" Click="ConsulterPressed">
            <Button.Background>
                <ImageBrush ImageSource="Backgrounds/Buttons/ConsultationButton.png" Stretch="UniformToFill"  AlignmentX="Left"/>
            </Button.Background>
        </Button>
    </StackPanel>

这些按钮的样式称为&#34; MyButton&#34;。

<Style x:Key="MyButton" TargetType="{x:Type Button}">
        <Setter Property="FocusVisualStyle">
            <Setter.Value>
                <Style>
                    <Setter Property="Control.Template">
                        <Setter.Value>
                            <ControlTemplate>
                                <Rectangle Margin="2" SnapsToDevicePixels="True" Stroke="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}" StrokeThickness="1" StrokeDashArray="1 2"/>
                            </ControlTemplate>
                        </Setter.Value>
                    </Setter>
                </Style>
            </Setter.Value>
        </Setter>
        <Setter Property="BorderBrush" Value="#FF707070"/>
        <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/>
        <Setter Property="BorderThickness" Value="0"/>
        <Setter Property="HorizontalContentAlignment" Value="Center"/>
        <Setter Property="VerticalContentAlignment" Value="Center"/>
        <Setter Property="Padding" Value="1"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type Button}">
                    <Border x:Name="border" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" SnapsToDevicePixels="True">
                        <ContentPresenter x:Name="contentPresenter" ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}" ContentStringFormat="{TemplateBinding ContentStringFormat}" Focusable="False" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
                    </Border>
                    <ControlTemplate.Triggers>
                        <MultiTrigger>
                            <MultiTrigger.Conditions>
                                <Condition Property="IsMouseOver" Value="True" />
                            </MultiTrigger.Conditions>
                            <MultiTrigger.EnterActions>
                                <BeginStoryboard>
                                    <Storyboard >
                                        <DoubleAnimation Storyboard.TargetProperty="Width" From="64" Duration="0:0:.2" To="200"/>
                                    </Storyboard>
                                </BeginStoryboard>
                            </MultiTrigger.EnterActions>
                            <MultiTrigger.ExitActions>
                                <BeginStoryboard>
                                    <Storyboard >
                                        <DoubleAnimation Storyboard.TargetProperty="Width" From="200" Duration="0:0:.2" To="64"/>
                                    </Storyboard>
                                </BeginStoryboard>
                            </MultiTrigger.ExitActions>
                        </MultiTrigger>                                                   
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

此样式的作用是,当鼠标进入时,它会将按钮宽度更改为200,当鼠标离开时,它会将bac更改为64。 基本上我想做的是我想在按下按钮时将宽度保持在200,但它并不那么简单,因为我想要当按下相同风格的另一个按钮时我想要第一个按钮去回到正常宽度(64)然后我想最近按下的按钮的宽度等于200。

我想我需要解释一下。 例如:

(只是为了澄清:鼠标进入/离开触发器工作正常,所以没有任何问题)

让我们选择AjoutButton和ConsulterButton,当我点击AjoutButton时,我希望它的宽度保持在200(因为MouseOver是真的,它已经是200),现在当我点击ConsulterButton时我想要它宽度保持在200,AjoutButton的宽度回到64。

你可能会说,我可以使用IsFocused属性,但它不会完美地工作,因为在我的项目中我有一个Frame,当我专注于它时,Button的宽度会回到64.

我花了很多时间在这个问题的搜索解决方案,但没有找到.. 问题是我是新手,所以我真的不知道在谷歌写什么,你们甚至可以从这篇文章的标题中说出来。

0 个答案:

没有答案