在 xaml 中创建自定义 VisualState 并在 CodeBehind 中手动设置

Question

我有一个 TabItem 样式，其中有 VisualStates。

<VisualState x:Name="MouseOver"> 
<!-- Tab turns bronze when mouseover -->
</VisualState>

现在我想要一个自定义的视觉状态，并在代码隐藏中手动设置状态，而不是依赖 MouseOver 事件。

<VisualState x:Name="CustomVisualState">
<!-- this will be a storyboard to cause flashing -->
</VisualState> 

然后我需要在CodeBehind中设置它。

MyTabItem.VisualState = CustomVisualState.  //something like this

Answer 1

你尝试过吗
VisualStateManager.GoToState

获取一个 Control、带有自定义状态名称的字符串以及用于使用转换的 bool 标志。

用法

private void UpdateStates(bool useTransitions)
{
    if (Value >= 0)
    {
        VisualStateManager.GoToState(this, "Positive", useTransitions);
    }
    else
    {
        VisualStateManager.GoToState(this, "Negative", useTransitions);
    }

    if (IsFocused)
    {
        VisualStateManager.GoToState(this, "Focused", useTransitions);
    }
    else
    {
        VisualStateManager.GoToState(this, "Unfocused", useTransitions);
    }
}

---

来自 msdn 的示例 稍微复杂一点的示例用法来自 此处

鉴于此 xaml

      <Grid x:Name="LayoutRoot"  Background="LightBlue">
          <VisualStateManager.VisualStateGroups>
              <VisualStateGroup x:Name="SG1">
                  <VisualStateGroup.Transitions>
                      <VisualTransition GeneratedDuration="00:00:01">
                          <VisualTransition.GeneratedEasingFunction>
                              <ElasticEase EasingMode="EaseOut"/>
                          </VisualTransition.GeneratedEasingFunction>
                      </VisualTransition>
                  </VisualStateGroup.Transitions>
                  <VisualState x:Name="SG1Normal"/>
                  <VisualState x:Name="SG1EllipseRight" >
                      <Storyboard>
                            <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Duration="00:00:00.0010000" Storyboard.TargetName="ellipse" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.X)">
                              <EasingDoubleKeyFrame KeyTime="00:00:00" Value="320"/>
                          </DoubleAnimationUsingKeyFrames>
                      </Storyboard>
                  </VisualState>
              </VisualStateGroup>
          </VisualStateManager.VisualStateGroups>
          <Ellipse x:Name="ellipse" Fill="Red" Stroke="Black" 
                   Height="116" HorizontalAlignment="Left" Margin="50,98,0,0" 
                   VerticalAlignment="Top" Width="235" RenderTransformOrigin="0.5,0.5" >
              <Ellipse.RenderTransform>
                  <TransformGroup>
                      <ScaleTransform/>
                      <SkewTransform/>
                      <RotateTransform/>
                      <TranslateTransform/>
                  </TransformGroup>
              </Ellipse.RenderTransform>
          </Ellipse>
      </Grid>

可以像这样改变状态。

 VisualStateManager.GoToState(this, SG1EllipseRight.Name, true);

或者

VisualStateManager.GoToState(control, "SG1EllipseRight", true);

Answer 2

试试这个，

VisualStateManager.GoToElementState(Control, "StateName", true/false);

或者

VisualStateManager.GoToState(Control, "StateName", true/false);

Answer 3

VisualStateManager 还允许您指定控件何时
进入特定状态。您应该调用来更改的方法
状态取决于您的场景。如果您创建一个使用
VisualStateManager 在其ControlTemplate 中，调用GoToState 方法。
有关如何创建使用以下控件的更多信息
VisualStateManager，请参阅创建具有可自定义的控件
外貌。如果您在外部使用 VisualStateManager
ControlTemplate（例如，如果您在
UserControl 或单个元素中），调用 GoToElementState 方法。
无论哪种情况，VisualStateManager 执行的逻辑是
需要适当地启动和停止故事板
与所涉及的状态相关联。 - VisualStateManager 类

这就是 GoToElementState 和 GoToState 之间的区别。