視覺狀態和自定義依賴項屬性（MVVM）

Question

我被困在試圖添加一個依賴項屬性到一個按鈕。我有幾個按鈕位於我的標題視圖中，然後單擊它們更改不同視圖之間的ContentControl內容。所有這些都很好。我希望點擊的按鈕具有與其他顏色不同的forecolor，它看起來像我需要添加一個依賴項屬性。我認爲我已經掌握了所有的內容，但無法弄清楚如何讓他們一起工作。

我在我的viewmodel中有一個名爲ViewState的字符串屬性，它根據被點擊的按鈕而改變。該屬性正在發生變化，當它發生時我會調用RaisePropertyChanged。我需要做什麼來綁定附加的依賴項屬性？我正在從WinForm世界過渡，並試圖在心裏將它們拼湊在一起，但掙扎了一下。

這是我到目前爲止有：

<Style TargetType="{x:Type Button}" x:Key="LocalButtonTemplate"> 
     <Setter Property="Foreground" Value="White" /> 
     <Setter Property="Background" Value="{x:Null}" /> 
     <Setter Property="FontFamily" Value="Segoe UI" /> 
     <Setter Property="FontSize" Value="18" /> 
     <Setter Property="Cursor" Value="Hand" /> 
     <Setter Property="Template"> 
      <Setter.Value> 
       <ControlTemplate TargetType="{x:Type Button}"> 
        <Border x:Name="outerBorder" Background="{TemplateBinding Background}" Margin="4"> 
         <VisualStateManager.VisualStateGroups> 
          <VisualStateGroup x:Name="ViewState"> 
           <VisualState x:Name="Dashboard"> 
            <Storyboard> 
             <ColorAnimation Duration="0:0:0.1" To="Yellow" 
              Storyboard.TargetProperty="(TextElement.Foreground).(SolidColorBrush.Color)" 
              Storyboard.TargetName="contentPresenter"/> 
            </Storyboard> 
           </VisualState> 
           <VisualState x:Name="AccountTables"> 
            <Storyboard> 
             <ColorAnimation Duration="0:0:0.1" To="Red" 
              Storyboard.TargetProperty="(TextElement.Foreground).(SolidColorBrush.Color)" 
              Storyboard.TargetName="contentPresenter"/> 
            </Storyboard> 
           </VisualState> 
           <VisualState x:Name="Normal"> 
            <Storyboard> 
             <ColorAnimation Duration="0:0:0.1" To="Purple" 
              Storyboard.TargetProperty="(TextElement.Foreground).(SolidColorBrush.Color)" 
              Storyboard.TargetName="contentPresenter"/> 
            </Storyboard> 
           </VisualState> 
           <VisualState x:Name="MouseOver"> 
            <Storyboard> 
             <ColorAnimation Duration="0:0:0.1" To="#35A84D" 
              Storyboard.TargetProperty="(TextElement.Foreground).(SolidColorBrush.Color)" 
              Storyboard.TargetName="contentPresenter"/> 
            </Storyboard> 
           </VisualState> 
          </VisualStateGroup> 
         </VisualStateManager.VisualStateGroups> 
         <Grid> 
          <Border x:Name="Background" BorderBrush="Transparent"> 
           <Grid> 
            <ContentPresenter x:Name="contentPresenter" ContentTemplate="{TemplateBinding ContentTemplate}" 
                 HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" 
                 VerticalAlignment="{TemplateBinding VerticalContentAlignment}" 
                 Margin="4,5,4,4"/> 
           </Grid> 
          </Border> 
         </Grid> 
        </Border> 
       </ControlTemplate> 
      </Setter.Value> 
     </Setter> 
    </Style> 

我的按鈕：

<dxwuii:SplitPanel Margin="0,10,10,10" HorizontalAlignment="Right" Grid.Column="2" ItemSpacing="0" Orientation="Horizontal" ItemSizeMode="AutoSize" > 
     <Button Command="{Binding SendViewModelNameCommand, Mode=OneTime}" CommandParameter="AccountTablesViewModel" Style="{StaticResource LocalButtonTemplate}">Express Tables</Button> 
     <Button Command="{Binding SendViewModelNameCommand, Mode=OneTime}" CommandParameter="MappingViewModel" Style="{StaticResource LocalButtonTemplate}">Item Mapping</Button> 
     <Button Command="{Binding SendViewModelNameCommand, Mode=OneTime}" CommandParameter="ReportsViewModel" Style="{StaticResource LocalButtonTemplate}">Reports</Button> 
     <Button Command="{Binding SendViewModelNameCommand, Mode=OneTime}" CommandParameter="PostBalancesViewModel" Style="{StaticResource LocalButtonTemplate}">Post Balances</Button> 
    </dxwuii:SplitPanel> 

依賴物業類別：在下面的每個按鈕

namespace MyAppName.Model 
{ 
    public class StateManager : DependencyObject 
    { 
     public static string GetVisualStateProperty(DependencyObject obj) 
     { 
      return (string)obj.GetValue(VisualStatePropertyProperty); 
     } 
     public static void SetVisualStateProperty(DependencyObject obj, string value) 
     { 
      obj.SetValue(VisualStatePropertyProperty, value); 
     } 
     public static readonly DependencyProperty VisualStatePropertyProperty = 
      DependencyProperty.RegisterAttached(
      "VisualStateProperty", 
      typeof(string), 
      typeof(StateManager), 
      new PropertyMetadata((dependencyObject, args) => 
      { 
       var frameworkElement = dependencyObject as FrameworkElement; 
       if (frameworkElement == null) 
        return; 
       VisualStateManager.GoToState(frameworkElement, (string)args.NewValue, true); 
      })); 
    } 
} 

Answer 1

套裝Tag和Attached財產。 Tag值將會是按鈕應該點擊的值VisualState。

<Button Tag="AcountTables" local:StateManager.VisualStateProperty="{Binding YOURVIEWMODELPROPERTY}" Command="{Binding SendViewModelNameCommand, Mode=OneTime}" CommandParameter="AccountTablesViewModel" Style="{StaticResource LocalButtonTemplate}">Express Tables</Button> 

更新您的AttachedProperty這樣的：

 public static readonly DependencyProperty VisualStatePropertyProperty = 
     DependencyProperty.RegisterAttached(
     "VisualStateProperty", 
     typeof(string), 
     typeof(StateManager), 
     new PropertyMetadata((dependencyObject, args) => 
     { 
      var frameworkElement = dependencyObject as FrameworkElement; 
      if (frameworkElement == null) 
       return; 

      if (args.NewValue == frameworkElement.Tag.ToString()) 
      { 
       VisualStateManager.GoToState(frameworkElement, (string)args.NewValue, true); 
      } 
      else 
      { 
       VisualStateManager.GoToState(frameworkElement, "Normal", true); 
      } 

     }));