Gewusst wie: Drehen eines Objekts

Aktualisiert: November 2007

Dieses Beispiel zeigt, wie ein Objekt gedreht wird. Im Beispiel wird zuerst ein RotateTransform erstellt und dann dessen Angle in Grad angegeben.

Im folgenden Beispiel wird ein Polyline-Objekt um 45 Grad um seine linke obere Ecke gedreht.

Beispiel

<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.
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);

Die Eigenschaften CenterX und CenterY von RotateTransform geben den Punkt an, um den das Objekt gedreht wird. Dieser Mittelpunkt wird im Koordinatenraum des Elements ausgedrückt, das transformiert wird. Standardmäßig wird die Drehung um den Punkt (0,0), die obere linke Ecke des zu transformierenden Objekts, vorgenommen.

Im nächsten Beispiel wird ein Polyline-Objekt um 45 Grad im Uhrzeigersinn um den Punkt (25,50) gedreht.

<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.
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);

In der folgenden Abbildung werden die Ergebnisse der Anwendung von Transform auf die beiden Objekte dargestellt.

Zwei Objekte, die um unterschiedliche Drehpunkte um 45 Grad gedreht werden

45-Grad-Drehungen mit unterschiedlichen Mittelpunkten

Das Polyline-Objekt in den vorherigen Beispielen ist ein UIElement. Wenn Sie ein Transform-Objekt auf die RenderTransform-Eigenschaft eines UIElement-Objekts anwenden, können Sie mithilfe der RenderTransformOrigin-Eigenschaft einen Ursprung für jedes Transform-Objekt angeben, das Sie auf das Element anwenden. Da für die RenderTransformOrigin-Eigenschaft relative Koordinaten verwendet werden, können Sie auch dann eine Transformation auf den Mittelpunkt des Elements anwenden, wenn Sie dessen Größe nicht kennen. Weitere Informationen und ein Beispiel finden Sie unter Gewusst wie: Angeben des Ursprungs einer Transformation mithilfe von relativen Werten.

Das vollständige Beispiel finden Sie unter Beispiel für 2D-Transformation.

Siehe auch

Konzepte

Übersicht über Transformationen

Referenz

Transform

Weitere Ressourcen

Gewusst-wie-Themen zu Transformationen