2

メトロスタイルのボタンのコンテンツをアニメーション化しようとしています。私の問題は、ボタンの内容の色が変わらないことです。前景色は変わりません。

これが私のボタンのスタイルです：

    <Style x:Key="MetroButtonStyle"
       TargetType="Button">
    <Setter Property="MinWidth"
            Value="40"/>
    <Setter Property="Width"
            Value="100"/>
    <Setter Property="MinHeight"
            Value="88"/>
    <Setter Property="HorizontalAlignment"
            Value="Center"/>
    <Setter Property="Foreground"
            Value="White"/>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="Button">
                <Border x:Name="AppButton"
                        Width="{TemplateBinding Width}"
                        Height="{TemplateBinding Height}">
                    <VisualStateManager.VisualStateGroups>
                        <VisualStateGroup x:Name="CommonStates">
                            <VisualState x:Name="Normal"/>
                            <VisualState x:Name="MouseOver">
                                <Storyboard>
                                    <DoubleAnimation Duration="0"
                                                     To="1"
                                                     Storyboard.TargetProperty="(UIElement.Opacity)"
                                                     Storyboard.TargetName="MouseOverEllipse"/>
                                </Storyboard>
                            </VisualState>
                            <VisualState x:Name="Pressed">
                                <Storyboard>
                                    <DoubleAnimation Duration="0"
                                                     To="1"
                                                     Storyboard.TargetProperty="(UIElement.Opacity)"
                                                     Storyboard.TargetName="PressedEllipse"/>
                                    <ColorAnimation Duration="0"
                                                    To="Black"
                                                    Storyboard.TargetProperty="(Control.Foreground).(SolidColorBrush.Color)"
                                                    Storyboard.TargetName="EllipseInnerContent"/>
                                </Storyboard>
                            </VisualState>
                            <VisualState x:Name="Disabled">
                                <Storyboard>
                                    <ColorAnimation Duration="0"
                                                    To="#7F8D8D8D"
                                                    Storyboard.TargetProperty="(Control.Foreground).(SolidColorBrush.Color)"
                                                    Storyboard.TargetName="EllipseInnerContent"/>
                                </Storyboard>
                            </VisualState>
                        </VisualStateGroup>
                    </VisualStateManager.VisualStateGroups>
                    <StackPanel Orientation="Vertical"
                                HorizontalAlignment="Center">
                        <Grid Margin="0,14,0,5"
                              HorizontalAlignment="Center"
                              MinWidth="40">
                            <Ellipse x:Name="PressedEllipse"
                                     Fill="{TemplateBinding Foreground}"
                                     Opacity="0"
                                     Width="40"
                                     Height="40"/>
                            <Ellipse x:Name="MouseOverEllipse"
                                     Fill="#7F8D8D8D"
                                     Opacity="0"
                                     Width="40"
                                     Height="40"/>
                            <Ellipse Fill="Transparent"
                                     Stroke="{TemplateBinding Foreground}"
                                     StrokeThickness="2"/>
                            <ContentPresenter x:Name="EllipseInnerContent"
                                              Content="{TemplateBinding Content}"
                                              HorizontalAlignment="Center"
                                              VerticalAlignment="Center"/>
                        </Grid>
                        <TextBlock x:Name="LabelText"
                                   TextWrapping="Wrap"
                                   HorizontalAlignment="Center"
                                   FontFamily="Segoe UI"
                                   FontSize="12"
                                   Text="{TemplateBinding Tag}"
                                   Foreground="{TemplateBinding Foreground}"/>
                    </StackPanel>
                </Border>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

これが私の使い方です。これは機能しません:

                        <Button Style="{StaticResource MetroButtonStyle}"
                                Tag="Blah">
                            <TextBlock Text="XXX"/>
                        </Button>

これは機能します：

                        <Button Style="{StaticResource MetroButtonStyle}"
                                Tag="Blah"
                                Content="XXX"/>
4

1 に答える 1

0

あなたが持っている

Storyboard.TargetProperty="(Control.Foreground).(SolidColorBrush.Color)"
Storyboard.TargetName="EllipseInnerContent"

アニメーションでEllipseInnerContentは、はであり、にはプロパティContentPresenterがありません。ForegroundContentPresenter

に変更しContentControlます。

また、をTextBlockコントロールのコンテンツとして配置すると、その一部であるpage\userコントロールのフォアグラウンドが継承されます。DataTemplate代わりに使用して作成TextBlockしてもらうと、ボタンからフォアグラウンドが継承されます。

于 2012-05-25T06:36:13.180 に答える