0

WinRT/XAML 開発は初めてです。ネットで何時間もの調査と多くの試行錯誤を繰り返した結果、オブジェクトに対するユーザー入力に基づいて VisualStateManager を使用して楕円の塗りつぶしの色を変更する方法をまだ理解できません。次のコードは機能しません。現在のコードは次のとおりです。

<Ellipse Stroke="White" StrokeThickness="5" Width="90" Height="90">
        <VisualStateManager.VisualStateGroups>
            <VisualStateGroup x:Name="CommonStates">
                <VisualState x:Name="Normal"/>
                <VisualState x:Name="MouseOver">
                    <Storyboard>
                        <ColorAnimation To="Red" Storyboard.TargetName="Ellipse" Storyboard.TargetProperty="Fill.Color"/>
                    </Storyboard>
                </VisualState>
                <VisualStateGroup.Transitions>
                    <VisualTransition To="Normal" GeneratedDuration="00:00:01"/>
                    <VisualTransition To="MouseOver" GeneratedDuration="00:00:01"/>
                </VisualStateGroup.Transitions>
            </VisualStateGroup>
        </VisualStateManager.VisualStateGroups>
    </Ellipse>

アップデート：

正しい方向への微調整をしてくれた Nicholas W. に感謝します。テンプレートと正しいターゲット プロパティがありませんでした。次のコードは意図したとおりに機能しています。

<Button>
            <Button.Template>
                <ControlTemplate>
                    <Grid>
                        <Ellipse x:Name="myEllipse" Stroke="White" StrokeThickness="5" Width="70" Height="70" Fill="Transparent"/>
                        <VisualStateManager.VisualStateGroups>
                            <VisualStateGroup x:Name="CommonStates">
                                <VisualState x:Name="Normal"/>
                                <VisualState x:Name="Pressed">
                                    <Storyboard>
                                        <ColorAnimation Storyboard.TargetName="myEllipse" To="#FF0061D4"  Storyboard.TargetProperty="(Rectangle.Fill).(SolidColorBrush.Color)" Duration="0:0:0"/>
                                    </Storyboard>
                                </VisualState>
                            </VisualStateGroup>
                        </VisualStateManager.VisualStateGroups>
                    </Grid>
                </ControlTemplate>
            </Button.Template>
        </Button>
4

1 に答える 1

1

ここにはいくつかの問題があります。1 つ目は、ビジュアル ステート マネージャーを状態間で遷移させるものがないこと、2 つ目は「楕円」ターゲットへの参照が解決されていないこと、3 つ目は、カラー アニメーションを実行するブラシが定義されていないことです。既に表示状態を使用しているコントロールを再テンプレート化する場合、最初の部分は自動的に行われます。それ以外の場合は、明示的な状態遷移を設定する必要があります ( example )。参照が機能するようにするには、要素に名前を付け、要素自体に VisualStateGroups 添付プロパティを入れ子にしないでください (または、MSDN の例に従ってブラシの名前でアニメーション化します)。最後の部分は、最初にブラシを設定するだけです。Color財産。一緒に、 a を再テンプレート化する例Button:

    <Button>
        <Button.Template>
            <ControlTemplate>
                <Grid>
                    <Ellipse x:Name="Ellipse" Stroke="White" StrokeThickness="5" Width="90" Height="90"
                             Fill="Black"/>
                    <VisualStateManager.VisualStateGroups>
                        <VisualStateGroup x:Name="CommonStates">
                            <VisualState x:Name="Normal"/>
                            <VisualState x:Name="MouseOver">
                                <Storyboard>
                                    <ColorAnimation Storyboard.TargetName="Ellipse" To="Red"  Storyboard.TargetProperty="Fill.Color"/>
                                </Storyboard>
                            </VisualState>
                            <VisualStateGroup.Transitions>
                                <VisualTransition To="Normal" GeneratedDuration="00:00:01"/>
                                <VisualTransition To="MouseOver" GeneratedDuration="00:00:01"/>
                            </VisualStateGroup.Transitions>
                        </VisualStateGroup>
                    </VisualStateManager.VisualStateGroups>
                </Grid>
            </ControlTemplate>
        </Button.Template>
    </Button>
于 2013-03-01T16:20:39.400 に答える