Главная » WPF » Геометрические преобразования

0

На самом базовом уровне системы рендеринга  в WPF нет понятия «позиции» элемента. Вместо использования координат x и y система полагается на геометри ческие преобразования, применяемые к точкам (напомним,  что в конечном итоге все сводится к геометрии). Самыми употребительными являются преобразования TranslateTransform (перенос), ScaleTransform (гомотетия) и RotateTransform (по ворот). С их помощью мы можем изменять  размер и положение  элемента, а так же вращать его вокруг некоторой точки. Внутри WPF выражает любую информа цию о положении  элемента в терминах преобразования TranslateTransform.

Преобразования можно комбинировать, то есть строить из них цепочки, нап ример: сдвинуть  элемент  на 5 пикселей  вправо, затем растянуть  с коэффициен том 3 и повернуть  на 15 градусов:

<Button>

<Button.RenderTransform>

<TransformGroup>

<TranslateTransform X=’5’ />

<ScaleTransform ScaleX=’2’ ScaleY=’2’ />

<RotateTransform Angle=’15’ />

</TransformGroup>

</Button.RenderTransform>

</Button>

Геометрические примитивы

Прежде  чем приступать  к обсуждению  геометрических примитивов, кистей, перьев и других деталей рисования пикселей  на экране, зададимся  вопросом, за чем все это нужно знать. Лично для меня это как понимание  грамматики языка. В случае  естественного  языка  – того, на котором  мы говорим  с детства,  – мы обычно  не вникаем  в детали  грамматических правил,  а просто  знаем, что пра вильно, а что – нет. Когда я впервые начал изучать иностранный язык, то многое узнал и об английском.  Я стал понимать, как применяются правила.  Понимание того, как работают  основные  конструкции графического  интерфейса, важно  по той же причине: наверняка вы в прошлом работали с другими графическими сис темами, и у каждой  были свои особенности,  правила  и возможности,  о которых вы уже сознательно и не думаете.

Геометрические  примитивы – это базовые строительные блоки всей двумер ной графики  в WPF. Любой рисунок представляется в виде последовательности графических примитивов, которые нужно нарисовать. А, стало быть, полезно по нимать, как эта система работает. Все примитивы, по существу, являются частны ми случаями PathGeometry, поэтому имеет смысл потратить время на знакомство с путями.

Путь – это последовательность фигур. Каждая  фигура  составлена  из набо ра сегментов. В каком то смысле сегменты можно уподобить программе «че репашьей  графики»,  с которой  я  работал  на  своем  стареньком  компьютере Apple II (команды  MoveTo, LineTo и т.д.). Сегмент – это команда переместить перо по экрану. Чтобы разобраться с этим, рассмотрим,  из каких сегментов составлены  фигуры,  которые  в совокупности дают изображение,  показанное на рис. 5.3.

Для начала нужно задать начальную точку фигуры. Простейшим сегментом является LineSegment, который рисует отрезок прямой из текущей точки (поме ченной на рис. 5.3 как «StartPoint») в указанную  («Line.Point»).

Чтобы увидеть, как это происходит,  включим в путь Path  примитив,  который мы определяем.  Если пометить  фигуру  признаком IsClosed,  то она будет содер жать отрезок, соединяющий конечную точку с начальной:

Рис. 5.3. Сложный путь, составленный из всех сегментов нескольких фигур

<Path Width=’200’ Height=’200’ Fill=’#111111’ Stroke=’Black’ StrokeThickness=’2’>

<Path.Data>

<PathGeometry>

<PathGeometry.Figures>

<PathFigure StartPoint=’5,5’ IsClosed=’True’>

<LineSegment Point=’90,5’ />

</PathFigure>

</PathGeometry.Figures>

</PathGeometry>

</Path.Data>

</Path>

Следующий интересный сегмент – это BezierSegment, который позволяет  оп ределить  кривую Безье  с помощью двух контрольных точек (Point1 и Point2) и конечной  точки (Point3). Этот и аналогичные  ему сегменты названы  на рис. 5.3

«Bezier.Point1»:

<PathFigure StartPoint=’5,5’ IsClosed=’True’>

<LineSegment Point=’90,5’ />

<BezierSegment Point1=’195,5’ Point2=’100,40’ Point3=’160,90’ />

</PathFigure>

Сегмент ArcSegment определяет дугу эллипса заданного размера до указанной точки («Arc.Point» на рис. 5.3):

<PathFigure StartPoint=’5,5’ IsClosed=’True’>

<LineSegment Point=’90,5’ />

<BezierSegment Point1=’195,5’ Point2=’100,40’ Point3=’160,90’ />

<ArcSegment Point=’50,130’ Size=’65,55’ IsLargeArc=’false’ SweepDirection=’Clockwise’ />

</PathFigure>

И, наконец, QuadraticBezierSegment («QBezier» на рис. 5.3) – это упрощенный вариант BezierSegment, требующий  только одной контрольной точки (Point1):

<PathFigure StartPoint=’5,5’ IsClosed=’True’>

<LineSegment Point=’90,5’ />

<BezierSegment Point1=’195,5’ Point2=’100,40’ Point3=’160,90’ />

<ArcSegment Point=’50,130’ Size=’65,55’ IsLargeArc=’false’ SweepDirection=’Clockwise’ />

<QuadraticBezierSegment Point1=’5,45’ Point2=’40,40’ />

</PathFigure>

В составе одного пути может быть не только произвольное число сегментов, но и фигуры. Эта возможность особенно полезна, потому что любая кисть закра шивает весь путь, следовательно, мы можем задать плавный  градиент, распрост раняющийся на несколько  фигур:

<Path …>

<Path.Data>

<PathGeometry>

<PathGeometry.Figures>

<PathFigure StartPoint=’5,5’ IsClosed=’True’>

</PathFigure>

<PathFigure StartPoint=’150,40’ IsClosed=’True’>

<LineSegment Point=’180,40’ />

<LineSegment Point=’180,60’ />

<LineSegment Point=’150,50’ />

</PathFigure>

</PathGeometry.Figures>

</PathGeometry>

</Path.Data>

</Path>

Последние   два  геометрических примитива –  комбинирующие. Это CombinedGeometry и GeometryGroup. Примитив GeometryGroup принимает список потомков и применяет к ним композицию.  Свойство  FillRule  определяет, какие  части получающейся фигуры  закрашивать. GeometryGroup может содер жать любое число дочерних примитивов, причем при любых условиях  контур каждого примитива рисуется независимо.

CombinedGeometry позволяет  объединить  ровно два примитива,  причем спо соб  создания  из  них  новой  фигуры  определяется  свойством GeometryCombineMode (на рис. 5.4 показаны  различные варианты). Так как CombinedGeometry создает одну новую фигуру, то прорисован  будет лишь внеш ний контур последней.

Рис. 5.4. Разные способы комбинирования геометрических примитивов

Обычно  сложные  геометрические формы  создаются  с помощью  инструмен тальных программ, потому что вручную ни описать, ни сопровождать  их впосле дствии практически нереально.  Но, усвоив базовые принципы,  вы будете знать, что возможно  и какое эффекты достижимы.

Источник: К. Андерсон  Основы  Windows Presentation Foundation. Пер. с англ. А. Слинкина — М.: ДМК Пресс, 2008 — 432 с.: ил.

По теме:

  • Комментарии