使用樣式自定義組件我用VisualStateManager

Question

I'm目標的UWP XAML更改樣式：

<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"> 
    <StackPanel Orientation="Horizontal" HorizontalAlignment="Center" VerticalAlignment="Center"> 
     <StackPanel.Resources> 
      <Style TargetType="Button"> 
      <Setter Property="Height" Value="80"/> 
      <Setter Property="Width" Value="80"/> 
      <Setter Property="Margin" Value="10"/> 
      </Style> 
     </StackPanel.Resources> 

     <Button Content="Listas"/> 
     <Button Content="Filas"/> 
     <Button Content="Pilhas"/> 
    </StackPanel> 

    <VisualStateManager.VisualStateGroups> 
     <VisualStateGroup x:Name="VisualStateGroup"> 
      <VisualState x:Name="VisualStatePhone"> 
      <VisualState.StateTriggers> 
       <AdaptiveTrigger MinWindowWidth="0"/> 
      </VisualState.StateTriggers> 
      <VisualState.Setters> 
      </VisualState.Setters> 
     </VisualState> 
     <VisualState x:Name="VisualStateTablet"> 
      <VisualState.StateTriggers> 
       <AdaptiveTrigger MinWindowWidth="600"/> 
      </VisualState.StateTriggers> 
      <VisualState.Setters> 
       <Setter Target="Button.Width" Value="100"/> 
      </VisualState.Setters> 
     </VisualState> 
     <VisualState x:Name="VisualStateDesktop"> 
      <VisualState.StateTriggers> 
       <AdaptiveTrigger MinWindowWidth="800"/> 
      </VisualState.StateTriggers> 
      <VisualState.Setters> 
       <Setter Target="Button.Width" Value="200"/> 
      </VisualState.Setters> 
     </VisualState> 
    </VisualStateGroup> 
    </VisualStateManager.VisualStateGroups> 
</Grid> 

但我不知道如何改變一個風格與VisualStateManager。我想在按鈕，TextBlocks等目標上應用樣式，然後更改該樣式的屬性。

Answer 1

我不知道任何方式，你可以達到按鈕樣式，並改變它。但是，如果你願意創建按鈕的一個完整的模板，可以在模板本身添加VisualStateGroups：這只是一個quicke醜陋的模板，我做了

<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"> 
    <StackPanel Orientation="Horizontal" HorizontalAlignment="Center" VerticalAlignment="Center"> 
     <StackPanel.Resources> 
      <Style TargetType="Button"> 
       <Setter Property="Height" Value="80"/> 
       <Setter Property="Margin" Value="10"/> 
       <Setter Property="Template"> 
        <Setter.Value> 
         <ControlTemplate TargetType="Button"> 
          <Grid x:Name="buttonGrid" Width="80"> 
           <VisualStateManager.VisualStateGroups> 
            <VisualStateGroup x:Name="VisualStateGroup"> 
             <VisualState x:Name="VisualStatePhone"> 
              <VisualState.StateTriggers> 
               <AdaptiveTrigger MinWindowWidth="0"/> 
              </VisualState.StateTriggers> 
             </VisualState> 
             <VisualState x:Name="VisualStateDesktop"> 
              <VisualState.StateTriggers> 
               <AdaptiveTrigger MinWindowWidth="800"/> 
              </VisualState.StateTriggers> 
              <VisualState.Setters> 
               <Setter 
                Target="buttonGrid.Width" 
                Value="200" /> 
              </VisualState.Setters> 
             </VisualState> 
            </VisualStateGroup> 
           </VisualStateManager.VisualStateGroups> 
           <Border BorderThickness="2" BorderBrush="Blue"> 
            <ContentPresenter 
             HorizontalAlignment="Center" 
             VerticalAlignment="Center" 
            /> 
           </Border> 
          </Grid> 
         </ControlTemplate> 
        </Setter.Value> 
       </Setter> 
      </Style> 
     </StackPanel.Resources> 

     <Button Content="Listas" /> 
     <Button Content="Filas" /> 
     <Button Content="Pilhas" /> 
    </StackPanel> 
</Grid> 

;您想要從default button template開始。