如何在代码中动态地将新的视觉状态添加到自定义控件模板？

Question

是否可以在代码中以编程方式将新的 VisualState 添加到 CustomControl Template 的 VisualStateManager 中？
例如，我可以在设计时手动将此 XAML 添加到 CustomControl 模板中：

<VisualState x:Name="First">
   <Storyboard>
      <ColorAnimation Duration="0:0:0"
                      Storyboard.TargetName="SBorder"
                      Storyboard.TargetProperty="(Background).(SolidColorBrush.Color)" To="Red" />
    </Storyboard>
</VisualState>

但是如何在运行时添加新的 VisualState 呢？

Answer 1

我认为这是可行的，但绝不是容易的...

这应该可行：（

Grid grid = this.Template.FindName("RootElement", this) as Grid;
(VisualStateManager.GetVisualStateGroups(grid)).Add(new VisualStateGroup() { /* the code for your visualstategroup here */ });

您需要根据模板根元素名称的类型以及设置 VisualStateManager 的位置进行调整，但全部都在所有这些都可以工作

，这会添加一个新的 VisualStateGroup，而不仅仅是一个 VisualState 如果要将 VisualState 添加到现有的 VisualStateGroup，则必须首先从集合中获取该组，但这是常见的“获取元素”。 使用

基本上：

1. 获取包含 VisualStateManager 的模板元素，
2. VisualStateManager.GetVisualStateGroups() 静态方法获取当前的 VisualStateGroups
3. 从集合中获取所需的组或创建一个新组并添加它将
4. 在该组中添加一个新的视觉状态

希望这有帮助。

Answer 2

我建议您应该使用 XAML 创建组本身，然后
你必须像这样找到你正在寻找的 VisualStateGroup：

VisualStateGroup visualStateGroupLookingFor = null;
var visualStateGroups = (VisualStateManager.GetVisualStateGroups(LayoutRoot));
foreach (VisualStateGroup state in visualStateGroups) {
    if (state.Name == "VisualStateGroupMine") {
        visualStateGroupLookingFor = state;
        break;
        }
    }

然后，你必须创建一个新的 VisualState 和 Storyboard 来添加，例如：

var visualState = new VisualState();
var storyBoard = new Storyboard();

现在，创建动画：

var animation = new DoubleAnimation();
animation.To = 10.0;

并设置动画的目标：

//assuming this is instance of class ClassFoo
//and you want to animate it's Width
Storyboard.SetTarget(animation, this);
Storyboard.SetTargetProperty(animation, new PropertyPath(ClassFoo.WidthProperty));

最后添加动画）到你的故事板，给它一个名字，将它添加到视觉状态组：

storyBoard.Children.Add(animation);
visualState.Storyboard = storyBoard;
visualState.Name = "CoolNameLikeWidthAnimation";
visualStateGroupLookingFor.States.Add(visualState);

就是这样，像往常一样触发它

VisualStateManager.GoToState(this, "CoolNameLikeWidthAnimation", true);