在 RenderTransfrom 属性上应用 ScaleTransfrom 后，新尺寸仍然相同

Question

在渲染的变换属性上进行缩放变换后，我得到了相同的尺寸。这是代码：

 shape.Width = 100; shape.Height=100;
 shape.RenderTransform = new ScaleTransform(.5, .5);
 textBox.text = shape.ActualWidth + " " + shape.ActualHeight;

我尝试获取渲染的几何边界的宽度和高度，但仍然相同。我也尝试了LayoutTransfrom，仍然不起作用。我做错了什么，任何帮助将不胜感激。

Answer 1

尝试设置 LayoutTransform 而不是 RenderTransform。

Answer 2

LayoutTransform 和 RenderTransform 之间的主要区别在于应用变换的时间。使用渲染变换时，在布局过程中会使用对象的完整大小，并且只有在完成之后才会变换对象。其他元素不受此影响。使用 LayoutTransform，对象已在布局阶段进行转换，这意味着对于所有预期目的，对象的边界框都会发生变化。所有其他元素也适应这种变化。

两者都不会更改 ActualWidth 或 ActualHeight，因为这会影响正在转换的对象的内部布局，从而使转换操作变得无用。

您可以在我为您准备的以下示例中看到这一点：

<StackPanel>
    <Border Name="OuterBorder1" HorizontalAlignment="Left" VerticalAlignment="Top" Background="Yellow">
        <Border Width="100" Height="100" Background="Green" Name="Border1" />
    </Border>
    <Button Content="Normal" Click="Normal_Click"/>
    <Button Content="Layout Transform" Click="Layout_Click"/>
    <Button Content="Render Transform" Click="Render_Click"/>
    <TextBlock Text="{Binding Path=ActualWidth, ElementName=Border1}"></TextBlock>
    <TextBlock Text="{Binding Path=ActualWidth, ElementName=OuterBorder1}"></TextBlock>
</StackPanel>

当您按下按钮时，会附加以下操作：

private void Normal_Click(object sender, RoutedEventArgs e)
{
    Border1.RenderTransform = new ScaleTransform(1, 1);
    Border1.LayoutTransform = new ScaleTransform(1, 1);
}

private void Layout_Click(object sender, RoutedEventArgs e)
{
    Border1.RenderTransform = new ScaleTransform(1, 1);
    Border1.LayoutTransform = new ScaleTransform(0.5, 0.5);
}

private void Render_Click(object sender, RoutedEventArgs e)
{
    Border1.LayoutTransform = new ScaleTransform(1, 1);
    Border1.RenderTransform = new ScaleTransform(0.5, 0.5);
}

OuterBorder1 具有对齐方式的覆盖，以确保它紧密贴合项目。

正如您所看到的，使用 RenderTransform 时，尺寸不会改变。使用 LayoutTransform，变换后的元素的宽度保持不变，但它周围的容器会受到影响。

Answer 3

尝试等待转换完成，我们知道它的方法是使用快速的 1 毫秒 DoubleAnimation 及其 Completed 事件。在此事件处理程序中检查新尺寸。

<Button x:Name="MyButton" Content="A Button"
  RenderTransformOrigin="0.5,0.5">
  <Button.RenderTransform>
    <RotateTransform x:Name="AnimatedRotateTransform" Angle="0" />
  </Button.RenderTransform>
  <Button.Triggers>
    <EventTrigger RoutedEvent="Button.Click">
      <BeginStoryboard>
        <Storyboard>
          <DoubleAnimation 
            Storyboard.TargetName="AnimatedRotateTransform"
            Storyboard.TargetProperty="Angle" 
            To="360" Duration="0:0:0.1" FillBehavior="Stop"
            Completed="RenderTransform_Completed" />
        </Storyboard>
      </BeginStoryboard>
    </EventTrigger>
  </Button.Triggers>
</Button>

代码背后...

    private void RenderTransform_Completed(object sender, EventArgs e)
    {
        textBox.text = AnimatedRotateTransform.Angle;
    }