WPF C＃：在页面加载时动态增加MainWindow的宽度

Question

我试图通过增加宽度和位置将其加载到页面中时使用for循环来创建动画。 我的问题是Page_Loaded for循环中的Application.Current.MainWindow.Width不起作用。 虽然它在离开页面时效果很好。 我的代码：

private void Page_Loaded(object sender, RoutedEventArgs e)
{
    for (double i = 0; i < 50; i++)
        {
                Application.Current.MainWindow.Left = Application.Current.MainWindow.Left - 2;
                Application.Current.MainWindow.Width = Application.Current.MainWindow.Width + 4;
        }
}

private void Home_Click(object sender, RoutedEventArgs e)
{
    NavigationService.GoBack();
        for (double i = 0; i < 50; i++)
        {
                Application.Current.MainWindow.Left = Application.Current.MainWindow.Left + 2;
                Application.Current.MainWindow.Width = Application.Current.MainWindow.Width - 4;
        }
}

当我转到目标页面时，我的窗口仅向左移动，但是直到页面完全加载后宽度才增加，它只是跳到最终宽度而不是为其设置动画。 当我离开页面时，窗口和宽度都将同时更改。

在Page_Loaded下设置宽度时有一些限制吗？ 如果是这样，我该如何克服？

XAML设置

  mc:Ignorable="d" 
  Loaded="Page_Loaded"
  Title="DatabaseViewer">

<Grid >
    <TextBlock Height="75" Margin="65,20,65,0" Text="Solder Paste Database" TextAlignment="Center" FontSize="30" VerticalAlignment="Top" />

    <Button Margin="0,17,30,0" Width="50" Height="50" FontSize="20" HorizontalAlignment="Right" VerticalAlignment="Top" BorderThickness="0" Click="Export_Click"
            Style="{DynamicResource SquareButtonStyle}" ToolTip="Export to Excel">
        <StackPanel>
            <Rectangle Width="40" Height="40" HorizontalAlignment="Center" VerticalAlignment="Center" Fill="Green">
                <Rectangle.OpacityMask>
                    <VisualBrush Stretch="Uniform" Visual="{StaticResource appbar_office_excel}" />
                </Rectangle.OpacityMask>
            </Rectangle>
        </StackPanel>
    </Button>

    <DataGrid Name="dbGrid" Width="750" Height="340" VerticalAlignment="Bottom" HorizontalAlignment="Center" Margin="0,0,0,20" 
              HorizontalContentAlignment="Center" IsReadOnly="True" PreviewKeyDown="dbGrid_KeyDown" GridLinesVisibility="All"
              BorderBrush="Black" BorderThickness="1" SelectionChanged="dbGrid_SelectionChanged" >
    </DataGrid>

    <Grid HorizontalAlignment="Right" VerticalAlignment="Top" Margin="0,70,25,0">
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="115"/>
            <ColumnDefinition Width="40"/>
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition Height="30" />
        </Grid.RowDefinitions>

        <Label FontSize="14" FontWeight="Bold" Grid.Column="0" Grid.Row="0" Content="Selected Count: " HorizontalAlignment="Right" VerticalAlignment="Bottom"/>
        <Label FontSize="14" Grid.Column="1" Grid.Row="0" Content="0" HorizontalAlignment="Left" VerticalAlignment="Bottom" x:Name="selectedCount" />

    </Grid>

    <Grid HorizontalAlignment="Left" VerticalAlignment="Top" Margin="25,70,0,0">
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="150"/>
            <ColumnDefinition Width="100"/>
            <ColumnDefinition Width="100"/>
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition Height="26" />
        </Grid.RowDefinitions>

        <TextBox Width="150" FontSize="14" Grid.Column="0" Grid.Row="0" HorizontalAlignment="Right" x:Name="TB" ToolTip="Column Name = Value [&amp; Column Name = Value]"/>
        <Button Margin="10,0,0,0" Padding="0,0,0,0" FontSize="14" Width="80" Content="Filter" Grid.Column="1" Grid.Row="0" VerticalContentAlignment="Center" 
                HorizontalAlignment="Left" VerticalAlignment="Bottom" Click="filter_click" />
        <Label Grid.Column="2" x:Name="filterLabel" Content="Invalid Search" Foreground="Red" FontWeight="Bold"/>
    </Grid>

    <Button Margin="20,27,0,0" Width="30" Height="30" FontSize="18" HorizontalAlignment="Left" Click="Home_Click" VerticalAlignment="Top" BorderThickness="0" UseLayoutRounding="True" BorderBrush="White"
        Style="{DynamicResource MetroCircleButtonStyle}" >
        <Rectangle Width="30" Height="30"
           Fill="#41b1ff">
            <Rectangle.OpacityMask>
                <VisualBrush Stretch="Uniform" Visual="{DynamicResource appbar_arrow_left}" />
            </Rectangle.OpacityMask>
        </Rectangle>
    </Button>
</Grid>

Answer 1

如您所见，使用显式代码在循环中更改尺寸很可能会导致批处理。 更不用说您在所有这些过程中都在阻止UI，因此让您感到惊讶的是，您在循环期间看到了任何更改。

基本动画的正确方法是使用WPF故事板。 在这里，您可以定义开始和结束条件，要设置的动画（宽度，左）以及动画要播放多长时间并告诉其播放。 然后，情节提要板将运行，而您无需执行任何其他操作。 您可以在代码或纯XAML中定义它。

• 告诉我更多...

Answer 2

MickyD是对的，在这种情况下，情节提要是最好的选择。 尽管我可以通过在后面的代码中循环来实现您想要的功能，但是您所看到的结果通常是有问题的。 例如，在您的情况下，您将需要制作一个DoubleAnimation来扩展Windows资源。

XAML

 <Window.Resources>
    <Storyboard x:Key="sb2">
        <DoubleAnimation Storyboard.TargetName="myWindowName" Storyboard.TargetProperty="Width" From="500" To="1200" Duration="0:0:3"  AutoReverse="False"/>
        <DoubleAnimation Storyboard.TargetName="myWindowName" Storyboard.TargetProperty="Left" From="500" To="200" Duration="0:0:3"  AutoReverse="False"/>
    </Storyboard>
 </Window.Resources>

然后在“窗口（或控件） Loaded事件中

 private void myWindowName_Loaded(object sender, RoutedEventArgs e)
 {
      //Reference System.Windows.Media.Animation;
      Storyboard storyBoardIn = (Storyboard)TryFindResource("sb2");
      storyBoardIn.Begin();
 }

显然，您将需要在XAML中更改情节提要参数，以实现所需的确切功能。 在WPF中，此解决方案的代码更少，更可靠。 祝你好运！