Чтение онлайн

ЖАНРЫ

Язык программирования C#9 и платформа .NET5
Шрифт:

Конфигурирование перьев

В сравнении с кистями перо представляет собой объект для рисования границ геометрических объектов или в случае класса

Line
либо
PolyLine
— самого линейного геометрического объекта. В частности, класс
Pen
позволяет рисовать линию указанной толщины, представленной значением типа
double
. Вдобавок объект
Pen
может быть сконфигурирован с помощью того же самого вида свойств, что и в классе
Shape
, таких как начальный и конечный концы пера, шаблоны точек-тире и т.д. Например, для определения атрибутов пера к определению фигуры можно добавить следующую разметку:

<Pen Thickness="10" LineJoin="Round" EndLineCap="Triangle"

StartLineCap="Round" />

Во

многих случаях создавать объект
Pen
непосредственно не придется, потому что это делается косвенно, когда присваиваются значения свойствам вроде
StrokeThickness
производного от
Shape
типа (а также других типов
UIElement
). Однако строить специальный объект
Pen
удобно при работе с типами, производными от
Drawing
(которые рассматриваются позже в главе). Среда Visual Studio не располагает редактором перьев как таковым, но позволяет для выбранного элемента конфигурировать все свойства, связанные со штрихами, с использованием окна Properties.

Применение графических трансформаций

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

System.Winodws.Media.Transform
. В табл. 26.5 кратко описаны основные классы, производные от
Transform
.

Трансформации могут применяться к любым объектам

UIElement
(например, к объектам производных от
Shape
классов, а также к элементам управления
Button
,
TextBox
и т.п.). Используя классы трансформаций, можно визуализировать графические данные под заданным углом, скашивать изображение на поверхности и растягивать, сжимать либо поворачивать целевой элемент разными способами.

На заметку! Хотя объекты трансформаций могут применяться повсеместно, вы сочтете их наиболее удобными при работе с анимацией WPF и специальными шаблонами элементов управления. Как будет показано далее в главе, анимацию WPF можно использовать для включения в специальный элемент управления визуальных подсказок, предназначенных конечному пользователю.

Назначать целевому объекту (

Button
,
Path
и т.д.) трансформацию (либо целый набор трансформаций) можно с помощью двух общих свойств,
LayoutTransform
и
RenderTransform
.

Свойство

LayoutTransform
удобно тем, что трансформация происходит перед визуализацией элементов в диспетчере компоновки и потому не влияет на операции Z-упорядочивания (т.е. трансформируемые данные изображений не перекрываются).

С другой стороны, трансформация из свойства

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

Первый взгляд на трансформации

Вскоре вы добавите к проекту

RenderingWithShapes
некоторую трансформирующую логику. Чтобы увидеть объект трансформации в действии, откройте редактор Kaxaml, определите внутри корневого элемента
Page
или
Window
простой элемент
StackPanel
и установите свойство
Orientation
в
Horizontal
. Далее добавьте следующий элемент
Rectangle
, который будет нарисован под углом в 45 градусов с применением объекта
RotateTransform
:

<!-- Элемент Rectangle с трансформацией поворотом -->

<Rectangle Height ="100" Width ="40" Fill ="Red">

<Rectangle.LayoutTransform>

<RotateTransform Angle ="45"/>

</Rectangle.LayoutTransform>

</Rectangle>

Здесь элемент

Button
скашивается на поверхности на 20 градусов посредством трансформации
SkewTransform
:

<!-- Элемент Button с трансформацией скашиванием -->

<Button Content ="Click Me!" Width="95" Height="40">

<Button.LayoutTransform>

<SkewTransform AngleX ="20" AngleY ="20"/>

</Button.LayoutTransform>

</Button>

Для полноты картины ниже приведен элемент

Ellipse
, масштабированный на 20% с помощью трансформации
ScaleTransform
(обратите внимание на значения, установленные в свойствах
Height
и
Width
), а также элемент
TextBox
, к которому применена группа объектов трансформации:

<!-- Элемент Ellipse, масштабированный на 20% -->

<Ellipse Fill ="Blue" Width="5" Height="5">

<Ellipse.LayoutTransform>

<ScaleTransform ScaleX ="20" ScaleY ="20"/>

</Ellipse.LayoutTransform>

</Ellipse>

<!-- Элемент TextBox, повернутый и скошенный -->

<TextBox Text ="Me Too!" Width="50" Height="40">

<TextBox.LayoutTransform>

<TransformGroup>

<RotateTransform Angle ="45"/>

<SkewTransform AngleX ="5" AngleY ="20"/>

</TransformGroup>

</TextBox.LayoutTransform>

</TextBox>

Следует отметить, что в случае применения трансформации выполнять какие-либо ручные вычисления для реагирования на проверку попадания, перемещение фокуса ввода и аналогичные действия не придется. Графический механизм WPF самостоятельно решает такие задачи. Например, на рис. 26.8 можно видеть, что элемент

TextBox
по-прежнему реагирует на клавиатурный ввод.

Трансформация данных Canvas

Теперь нужно внедрить в пример

RenderingWithShapes
логику трансформации. Помимо применения объектов трансформации к одиночному элементу (
Rectangle
,
TextBox
и т.д.) их можно также применять к диспетчеру компоновки, чтобы трансформировать все внутренние данные. Например, всю панель
DockPanel
главного окна можно было бы визуализировать под углом:

Поделиться с друзьями: