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

这里有一些问题,首先没有任何东西导致可视状态管理器在状态之间转换,其次对“椭圆”目标的引用没有解决,第三没有定义在其上执行颜色动画的画笔。如果您要重新模板已经使用视觉状态的控件,第一部分将为您完成,否则您需要设置显式状态转换(示例)。要使引用生效,您可以为元素命名,并且不要将 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 回答