HOW TO：旋轉物件

本範例說明如何旋轉物件。 此範例會先建立 RotateTransform，然後設定其 Angle 的角度。

下列範例會以左上角為準，旋轉 Polyline 物件 45 度。

範例

<Canvas Height="200" Width="200">

  <!-- Rotates the Polyline 45 degrees about the point (0,0). -->
  <Polyline Points="25,25 0,50 25,75 50,50 25,25 25,0" 
    Stroke="Blue" StrokeThickness="10"
    Canvas.Left="75" Canvas.Top="50">
    <Polyline.RenderTransform>
      <RotateTransform CenterX="0" CenterY="0" Angle="45" />
    </Polyline.RenderTransform>
  </Polyline>
</Canvas>

            ' Create a Polyline.
            Dim polyline1 As New Polyline()
            polyline1.Points.Add(New Point(25, 25))
            polyline1.Points.Add(New Point(0, 50))
            polyline1.Points.Add(New Point(25, 75))
            polyline1.Points.Add(New Point(50, 50))
            polyline1.Points.Add(New Point(25, 25))
            polyline1.Points.Add(New Point(25, 0))
            polyline1.Stroke = Brushes.Blue
            polyline1.StrokeThickness = 10

            ' Create a RotateTransform to rotate
            ' the Polyline 45 degrees about its
            ' top-left corner.
            Dim rotateTransform1 As New RotateTransform(45)
            polyline1.RenderTransform = rotateTransform1

            ' Create a Canvas to contain the Polyline.
            Dim canvas1 As New Canvas()
            canvas1.Width = 200
            canvas1.Height = 200
            Canvas.SetLeft(polyline1, 75)
            Canvas.SetTop(polyline1, 50)
            canvas1.Children.Add(polyline1)

// Create a Polyline.
Polyline polyline1 = new Polyline();
polyline1.Points.Add(new Point(25, 25));
polyline1.Points.Add(new Point(0, 50));
polyline1.Points.Add(new Point(25, 75));
polyline1.Points.Add(new Point(50, 50));
polyline1.Points.Add(new Point(25, 25));
polyline1.Points.Add(new Point(25, 0));
polyline1.Stroke = Brushes.Blue;
polyline1.StrokeThickness = 10;

// Create a RotateTransform to rotate
// the Polyline 45 degrees about its
// top-left corner.
RotateTransform rotateTransform1 =
    new RotateTransform(45);
polyline1.RenderTransform = rotateTransform1;

// Create a Canvas to contain the Polyline.
Canvas canvas1 = new Canvas();
canvas1.Width = 200;
canvas1.Height = 200;
Canvas.SetLeft(polyline1, 75);
Canvas.SetTop(polyline1, 50);
canvas1.Children.Add(polyline1);

RotateTransform 的 CenterX 和 CenterY 屬性會指定旋轉物件所依據的中心點。 此中心點會以轉換項目的座標空間表示。 根據預設，旋轉會以 (0,0) 為準，也就是要轉換之物件的左上角。

下面的範例會以點 (25,50) 為準，順時針旋轉 Polyline 物件 45 度。

<Canvas Height="200" Width="200">

  <!-- Rotates the Polyline 45 degrees about the point (25,50). -->
  <Polyline Points="25,25 0,50 25,75 50,50 25,25 25,0" 
    Stroke="Blue" StrokeThickness="10"
    Canvas.Left="75" Canvas.Top="50">
    <Polyline.RenderTransform>
      <RotateTransform CenterX="25" CenterY="50" Angle="45" />
    </Polyline.RenderTransform>
  </Polyline>
</Canvas>

            ' Create a Polyline.
            Dim polyline2 As New Polyline()
            polyline2.Points = polyline1.Points
            polyline2.Stroke = Brushes.Blue
            polyline2.StrokeThickness = 10

            ' Create a RotateTransform to rotate
            ' the Polyline 45 degrees about the
            ' point (25,50).
            Dim rotateTransform2 As New RotateTransform(45)
            rotateTransform2.CenterX = 25
            rotateTransform2.CenterY = 50
            polyline2.RenderTransform = rotateTransform2

            ' Create a Canvas to contain the Polyline.
            Dim canvas2 As New Canvas()
            canvas2.Width = 200
            canvas2.Height = 200
            Canvas.SetLeft(polyline2, 75)
            Canvas.SetTop(polyline2, 50)
            canvas2.Children.Add(polyline2)

// Create a Polyline.
Polyline polyline2 = new Polyline();
polyline2.Points = polyline1.Points;
polyline2.Stroke = Brushes.Blue;
polyline2.StrokeThickness = 10;

// Create a RotateTransform to rotate
// the Polyline 45 degrees about the
// point (25,50).
RotateTransform rotateTransform2 =
    new RotateTransform(45);
rotateTransform2.CenterX = 25;
rotateTransform2.CenterY = 50;
polyline2.RenderTransform = rotateTransform2;

// Create a Canvas to contain the Polyline.
Canvas canvas2 = new Canvas();
canvas2.Width = 200;
canvas2.Height = 200;
Canvas.SetLeft(polyline2, 75);
Canvas.SetTop(polyline2, 50);
canvas2.Children.Add(polyline2);

下圖顯示將 Transform 套用到兩個物件的結果。

從不同的旋轉中心旋轉 45 度的兩個物件

前述範例中的 Polyline 是一個 UIElement。 當您將 Transform 套用到 UIElement 的 RenderTransform 屬性，可以使用 RenderTransformOrigin 屬性指定要套用到項目的每個 Transform 的原點。 由於 RenderTransformOrigin 屬性使用相對座標，即使不知道項目的大小，也能將轉換套用到項目的中心。 如需詳細資訊和範例，請參閱 HOW TO：使用相對值指定轉換的原點。

如需完整範例，請參閱 2D 轉換範例 (英文)。

請參閱

參考

Transform

概念

轉換概觀

其他資源

轉換 HOW TO 主題