Использование изображений в XAML

Преимущество XAML - возможность совмещения рисунков и фотографий на одной веб-странице.

Изображения можно разместить на веб-странице, просто банально, благодаря каневасам и XAML-тегам, но, более оригинально и интересно, можно, как с помощью развитого ПО рисования, использовать их для заполнения геометрических фигур.
Кроме того, в этом учебнике мы увидим, что XAML имеет возможности графического языка, такого как POV (Persistence Of Vision).
Распознанные форматы изображений - JPEG и PNG.

Добавить изображение

Тег Image используется для вставки изображения на страницу, источник которого просто присваивается атрибуту Source.

<Image Source="kauai.jpg" />

На следующем рисунке:

Атрибуты изображения

Высота: высота.
Width: width.
Canvas.Top: вертикальное положение.
Canvas.Left: горизонтальное положение.
Стретч: Адаптация изображения к контейнеру (каневасу или другому объекту).

Поместить рамку вокруг изображения

Это равносильно размещению изображения в прямоугольном объекте того же размера. Или использовать как текстуру прямоугольника.
Для этого используется тег ImageBrush, который переводится в «кисть с изображением».
Исходный кадр определяется свойством ImageSource (а не Source).

<Rectangle Width="160" Height="120"
	Stroke="Black"
	StrokeThicknexx="1"
  <Rectangle.Fill>
    <ImageBrush ImageSource="kauai.jpg" />
  </Rectangle.Fill>
</Rectangle>


Использование в качестве текстуры

Изображение может использоваться как текстура фигуры, например эллипса (это не сработает с полигонами). 

<Ellipse 
  Width="320" 
  Height="120" 
  Stroke="Black"      
  StrokeThicknexx="1" 
  <Ellipse.Fill> 
    <ImageBrush ImageSource="kauai.jpg" />
  </Ellipse.Fill> 
</Ellipse>

Получение исходных кодов