Трансформация фигур

WPF --- Графика и анимация WPF --- Трансформация фигур

Чтобы трансформировать фигуру, свойству RenderTransform присваивается объект трансформации, который требуется применить. В зависимости от используемого объекта трансформации нужно заполнить определенные свойства, чтобы сконфигурировать его.

Например, для поворачивания фигуры необходимо использовать RotateTransform и указать угол в градусах. Ниже приведен пример поворота квадрата на 25 градусов:

<Rectangle Width="120" Height="30" MinHeight="30" Stroke="Blue" StrokeThickness="2"
    Canvas.Top="120" Canvas.Left="250">
       <Rectangle.RenderTransform>
                 <RotateTransform Angle="25"></RotateTransform>
       </Rectangle.RenderTransform>
</Rectangle>

Трансформация фигуры подобным образом осуществляется поворотом относительно ее начальной точки (левого верхнего угла). На рисунке показан поворот одного и того же прямоугольника на 25, 50, 75 и затем 100 градусов:

Иногда требуется повернуть фигуру вокруг другой точки. RotateTransform, как и многие другие классы трансформаций, предоставляет свойства CenterX и CenterY. Их можно использовать для указания центральной точки, вокруг которой должен быть выполнен поворот. Ниже показано, как повернуть прямоугольник на 25 градусов вокруг его центральной точки:

<Rectangle Width="80" Height="10" Stroke="Blue" Fill="Yellow" 
      Canvas.Left="100" Canvas.Top="300">
      <Rectangle.RenderTransform>
        <RotateTransform Angle="25" CenterX="45" CenterY="5" />
      </Rectangle.RenderTransform>
    </Rectangle>

Поворот прямоугольника вокруг его центра

Существуют четкие ограничения на использование свойств CenterX и CenterY класса RotateTransform. Упомянутые свойства определяются в абсолютных координатах, а это означает, что необходимо точно знать, где находится центральная точка содержимого. В случае отображения динамического содержимого (например, изображения разных размеров или элементы, размеры которых могут изменяться) это представляет проблему. К счастью, WPF предлагает решение в виде удобного свойства RenderTransformOrigin, поддерживаемого всеми фигурами. Это свойство устанавливает центральную точку, используя пропорциональную координатную систему, которая простирается от 0 до 1 по обоим измерениям. Другими словами, точка (0,0) представляет левый верхний угол, а (1,1) — правый нижний. (Если область фигуры не квадратная, координатная система соответствующим образом растягивается.)

При установке свойства RenderTransformOrigin можно использовать значения больше 1 или меньше 0 для указания точки, расположенной за пределами фигуры. Например, эту технику можно применять с трансформацией RotateTransform для поворота фигуры по большой дуге вокруг очень удаленной точки, такой как (5,5).