Изображения

177

Вывод изображений — одна из наиболее легких задач в Silverlight. Для этого достаточно добавить в разметку элемент Image и установить его свойство Source. Но при этом необходимо учитывать некоторые ограничения.

Наиболее очевидное ограничение состоит в том, что элемент Image поддерживает только два графических формата: формат JPEG поддерживается полностью, а формат PNG — с небольшими ограничениями (не выводятся файлы, в которых используются 64-битовые наборы цветов или черно-белый режим). Элемент Image не поддерживает файлы GIF. Это сделано по двум серьезным причинам: во-первых, для упрощения надстройки Silverlight и, следовательно, уменьшения времени загрузки и, во-вторых, для устранения потенциальных конфликтов между моделью анимации, встроенной в Silverlight, и средствами анимации, встроенными в формат GIF.

Важно также учитывать, что свойству Image.Source можно присвоить либо относительный, либо абсолютный адрес URI. Чаще используется относительный адрес изображения, хранящегося в ресурсе проекта. Например, если добавить в проект файл изображения myimage.jpg, программа Visual Studio автоматически присвоит ему статус ресурса и внедрит ресурс в скомпилированную сборку в качестве блока двоичных данных. Во время выполнения изображение можно извлечь с помощью имени ресурса (т.е. имени файла, приведенного в окне Solution Explorer). Ниже приведена разметка, задающая вывод изображения:

<Image Source="myimage.jpg" />

Если изображение находится во вложенной папке Images проекта, его можно извлечь следующим образом:

<Image Source="Images/myimage.jpg" />

Еще один способ вывода изображения состоит в создании объекта URI в коде и программной установке свойства Image.Source:

img.Source = new BitmapImage(new Uri("myimage.jpg", 
   UriKind.Relative));

Адрес URI может указывать на изображение, не внедренное в приложение. Изображение может храниться на том же сайте, что и приложение Silverlight, или на другом сайте:

<Image Source="http://professorweb.ru/img/main/title.png" />

Однако необходимо учитывать, что при тестировании статического сайта (т.е. сайта, на котором не используется технология ASP.NET или тестирующий веб-сервер программы Visual Studio) нельзя использовать абсолютные адреса URI. Это ограничение обусловлено требованиями безопасности, согласно которым приложение Silverlight всегда должно выполняться одним и тем же способом как в локальной файловой системе, так и при передаче файлов (в частности, файлов изображений) по каналам HTTP.

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

Размеры изображения

Задать размеры изображения можно двумя способами. Первый способ состоит в явном задании размеров с помощью свойств Height и Width. Во втором способе элемент Image помещается в контейнер, например в пропорциональную ячейку решетки Grid. В этом случае размеры изображения определяются размерами контейнера. Если в разметке не определен ни один из этих способов, изображение выводится с исходными размерами, т.е. размерами, определенными в файле изображения.

Для управления размерами изображения используется свойство Stretch. Оно определяет, как устанавливаются размеры изображения, если размеры элемента Image не совпадают с исходными размерами, заданными в файле изображения. В следующей таблице приведены доступные значения свойства Stretch, а на рисунке ниже показан внешний вид изображения при разных значениях Stretch:

Элементы перечисления Stretch
Элемент Описание
Fill Изображение растягивается до точных значений ширины и высоты элемента Image. Если явно установить свойства Height и Width, значение Fill игнорируется. При растягивании могут нарушаться пропорции рисунка по ширине и по высоте
None Изображение выводится с исходными размерами, определенными в графическом файле
Uniform Изображению присваиваются максимально возможные размеры, при которых оно помещается в элементе Image, но при этом не искажаются пропорции по ширине и по высоте. Значение Uniform установлено по умолчанию
UniformToFill Изображение растягивается или сжимается пропорционально по ширине и по высоте до тех пор, пока не будет заполнено все доступное пространство. Не поместившаяся часть изображения отсекается
Способы определения размеров изображения

Ошибки изображений

Некоторые факторы могут привести к тому, что изображение не появится на экране. Это происходит, например, при использовании адреса URI, указывающего на несуществующий файл, или при попытке отобразить файл изображения, хранящийся в неподдерживаемом графическом формате. В таких ситуациях элемент Image генерирует событие ImageFailed. В коде можно задать реакцию на это событие, чтобы диагностировать и устранить проблему. Например, если большое изображение недоступно на сайте или по какой-либо причине не загрузилось, код обработчика может заменить его небольшим изображением, внедренным в сборку приложения.

Ошибки изображений не являются катастрофическими. При их возникновении приложение продолжает нормально выполняться, оно не может лишь вывести изображение. В этом случае элемент Image остается пустым. Он долгое время остается также пустым, если файл изображения большой и его загрузка с сайта требует много времени. Надстройка Silverlight выполняет запросы асинхронно. Это означает, что во время загрузки большого файла изображения приложение не "сидит без дела", а обрабатывает и выводит остальные элементы страницы.

Пройди тесты
Лучший чат для C# программистов