Search code examples
xamlwindows-runtimewindows-store-appsvisualstatemanager

How to disable/enable a VisualState based on some condition? (Metro)


I defined a VisualState for a button in a controltemplate:

  <ControlTemplate x:Key="ButtonTemplate" TargetType="Button">
      ...
      <VisualStateManager.VisualStateGroups>
        <VisualStateGroup x:Name="CommonStates">
          ...
          <VisualState x:Name="PointerOver">
            <Storyboard>
              <DoubleAnimation Storyboard.TargetName="c1" Storyboard.TargetProperty="Opacity" To="0.7"/>
            </Storyboard>
          </VisualState>
          ...
        </VisualStateGroup>
      </VisualStateManager.VisualStateGroups>
      ...
  </ControlTemplate>

But this effect (change opacity when mouseover) should be enabled/disabled based on a viewmodel condition, so how do I do that with XAML?

I tried creating a binding for the To value of the DoubleAnimation, it doesn't work because Storyboard is freezed. I'm also thinking sth like a template selector, but there is no such thing for the VisualState Manager.


Solution

  • I was discussing it recently with someone and I might add a generic solution to the problem to the WinRT XAML Toolkit, which would work similar to DataTriggers from WPF, but for now I would just add a DependencyProperty to your control, bind the property to your view model and on value change - update the visual state.