StackPanel /窗口宽度更改WPF

本文关键字：WPF 窗口 StackPanel | 更新日期: 2023-09-27 18:11:21

我已经创建了一个窗口，其中两个垂直方向的堆栈面板(左和右)位于第三个水平方向的堆栈面板中。左边的堆叠面板上有多个控件和一个按钮>Hide<，绑定到命令。我喜欢动画"隐藏"右堆栈面板，并调整窗口的宽度，只有左堆栈面板。如何用最简单的方式做到这一点?我发现WPF堆栈面板的可见性动画，但是，它不会调整窗口的大小。

我的代码是: 
<Window x:Class="Namespace.MainWindow"
 ...
 x:Name="ololo"
        Height="400" Width="500">
 .....    
<StackPanel Orientation="Horizontal">
            <StackPanel x:Name="Left" Orientation="Vertical">
                <Button Margin="0,10,0,0" Command="{Binding HideCommand}">Hide</Button>
            </StackPanel>
            <StackPanel x:Name="Right" Orientation="Vertical">
            <!--<Controls>-->
            </StackPanel>
    </StackPanel>

StackPanel /窗口宽度更改WPF

您可以在Window上使用SizeToContent属性，以便在内容更改时自动调整窗口大小。

我建议使用Width值。

<Window ...
    SizeToContent="Width"

然而，有一个问题，这是你可能需要指定每个StackPanel的宽度，或者可能设置一个MinWidth在你的窗口，以防止Window从大小调整为0的宽度。

通常动画是在视图中完成的，ViewModel不应该与窗口的大小有任何关系。因此，为了保留MVVM，您只需要调整后面代码的大小。这通常是通过查找动画资源来实现的。

<Storyboard x:Key="AnimateWindow">
        <DoubleAnimation Duration="0:0:3.8"
                         Storyboard.TargetProperty="Width"
                         From="350"
                         To="100"
                         AccelerationRatio=".1">
        </DoubleAnimation>
</Storyboard>

在按钮点击时，你还需要处理点击事件来触发动画。click事件将查找资源并执行它。它还可以处理您需要的任何其他特定于视图的事情。

private void Button_Click(object sender, RoutedEventArgs e)
{
        var animate= FindResource("AnimateWindow") as Storyboard;
        if (hide != null)
        {
            animate.Begin(this, true);
        }
}

这保留了MVVM，并且应该完成您想要的。

相关文章：