WPF中的多重变换效果

本文关键字：变换 WPF | 更新日期: 2023-09-27 17:59:01

我需要在WPF中通过c#应用多重变换效果。

我试过下面的代码，但我只看到最后一个效果，而不是两者结合在一起。

如果有可能的话，有什么线索吗？

XAML

<Grid>
   <Rectangle Fill="#FFF4F4F5" Name="rect" HorizontalAlignment="Left" Height="225" Margin="84,39,0,0" Stroke="Black" VerticalAlignment="Top" Width="299"/>
</Grid>

C#

SkewTransform skewTransform1 = new SkewTransform(45, 0, -50, 50);
rect.RenderTransform = skewTransform1;
RotateTransform rotateTransform  = new RotateTransform(30);
rect.RenderTransform = rotateTransform;

WPF中的多重变换效果

您必须在TransformGroup中组合这两种效果，而不是每次都覆盖它们：

var transformGroup = new TransformGroup(); 
var skewTransform = new SkewTransform(45, 0, -50, 50); 
var rotateTransform = new RotateTransform(30); 
transformGroup.Children.Add(skewTransform); 
transformGroup.Children.Add(rotateTransform); 
rect.RenderTransform = transformGroup;

如果您没有使用按钮或其他机制来应用转换，则可以仅在XAML 中定义

    <Rectangle Fill="#FFF4F4F5"
               Name="rect"
               HorizontalAlignment="Left"
               Height="225"
               Margin="84,39,0,0"
               Stroke="Black"
               VerticalAlignment="Top"
               Width="299">
        <Rectangle.RenderTransform>
            <TransformGroup>
                <SkewTransform AngleX="45"
                               AngleY="0"
                               CenterX="-50"
                               CenterY="50" />
                <RotateTransform Angle="30" />
            </TransformGroup>
        </Rectangle.RenderTransform>
    </Rectangle>

如果添加一个触发器部分，则可以使其具有交互性。

    <Rectangle Fill="#FFF4F4F5"
               Name="rect"
               HorizontalAlignment="Left"
               Height="225"
               Margin="84,39,0,0"
               Stroke="Black"
               VerticalAlignment="Top"
               Width="299">
        <Rectangle.RenderTransform>
            <TransformGroup>
                <SkewTransform AngleX="45"
                               AngleY="0"
                               CenterX="-50"
                               CenterY="50" />
                <RotateTransform x:Name="RotateTransform"
                                 Angle="0" />
            </TransformGroup>
        </Rectangle.RenderTransform>
        <Rectangle.Triggers>
            <EventTrigger RoutedEvent="Rectangle.MouseDown">
                <BeginStoryboard>
                    <Storyboard>
                        <DoubleAnimation Storyboard.TargetName="RotateTransform"
                                         Storyboard.TargetProperty="Angle"
                                         To="360"
                                         Duration="0:0:5"
                                         FillBehavior="Stop" />
                    </Storyboard>
                </BeginStoryboard>
            </EventTrigger>
        </Rectangle.Triggers>
    </Rectangle>
相关文章：