Transform变换

//TranslateTransform平移变换
        <!--将矩形水平移动50单位,垂直移动50单位-->
        <Rectangle Height="50" Width="50" Fill="SkyBlue" Stroke="Blue" 
                   StrokeThickness="2" Canvas.Left="100" Canvas.Top="100">
            <Rectangle.RenderTransform>
                <TranslateTransform X="50" Y="50" />
            </Rectangle.RenderTransform>
        </Rectangle>


//RotateTransform旋转变换
        <!--旋转前的矩形-->
        <Rectangle Name="Rec3" Width="200" Height="10" Stroke="Blue" Fill="Red" Canvas.Left="100" Canvas.Top="100">
        </Rectangle>
        <!--不指定旋转基点(CenterX,CenterY)-->
        <Rectangle Name="Rec1" Width="200" Height="10" Stroke="Blue" Fill="Red" Canvas.Left="100" Canvas.Top="100">
            <Rectangle.RenderTransform>
                <RotateTransform Angle="25"/>
            </Rectangle.RenderTransform>
        </Rectangle>
        <!--指定旋转基点(CenterX,CenterY)-->
        <Rectangle Name="Rec2" Width="200" Height="10" Stroke="Blue" Fill="Red" Canvas.Left="100" Canvas.Top="100">
            <!--CenterX,CenterY点位于图形对象的左上角-->
            <Rectangle.RenderTransform>
                <RotateTransform Angle="50" CenterX="20" CenterY="5"/>
            </Rectangle.RenderTransform>
        </Rectangle>



//ScaleTransform缩放变换
    <Canvas>
        <!--原始矩形-->
        <TextBlock Canvas.Top="30" Text="原始矩形"></TextBlock>
        <Rectangle x:Name="Rec1" Canvas.Left="0" Canvas.Top="50" Width="100" Height="100" Fill="Red">
        </Rectangle>
        <!--垂直放大2倍-->
        <TextBlock Canvas.Top="180" Canvas.Left="10" Text="Y轴放大2倍"></TextBlock>
        <Rectangle x:Name="Rec2" Canvas.Left="0" Canvas.Top="200" Width="100" Height="100" Fill="Red">
            <Rectangle.RenderTransform>
                <ScaleTransform ScaleY="2"></ScaleTransform>
            </Rectangle.RenderTransform>
        </Rectangle>
        <!--水平放大2倍-->
        <TextBlock Canvas.Top="180" Canvas.Left="150" Text="X轴放大2倍"></TextBlock>
        <Rectangle x:Name="Rec3" Canvas.Left="150" Canvas.Top="200" Width="100" Height="100" Fill="Red">
            <Rectangle.RenderTransform>
                <ScaleTransform ScaleX="2"></ScaleTransform>
            </Rectangle.RenderTransform>
        </Rectangle>
        <!--水平和垂直缩小,并指定中心点-->
        <TextBlock Canvas.Top="30" Canvas.Left="150" Text="X轴和Y轴各自缩小2倍"></TextBlock>
        <Rectangle x:Name="Rec4" Canvas.Left="150" Canvas.Top="50" Width="100" Height="100" Fill="Red">
            <Rectangle.RenderTransform>
                <ScaleTransform ScaleX="0.5" ScaleY="0.5" CenterX="50" CenterY="50"></ScaleTransform>
            </Rectangle.RenderTransform>
        </Rectangle>
    </Canvas>





//SkewTransform扭曲变换
    <Canvas>
        <!--原始矩形-->
        <Rectangle x:Name="Rec1" Canvas.Left="0" Canvas.Top="0" Width="200" Height="100" Fill="Blue"></Rectangle>
        
        <!--水平扭曲50度-->
        <Rectangle x:Name="Rec2" Canvas.Left="210" Canvas.Top="0" Width="200" Height="100" Fill="Blue">
            <Rectangle.RenderTransform>
                <SkewTransform AngleX="50"/>
            </Rectangle.RenderTransform>
        </Rectangle>
        
        <!--垂直扭曲10度-->
        <Rectangle x:Name="Rec3" Canvas.Left="0" Canvas.Top="120" Width="200" Height="100" Fill="Blue">
            <Rectangle.RenderTransform>
                <SkewTransform AngleY="10"/>
            </Rectangle.RenderTransform>
        </Rectangle>
        
        <!--基于指定的中心点水平和垂直扭曲-->
        <Rectangle x:Name="Rec4" Canvas.Left="220" Canvas.Top="120" Width="200" Height="100" Fill="Blue">
            <Rectangle.RenderTransform>
                <SkewTransform AngleY="10" AngleX="10" CenterX="100" CenterY="50"/>
            </Rectangle.RenderTransform>
        </Rectangle>
        
    </Canvas>


//TransformGroup组合变换
    <Canvas>
        <!--先旋转,再扭曲一个文本块-->
        <TextBlock FontSize="28" Canvas.Left="10" Canvas.Top="10" Text="在文本块中组合多个变换">
            <TextBlock.RenderTransform>
              <TransformGroup>
                <RotateTransform Angle="45" />
                <ScaleTransform ScaleX="0.5" ScaleY="0.5"/>
              </TransformGroup>
            </TextBlock.RenderTransform>
        </TextBlock>
    </Canvas>

 

posted on 2013-03-28 14:10  JackSlaterYu  阅读(185)  评论(0编辑  收藏  举报