VisualStateManager 不会更改 wpf 表单中 window 的大小

Question

我定义了 2 个状态，一个大，另一个小，大状态会增加 window 大小，小状态会减少 window 大小。

window 有一个选项卡控件和 2 个 tabitem。 What I want to do is, to change the size of window to Big state when tab1 is selected and change the size of window to Small state when tab2 is selected.我写了下面的代码，但它不起作用。

以下是XAML代码。

<Window x:Name="window" x:Class="WpfApp2.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:local="clr-namespace:WpfApp2"
    mc:Ignorable="d"
    Title="MainWindow" Height="350" Width="525">
<Grid>
    <VisualStateManager.VisualStateGroups>
        <VisualStateGroup x:Name="VisualStateGroup">
            <VisualStateGroup.Transitions>
                <VisualTransition From="Big" GeneratedDuration="0:0:1" To="Small"/>
                <VisualTransition From="Small" GeneratedDuration="0:0:1" To="Big"/>
            </VisualStateGroup.Transitions>
            <VisualState x:Name="Big">
                <Storyboard>
                    <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.Width)" Storyboard.TargetName="window">
                        <EasingDoubleKeyFrame KeyTime="0" Value="558.333"/>
                    </DoubleAnimationUsingKeyFrames>
                </Storyboard>
            </VisualState>
            <VisualState x:Name="Small">
                <Storyboard>
                    <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.Width)" Storyboard.TargetName="window">
                        <EasingDoubleKeyFrame KeyTime="0" Value="290.152"/>
                    </DoubleAnimationUsingKeyFrames>
                </Storyboard>
            </VisualState>
        </VisualStateGroup>
    </VisualStateManager.VisualStateGroups>
    <TabControl HorizontalAlignment="Left" Height="319" VerticalAlignment="Top" Width="517" SelectionChanged="changes">
        <TabItem Header="TabItem" Name="tab1"/>
        <TabItem Header="TabItem" Name="tab2"/>
    </TabControl>

</Grid>

以下是c#代码。

 private void changes(object sender, SelectionChangedEventArgs e)
    {
        if (tab1.IsSelected)
        {
            VisualStateManager.GoToState(window, "Big", true);
        }
        else
        {
            VisualStateManager.GoToState(window, "Small", true);
        }
        i++;
    }

Answer 1

首先将 VisualStateManager.VisualStateGroups 附加属性及其内容移动到根元素（Window）的正下方。

<Window x:Name="window" x:Class="WpfApp2.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:local="clr-namespace:WpfApp2"
    mc:Ignorable="d"
    Title="MainWindow" Height="350" Width="525">
    <VisualStateManager.VisualStateGroups>
        <VisualStateGroup x:Name="VisualStateGroup">
            <VisualStateGroup.Transitions>
                <VisualTransition From="Big" GeneratedDuration="0:0:1" To="Small"/>
                <VisualTransition From="Small" GeneratedDuration="0:0:1" To="Big"/>
            </VisualStateGroup.Transitions>
            <VisualState x:Name="Big">
                <Storyboard>
                    <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.Width)" Storyboard.TargetName="window">
                        <EasingDoubleKeyFrame KeyTime="0" Value="558.333"/>
                    </DoubleAnimationUsingKeyFrames>
                </Storyboard>
            </VisualState>
            <VisualState x:Name="Small">
                <Storyboard>
                    <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.Width)" Storyboard.TargetName="window">
                        <EasingDoubleKeyFrame KeyTime="0" Value="290.152"/>
                    </DoubleAnimationUsingKeyFrames>
                </Storyboard>
            </VisualState>
        </VisualStateGroup>
    </VisualStateManager.VisualStateGroups>

    <Grid>
        <TabControl HorizontalAlignment="Left" Height="319" VerticalAlignment="Top" Width="517" SelectionChanged="changes">
            <TabItem Header="TabItem" Name="tab1"/>
            <TabItem Header="TabItem" Name="tab2"/>
        </TabControl>

    </Grid>
</Window>

并使用 GoToElementState 方法，而不是 GoToState。在 ControlTemplate 之外，应该使用 GoToElementState 方法。

private void changes(object sender, SelectionChangedEventArgs e)
{
    if (tab1.IsSelected)
    {
        VisualStateManager.GoToElementState(window, "Big", true);
    }
    else
    {
        VisualStateManager.GoToElementState(window, "Small", true);
    }
}

VisualStateManager 不会更改 wpf 表单中 window 的大小

VisualStateManager wont change size of the window in wpf form

c#

wpf

xaml

visualstatemanager