0

画像を使用してSilverlightでボタンを作成し、ボタンをクリック可能に見せるための基本的な効果を付けたいと思います。.pngアイコンを作成し、ストーリーボードのマウスオーバーでこの画像を少し大きくするコードを記述しました。このようなことをしようとするのはこれが初めてなので、静的リソースの1つへの単純な呼び出しを省略したと思います。私は何が欠けていますか?:

<Style TargetType="Button"
                 x:Key="styleA">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="Button">
                        <Grid x:Name="RootElement"
                            Background="Transparent">
                            <Grid.Resources>
                                <Storyboard x:Key="MouseOver State">
                                    <DoubleAnimation Storyboard.TargetName="buttonScale"
                                                Storyboard.TargetProperty="ScaleX"
                                                To="1.2"
                                                Duration="00:00:00.25"/>
                                    <DoubleAnimation Storyboard.TargetName="buttonScale"
                                                Storyboard.TargetProperty="ScaleY"
                                                To="1.2"
                                                Duration="00:00:00.25" />
                                </Storyboard>

                                <Storyboard x:Key="Normal State">
                                    <DoubleAnimation Storyboard.TargetName="buttonScale"
                                                Storyboard.TargetProperty="ScaleX"
                                                To="1"
                                                Duration="00:00:00.25" />
                                    <DoubleAnimation Storyboard.TargetName="buttonScale"
                                                Storyboard.TargetProperty="ScaleY"
                                                To="1"
                                                Duration="00:00:00.25" />
                                </Storyboard>

                                <Storyboard x:Key="Pressed State">
                                    <DoubleAnimation Storyboard.TargetName="buttonScale"
                                                Storyboard.TargetProperty="ScaleX"
                                                To="1.4"
                                                Duration="00:00:00.25" />
                                    <DoubleAnimation Storyboard.TargetName="buttonScale"
                                                Storyboard.TargetProperty="ScaleY"
                                                To="1.4"
                                                Duration="00:00:00.25" />
                                </Storyboard>


                            </Grid.Resources>
                            <ContentPresenter Content="{TemplateBinding Content}"
                                           RenderTransformOrigin="0.5,0.5">
                                <ContentPresenter.RenderTransform>
                                    <ScaleTransform x:Name="buttonScale" />
                                </ContentPresenter.RenderTransform>
                            </ContentPresenter>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>

            </Setter>
        </Style>

ご覧のとおり、シンプルなストーリーボードです。これで、ボタンを実装しても何も起こりません。私は何が間違っているのですか?ボタンを作成するための私のコードは次のとおりです。

    <StackPanel>
        <Button Width="50"
           x:Name="Test"
           Style="{StaticResource styleA}">
            <StackPanel Orientation="Vertical">
                <Image Source="test.png" />
                <TextBlock Text="Please get bigger" />
            </StackPanel>
        </Button>
    </StackPanel>
4

1 に答える 1

0

ボタンのスタイルとテンプレートを見たことがありますか?VisualStateManager.VisualStateGroups次のように、これらのストーリーボードをの中に配置する必要があります。

<ControlTemplate TargetType="Button">
    <Grid x:Name="RootElement" Background="Transparent">
        <VisualStateManager.VisualStateGroups>
            <VisualStateGroup x:Name="CommonStates">
                <VisualState x:Name="MouseOver">
                    <Storyboard>
                        <DoubleAnimation Storyboard.TargetName="buttonScale" Storyboard.TargetProperty="ScaleX" To="1.2" Duration="00:00:00.25"/>
                        <DoubleAnimation Storyboard.TargetName="buttonScale" Storyboard.TargetProperty="ScaleY" To="1.2" Duration="00:00:00.25" />
                    </Storyboard>
                </VisualState>
                <VisualState x:Name="Pressed">
                    <Storyboard>
                        <DoubleAnimation Storyboard.TargetName="buttonScale" Storyboard.TargetProperty="ScaleX" To="1.4" Duration="00:00:00.25" />
                        <DoubleAnimation Storyboard.TargetName="buttonScale" Storyboard.TargetProperty="ScaleY" To="1.4" Duration="00:00:00.25" />
                    </Storyboard>
                </VisualState>
                <VisualState x:Name="Normal"/>
            </VisualStateGroup>
        </VisualStateManager.VisualStateGroups>
        <ContentPresenter Content="{TemplateBinding Content}" RenderTransformOrigin="0.5,0.5">
            <ContentPresenter.RenderTransform>
                <ScaleTransform x:Name="buttonScale" />
            </ContentPresenter.RenderTransform>
        </ContentPresenter>
    </Grid>
</ControlTemplate>
于 2012-09-06T09:27:35.633 に答える