我的VisualStateGroups中有两个Style。它工作正常但是当我调整窗口宽度时，AdaptiveVisualStateGroup不会被触发。我错过了什么？
<Style TargetType="local:ExpandPanel">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="local:ExpandPanel">
<Grid>
<VisualStateManager.VisualStateGroups>
<VisualStateGroup x:Name="AdaptiveVisualStateGroup">
<VisualState x:Name="NormalDesktop">
<VisualState.StateTriggers>
<AdaptiveTrigger MinWindowWidth="720"/>
</VisualState.StateTriggers>
<VisualState.Setters>
<Setter Target="HeaderText.(UIElement.Visibility)" Value="Collapsed" />
</VisualState.Setters>
</VisualState>
</VisualStateGroup>
<VisualStateGroup x:Name="ViewStates">
<VisualStateGroup.Transitions>
<VisualTransition GeneratedDuration="0:0:0.25"/>
</VisualStateGroup.Transitions>
<VisualState x:Name="Expanded">
<Storyboard>
<DoubleAnimation Storyboard.TargetName="ContentScaleTransform" Storyboard.TargetProperty="ScaleX" To="1" Duration="0"/>
<DoubleAnimation Storyboard.TargetName="RotateButtonTransform" Storyboard.TargetProperty="Angle" To="180" Duration="0"/>
</Storyboard>
</VisualState>
<VisualState x:Name="Collapsed">
<Storyboard>
<DoubleAnimation Storyboard.TargetName="ContentScaleTransform" Storyboard.TargetProperty="ScaleX" To="0" Duration="0"/>
<DoubleAnimation Storyboard.TargetName="RotateButtonTransform" Storyboard.TargetProperty="Angle" To="0" Duration="0"/>
</Storyboard>
</VisualState>
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
<Border BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="{TemplateBinding BorderThickness}"
CornerRadius="{TemplateBinding CornerRadius}"
Background="{TemplateBinding Background}">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Grid Margin="3" x:Name="ExpandCollapseGrid" Background="Transparent">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="Auto"/>
</Grid.ColumnDefinitions>
<StackPanel Orientation="Horizontal">
<Image x:Name="ImageIcon" Width="{TemplateBinding IconWidth}" Height="{TemplateBinding IconHeight}" Source="{TemplateBinding IconSource}" Margin="0,0,8,0"/>
<FontIcon x:Name="FontIcon" Glyph="{TemplateBinding Glyph}" FontSize="{TemplateBinding HeaderFontSize}" Margin="8" />
<ContentPresenter x:Name="HeaderText" VerticalAlignment="Center" Content="{TemplateBinding HeaderContent}" FontSize="{TemplateBinding HeaderFontSize}" />
</StackPanel>
<ToggleButton Grid.Column="1" RenderTransformOrigin="0.5,0.5" x:Name="ExpandCollapseButton"
Width="{TemplateBinding ToggleButtonWidth}"
Height="{TemplateBinding ToggleButtonHeight}"
Margin="{TemplateBinding ToggleButtonMargin}">
<ToggleButton.Template>
<ControlTemplate>
<Grid>
<Path RenderTransformOrigin="0.5,0.5" HorizontalAlignment="Center" VerticalAlignment="Center" Stretch="Uniform"
Data="M 0 40 L 40 20 L 0 0 Z"
Fill="{ThemeResource ToggleSwitchForegroundThemeBrush}" />
</Grid>
</ControlTemplate>
</ToggleButton.Template>
<ToggleButton.RenderTransform>
<RotateTransform x:Name="RotateButtonTransform"/>
</ToggleButton.RenderTransform>
</ToggleButton>
</Grid>
<ContentPresenter Grid.Row="1" Margin="5" Content="{TemplateBinding Content}" x:Name="Content" RenderTransformOrigin="1,0.5">
<ContentPresenter.RenderTransform>
<ScaleTransform x:Name="ContentScaleTransform"/>
</ContentPresenter.RenderTransform>
</ContentPresenter>
</Grid>
</Border>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
答案 0 :(得分：1)
我已经弄明白了。没有必要创建另一个组。以下适用于我
<Style TargetType="local:ExpandPanel">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="local:ExpandPanel">
<Grid>
<VisualStateManager.VisualStateGroups>
<VisualStateGroup x:Name="ViewStates">
<VisualStateGroup.Transitions>
<VisualTransition GeneratedDuration="0:0:0.25"/>
</VisualStateGroup.Transitions>
<VisualState x:Name="Expanded">
<Storyboard>
<DoubleAnimation Storyboard.TargetName="ContentScaleTransform" Storyboard.TargetProperty="ScaleX" To="1" Duration="0"/>
<DoubleAnimation Storyboard.TargetName="RotateButtonTransform" Storyboard.TargetProperty="Angle" To="180" Duration="0"/>
</Storyboard>
</VisualState>
<VisualState x:Name="Collapsed">
<Storyboard>
<DoubleAnimation Storyboard.TargetName="ContentScaleTransform" Storyboard.TargetProperty="ScaleX" To="0" Duration="0"/>
<DoubleAnimation Storyboard.TargetName="RotateButtonTransform" Storyboard.TargetProperty="Angle" To="0" Duration="0"/>
</Storyboard>
</VisualState>
<VisualState x:Name="NarrowDesktop">
<VisualState.StateTriggers>
<AdaptiveTrigger MinWindowWidth="{StaticResource NarrowMinWidth}"/>
</VisualState.StateTriggers>
<VisualState.Setters>
<!-- TODO: change properties for narrow view -->
<Setter Target="HeaderText.(UIElement.Visibility)" Value="Visible" />
</VisualState.Setters>
</VisualState>
<VisualState x:Name="NormalDesktop">
<VisualState.StateTriggers>
<AdaptiveTrigger MinWindowWidth="{StaticResource NormalMinWidth}"/>
</VisualState.StateTriggers>
<VisualState.Setters>
<!-- TODO: change properties for normal view -->
<Setter Target="HeaderText.(UIElement.Visibility)" Value="Collapsed" />
</VisualState.Setters>
</VisualState>
<VisualState x:Name="WideDesktop">
<VisualState.StateTriggers>
<AdaptiveTrigger MinWindowWidth="{StaticResource WideMinWidth}"/>
</VisualState.StateTriggers>
<VisualState.Setters>
<!-- TODO: change properties for wide view -->
<Setter Target="HeaderText.(UIElement.Visibility)" Value="Visible" />
</VisualState.Setters>
</VisualState>
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
<Border BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="{TemplateBinding BorderThickness}"
CornerRadius="{TemplateBinding CornerRadius}"
Background="{TemplateBinding Background}">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Grid Margin="3" x:Name="ExpandCollapseGrid" Background="Transparent">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="Auto"/>
</Grid.ColumnDefinitions>
<StackPanel Orientation="Horizontal">
<Image x:Name="ImageIcon" Width="{TemplateBinding IconWidth}" Height="{TemplateBinding IconHeight}" Source="{TemplateBinding IconSource}" Margin="0,0,8,0"/>
<FontIcon x:Name="FontIcon" Glyph="{TemplateBinding Glyph}" FontSize="{TemplateBinding HeaderFontSize}" Margin="8" />
<ContentPresenter x:Name="HeaderText" VerticalAlignment="Center" Content="{TemplateBinding HeaderContent}" FontSize="{TemplateBinding HeaderFontSize}" />
</StackPanel>
<ToggleButton Grid.Column="1" RenderTransformOrigin="0.5,0.5" x:Name="ExpandCollapseButton"
Width="{TemplateBinding ToggleButtonWidth}"
Height="{TemplateBinding ToggleButtonHeight}"
Margin="{TemplateBinding ToggleButtonMargin}">
<ToggleButton.Template>
<ControlTemplate>
<Grid>
<Path RenderTransformOrigin="0.5,0.5" HorizontalAlignment="Center" VerticalAlignment="Center" Stretch="Uniform"
Data="M 0 40 L 40 20 L 0 0 Z"
Fill="{ThemeResource ToggleSwitchForegroundThemeBrush}" />
</Grid>
</ControlTemplate>
</ToggleButton.Template>
<ToggleButton.RenderTransform>
<RotateTransform x:Name="RotateButtonTransform"/>
</ToggleButton.RenderTransform>
</ToggleButton>
</Grid>
<ContentPresenter Grid.Row="1" Margin="5" Content="{TemplateBinding Content}" x:Name="Content" RenderTransformOrigin="1,0.5">
<ContentPresenter.RenderTransform>
<ScaleTransform x:Name="ContentScaleTransform"/>
</ContentPresenter.RenderTransform>
</ContentPresenter>
</Grid>
</Border>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>