Основы XAML

:

Основы XAML
[+]
Опубликован: 23.01.2009 | Уровень: для всех | Доступ: платный
Лекция 2:

Основные фигуры SVG – графики
A
|
версия для печати
< Лекция 1 || Лекция 2: 12345678 || Лекция 3 >

Группы в WPF

Рассмотрим теперь эту же самую группу меню "Object \ Combine" применительно к WPF-приложениям (рис. 2.21):

Группа "Object \ Combine".

увеличить изображение
Рис. 2.21. Группа "Object \ Combine".

При использовании визуальных средств каждый из пунктов этого меню по-прежнему преобразовывает исходные фигуры в объект Path. Результат определяются следующим образом (рис. 2.22):

1. – Фигуры до объединения, 2. – Объединение (Unite (Union)), 3. – Деление (Divide (-)), 4. – Пересечение (Intersect (Intersect)), 5. – Удаление совмещенного (Exclude Overlap (Xor)), 6. – Вычитание (Subtract (Exclude)).

увеличить изображение
Рис. 2.22. 1. – Фигуры до объединения, 2. – Объединение (Unite (Union)), 3. – Деление (Divide (-)), 4. – Пересечение (Intersect (Intersect)), 5. – Удаление совмещенного (Exclude Overlap (Xor)), 6. – Вычитание (Subtract (Exclude)).

Однако в WPF-приложениях имеется синтаксис, позволяющий получать тот же самый результат в виде читабельного кода. Такие примеры приводятся в табл. 2.7.

Таблица 2.7. Группы в WPF
№ Код Вид в браузере
2.7.1
<Window
xmlns="http://schemas.microsoft.com/
winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/
winfx/2006/xaml"
x:Class="Group_WPF.Window1"
x:Name="Window"
Title="Исходные фигуры"
Width="215" Height="200">

<Grid x:Name="LayoutRoot">
<Ellipse Width="100" 
Height="100" 
Stroke="Black" StrokeThickness="1"  
Fill="#2b2b2b" 
Margin="25,25,75,25" />
<Ellipse Width="100" Height="100"  
Stroke="Black" StrokeThickness="1" 
Fill="#f47419" 
Margin="75,25,25,25" />

</Grid>
</Window>

Описание
Исходные фигуры, причем оранжевый эллипс расположен над серым
№ Код Вид в браузере
2.7.2
<Window
xmlns="http://schemas.microsoft.com/winfx/
2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/
winfx/2006/xaml"
x:Class="Group_WPF.Window1"
x:Name="Window"
Title="Union"
Width="215" Height="200">

<Grid x:Name="LayoutRoot">
<Path Stroke="Black" 
StrokeThickness="1" 
Fill="#f47419">
 <Path.Data>
 <CombinedGeometry GeometryCombineMode="
 Union">
  <CombinedGeometry.Geometry1>        
   <EllipseGeometry RadiusX="50" 
   RadiusY="50" Center="125,75" />
   </CombinedGeometry.Geometry1>
   <CombinedGeometry.Geometry2>
  <EllipseGeometry RadiusX="50" 
  RadiusY="50" 
  Center="75,75" />
    </CombinedGeometry.Geometry2>
  </CombinedGeometry>
</Path.Data>
</Path>
</Grid>
</Window>

Описание
Значение "Union" атрибута GeometryCombineMode
№ Код Вид в браузере
2.7.3
<Window
xmlns="http://schemas.microsoft.com/winfx/2006/
xaml/presentation"
xmlns:x="http://schemas.microsoft.com/
winfx/2006/xaml"
x:Class="Group_WPF.Window1"
x:Name="Window"
Title="Original"
Width="215" Height="200">
<Grid x:Name="LayoutRoot">
<Path Margin="25,32,24,32" 
Fill="#f47419" Stretch="Fill" 
Stroke="Black" StrokeThickness="1" 
Data="M100,0.5 C127.3381,0.49999893 
149.5,22.661904 149.5,49.999999 
C149.5,77.338096 127.3381,99.499999 100,
99.499999 C90.869587,99.499999 82.316544,
97.027984 75,92.671836 89.669403,84.1193 
99.5,68.207679 99.5,49.999999 99.5,
31.792319 89.669403,15.880696 75,7.3281606 
C82.316544,2.9720165 90.869587,0.49999893 
100,0.5 z M75,7.3281606 C89.669403,15.880696 
99.5,31.792319 99.5,49.999999 99.5,68.207679 
89.669403,84.1193 75,92.671836 C60.330596,
84.1193 50.5,68.207679 50.5,49.999999 C50.5,
31.792319 60.330596,15.880696 75,7.3281606 z 
M49.999999,0.5 C59.130414,0.49999893 
67.683458,2.9720165 75,7.3281606 C60.330596,
15.880696 50.5,31.792319 50.5,49.999999 
C50.5,68.207679 60.330596,84.1193 75,
92.671836 C67.683458,97.027984 59.130414,
99.499999 49.999999,99.499999 22.661905,
99.499999 0.5,77.338096 0.5,49.999999 0.5,
22.661904 22.661905,0.49999893 49.999999,
0.5 z"/>
</Grid>
</Window>

Описание
Для значения "Divide" пункта меню нет программного аналога. Здесь мы в визуальном режиме выбрали этот пункт, а среда сгенерировала объект Path
№ Код Вид в браузере
2.7.4
<Window
xmlns="http://schemas.microsoft.com/
winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/
winfx/2006/xaml"
x:Class="Group_WPF.Window1"
x:Name="Window"
Title="Intersect"
Width="215" Height="200">

<Grid x:Name="LayoutRoot">
<Path Stroke="Black" StrokeThickness="1"
Fill="#f47419">
 <Path.Data>
    <CombinedGeometry GeometryCombineMode="Intersect">
     <CombinedGeometry.Geometry1>        
      <EllipseGeometry RadiusX="50" 
      RadiusY="50" Center="125,75" />
     </CombinedGeometry.Geometry1>
     <CombinedGeometry.Geometry2>
   <EllipseGeometry RadiusX="50" 
   RadiusY="50" Center="75,75" />
     </CombinedGeometry.Geometry2>
   </CombinedGeometry>
 </Path.Data>
</Path>
</Grid>
</Window>

Описание
Значение "Intersect" атрибута GeometryCombineMode
№ Код Вид в браузере
2.7.5
<Window
xmlns="http://schemas.microsoft.com/winfx/
2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/
winfx/2006/xaml"
x:Class="Group_WPF.Window1"
x:Name="Window"
Title="Xor"
Width="215" Height="200">
<Grid x:Name="LayoutRoot">
<Path Stroke="Black" StrokeThickness="1" 
Fill="#f47419">
 <Path.Data>
    <CombinedGeometry GeometryCombineMode="Xor">
     <CombinedGeometry.Geometry1>        
      <EllipseGeometry RadiusX="50" 
      RadiusY="50" Center="125,75" />
     </CombinedGeometry.Geometry1>
     <CombinedGeometry.Geometry2>
   <EllipseGeometry RadiusX="50" 
   RadiusY="50" Center="75,75" />
     </CombinedGeometry.Geometry2>
   </CombinedGeometry>
 </Path.Data>
</Path>
</Grid>
</Window>

Описание
Значение "Xor" атрибута GeometryCombineMode
№ Код Вид в браузере
2.7.6
<Window
xmlns="http://schemas.microsoft.com/
winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/
winfx/2006/xaml"
x:Class="Group_WPF.Window1"
x:Name="Window"
Title="Exclude"
Width="215" Height="200">

<Grid x:Name="LayoutRoot">
<Path Stroke="Black" StrokeThickness="1" 
Fill="#f47419">
 <Path.Data>
    <CombinedGeometry GeometryCombineMode="Exclude">
     <CombinedGeometry.Geometry1>        
      <EllipseGeometry RadiusX="50" 
      RadiusY="50" Center="125,75" />
     </CombinedGeometry.Geometry1>
     <CombinedGeometry.Geometry2>
   <EllipseGeometry RadiusX="50" RadiusY="50"
   Center="75,75" />
     </CombinedGeometry.Geometry2>
   </CombinedGeometry>
 </Path.Data>
</Path>
</Grid>
</Window>

Описание
Значение "Exclude" атрибута GeometryCombineMode

Мы видим, что в WPF-приложениях можно формировать фигуры с помощью возможностей, которые всегда были особенностями графических пакетов, например, таких как CorelDRAW (рис. 2.23):

Объединение фигур в пакете CorelDRAW с помощью группы меню "Arrange \ Shaping".

Рис. 2.23. Объединение фигур в пакете CorelDRAW с помощью группы меню "Arrange \ Shaping".
Дальше >>
< Лекция 1 || Лекция 2: 12345678 || Лекция 3 >

Вопросы и ответы

вопросов: 0

Студенты

всего: 14
Илья Столупин
Илья Столупин
Россия
предложить дружбу
Олег Борхаленко
Олег Борхаленко
Украина
предложить дружбу