2

我定义了四种视觉状态,每种状态都会影响同一个银光控件中的不同子控件。我是否可以创建其他视觉状态来调用这些其他视觉状态的组合?

所以如果我有Visual_Group_1、Visual_Group_2、Visual_Group_3、Visual_Group_4

  1. 是否可以创建一个使用 Visual_Group_1 和 Visual_Group_3 中状态的 Visual_Comb_1 组?
  2. 然后再制作一个名为 Visual_Comb_2 的,它使用 Visual_Group_4 和 Visual_Group_3?

我很高兴实施solution in xaml or codebehind or a combination of both. 我目前正在考虑的替代方案涉及大量的代码复制+粘贴,我不太愿意这样做。

每个请求的更多详细信息:

这是我现在大致拥有的:

<VisualState x:Name="State1">
    <ColorAnimation Storyboard.TargetName="Path1"
                    Storyboard.TargetProperty="(Path.Fill).(SolidColorBrush.Color)"
                    To="Blue" Duration="0:0:0.5" />
    // fade out the rest of the paths...
    <ColorAnimation Storyboard.TargetName="Path2"
                    Storyboard.TargetProperty="(Path.Fill).(SolidColorBrush.Color)"
                    To="#00000000" Duration="0:0:0.5" />
    <ColorAnimation Storyboard.TargetName="Path3"
                    Storyboard.TargetProperty="(Path.Fill).(SolidColorBrush.Color)"
                    To="#00000000" Duration="0:0:0.5" />
    <ColorAnimation Storyboard.TargetName="Path4"
                    Storyboard.TargetProperty="(Path.Fill).(SolidColorBrush.Color)"
                    To="#00000000" Duration="0:0:0.5" />
</VisualState>

<VisualState x:Name="State2">
    <ColorAnimation Storyboard.TargetName="Path3"
                    Storyboard.TargetProperty="(Path.Fill).(SolidColorBrush.Color)"
                    To="Red" Duration="0:0:0.5" />
    // fade out the rest of the paths...
    <ColorAnimation Storyboard.TargetName="Path2"
                    Storyboard.TargetProperty="(Path.Fill).(SolidColorBrush.Color)"
                    To="#00000000" Duration="0:0:0.5" />
    <ColorAnimation Storyboard.TargetName="Path1"
                    Storyboard.TargetProperty="(Path.Fill).(SolidColorBrush.Color)"
                    To="#00000000" Duration="0:0:0.5" />
    <ColorAnimation Storyboard.TargetName="Path4"
                    Storyboard.TargetProperty="(Path.Fill).(SolidColorBrush.Color)"
                    To="#00000000" Duration="0:0:0.5" />
</VisualState>

<VisualState x:Name="State3">
    <ColorAnimation Storyboard.TargetName="Path4"
                    Storyboard.TargetProperty="(Path.Fill).(SolidColorBrush.Color)"
                    To="Pink" Duration="0:0:0.5" />
    // fade out the rest of the paths...
    <ColorAnimation Storyboard.TargetName="Path2"
                    Storyboard.TargetProperty="(Path.Fill).(SolidColorBrush.Color)"
                    To="#00000000" Duration="0:0:0.5" />
    <ColorAnimation Storyboard.TargetName="Path1"
                    Storyboard.TargetProperty="(Path.Fill).(SolidColorBrush.Color)"
                    To="#00000000" Duration="0:0:0.5" />
    <ColorAnimation Storyboard.TargetName="Path3"
                    Storyboard.TargetProperty="(Path.Fill).(SolidColorBrush.Color)"
                    To="#00000000" Duration="0:0:0.5" />
</VisualState>

我的目标是有一个控件,当您单击从 state1 到 state3 的循环时,每个状态都会淡入不同的路径,同时淡出其他路径。我的问题是在“淡出其余路径”部分中有大量复制+粘贴,所以如果我想添加一个 Path5 这意味着将它添加到已经定义的每个视觉状态,或者如果我想要要更改淡出颜色或动画,我必须对每个视觉状态进行此操作。

4

1 回答 1

4

感谢您提供 XAML。这就是我解决问题的方法。

首先,VisualStates为每个Path. (我建议使用 aStyle来节省您将非常相似的代码重新编码VisualState到每个路径中,但我对它们不够熟悉,不知道您是否可以为每个路径应用不同的颜色。)

<VisualStateManager.VisualStateGroups>
    <VisualStateGroup x:Name="Path1States">
        <VisualState x:Name="Activate">
            <Storyboard>
                <ColorAnimation Storyboard.TargetName="Path1"
                                Storyboard.TargetProperty="(Path.Fill).(SolidColorBrush.Color)"
                                To="Blue"
                                Duration="0:0:0.5" />
            </Storyboard>
        </VisualState>
        <VisualState x:Name="Deactivate">
            <Storyboard>
                <ColorAnimation Storyboard.TargetName="Path1"
                                Storyboard.TargetProperty="(Path.Fill).(SolidColorBrush.Color)"
                                To="#00000000"
                                Duration="0:0:0.5" />
            </Storyboard>
        </VisualState>
    </VisualStateGroup>
    <VisualStateGroup x:Name="Path2States">
        <!-- ... etc ... -->
    </VisualStateGroup>
</VisualStateManager.VisualStateGroups>

现在,List在包含每个相关对象的代码隐藏中创建一个,然后调整您自己的GoToState函数,以便它为一个对象打开 in 状态,并为其余对象调用 off 状态。

List<Path> pathList;

public Page() // constructor
{
    InitializeComponent();
    pathList = new List<Path>();
    pathList.Add(Path1);
    // and so forth
}

// Call this function when you want to change the state
private void ActivatePath(Path p)
{
    foreach (Path listItem in pathList)
    {
        // If the item from the list is the one you want to activate...
        if (listItem == p)
            VisualStateManager.GoToState(listItem, "Activate", true);
        // otherwise...
        else
            VisualStateManager.GoToState(listItem, "Deactivate", true);
    }
}

如果我在 XAML 和样式方面做得更好,我可能会有一种更简洁的方式来创建 VisualStates。然而,我的强项更多是在逻辑和编码方面。话虽这么说,写出相同的VisualState四五次要干净得多!:)
希望这会有所帮助!

于 2011-05-31T08:15:05.223 回答