添加触发器以切换按钮样式 - > XML

时间:2011-02-20 18:29:55

标签: wpf expression-blend

您好 我想添加触发器以混合生成的XML。我现在在混合中创建了切换按钮我想添加触发器属性以在选中按钮时切换前景(否则为蓝色,白色)。 这是我的XML(在VS 2010中粘贴和使用)

                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                         
                                                                                                                                                                                                                                                                                                                            

                    <Border x:Name="border" BorderBrush="Transparent" BorderThickness="1" CornerRadius="7,7,0,0">
                        <Border.Background>
                            <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                                <GradientStop Color="#FF024592"/>
                                <GradientStop Color="#FF003D8B" Offset="1"/>
                            </LinearGradientBrush>
                        </Border.Background>
                    </Border>
                    <Grid>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="Auto"/>
                            <ColumnDefinition Width="*"/>
                        </Grid.ColumnDefinitions>
                        <Image Source="{Binding RelativeSource={RelativeSource Mode=TemplatedParent}, Path=Tag}" Margin="5,5,0,5"/>
                        <ContentPresenter Grid.Column="1" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
                    </Grid>
                </Grid>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsChecked" Value="True">
                        <Setter Property="Foreground" Value="Blue"/>
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

1 个答案:

答案 0 :(得分:1)

为前景添加了触发器。还在内容文本绑定的左侧添加了一个ImageToggleButton的Tag属性。如果您不想使用Tag

,也可以将ToggleButton子类化并添加BitmapImage属性或使用附加属性
<Window.Resources>
<Style x:Key="MenuButtonStyle" TargetType="{x:Type ToggleButton}">
    <Setter Property="Foreground" Value="White"/>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type ToggleButton}">
                <Grid>
                        <VisualStateManager.VisualStateGroups>
                        <VisualStateGroup x:Name="CommonStates">
                            <VisualState x:Name="Normal"/>
                            <VisualState x:Name="MouseOver">
                                <Storyboard>
                                    <ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Panel.Background).(GradientBrush.GradientStops)[0].(GradientStop.Color)" Storyboard.TargetName="border">
                                        <EasingColorKeyFrame KeyTime="0" Value="#FF309BFF"/>
                                    </ColorAnimationUsingKeyFrames>
                                </Storyboard>
                            </VisualState>
                            <VisualState x:Name="Pressed">
                                <Storyboard>
                                    <ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Panel.Background).(GradientBrush.GradientStops)[0].(GradientStop.Color)" Storyboard.TargetName="border">
                                        <EasingColorKeyFrame KeyTime="0" Value="#FF0962B4"/>
                                    </ColorAnimationUsingKeyFrames>
                                    <ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Panel.Background).(GradientBrush.GradientStops)[1].(GradientStop.Color)" Storyboard.TargetName="border">
                                        <EasingColorKeyFrame KeyTime="0" Value="#FF093664"/>
                                    </ColorAnimationUsingKeyFrames>
                                </Storyboard>
                            </VisualState>
                            <VisualState x:Name="Disabled"/>
                        </VisualStateGroup>
                        <VisualStateGroup x:Name="CheckStates">
                            <VisualState x:Name="Checked">
                                <Storyboard>
                                    <ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Panel.Background).(GradientBrush.GradientStops)[1].(GradientStop.Color)" Storyboard.TargetName="border">
                                        <EasingColorKeyFrame KeyTime="0" Value="WhiteSmoke"/>
                                    </ColorAnimationUsingKeyFrames>                                            
                                    <ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Panel.Background).(GradientBrush.GradientStops)[0].(GradientStop.Color)" Storyboard.TargetName="border">
                                        <EasingColorKeyFrame KeyTime="0" Value="#FFE2E3E5"/>
                                    </ColorAnimationUsingKeyFrames>
                                </Storyboard>
                            </VisualState>
                            <VisualState x:Name="Unchecked"/>
                            <VisualState x:Name="Indeterminate"/>
                        </VisualStateGroup>
                    </VisualStateManager.VisualStateGroups>

                    <Border x:Name="border" BorderBrush="Transparent" BorderThickness="1" CornerRadius="7,7,0,0">
                        <Border.Background>
                            <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                                <GradientStop Color="#FF024592"/>
                                <GradientStop Color="#FF003D8B" Offset="1"/>
                            </LinearGradientBrush>
                        </Border.Background>
                    </Border>
                    <Grid>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="Auto"/>
                            <ColumnDefinition Width="*"/>
                        </Grid.ColumnDefinitions>
                        <Image Source="{Binding RelativeSource={RelativeSource Mode=TemplatedParent}, Path=Tag}" Margin="5,5,0,5"/>
                        <ContentPresenter Grid.Column="1" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
                    </Grid>
                </Grid>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsChecked" Value="True">
                        <Setter Property="Foreground" Value="Blue"/>
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

可用(在边框中使用此代码将有助于其他明智的扩展)

<ToggleButton Style="{StaticResource MenuButtonStyle}"
              Tag="C:\TestImage.png"
              Content="Test ToggleButton" />