Главная » Silverlight » Вывод изображения пример для Silverlight

0

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

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

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

<Image Source="grandpiano. jpg"></Image>

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

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

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

img.Source = new Bitmaplmage(new Uri("grandpiano.jpg", UriKind.Relative));

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

<Image Source="http://www.mysite.com/Images/grandpiano.jpg">

</Image>

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

Дополнительную информацию об управлении ресурсами и несколько примеров ис­пользования разных вариантов адреса URI можно найти в главе 6.

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

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

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

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

Таблица 5.3. Элементы перечисления stretch

Элемент

Описание

Fill

Изображение растягивается до точных значений ширины и высоты элемента Image; если явно установить свойства Height и Width, значение Fill игнорируется; при растягивании могут нарушаться пропорции рисунка по ширине и высоте

None

Изображение выводится с исходными размерами, определенными в графическом файле

Uniform

Изображению присваиваются максимально возможные размеры, при которых оно помещается в элементе Image, но при этом не искажаются пропорции по ширине и высоте; значение Uniform установлено по умолчанию

UniformToFill

Изображение растягивается или сжимается пропорционально по ширине и высоте до тех пор, пока не будет заполнено все доступное пространство; не поместившаяся часть изображения отсекается

Рис. 5.5. Способы определения размеров изображения; под изображениями приведены значения свойства Stretch

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

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

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

Источник: Мак-Дональд, Мэтью. Silverlight 3 с примерами на С# для профессионалов. : Пер. с англ. —- М. : ООО «И.Д. Вильяме», 2010. — 656 с. : ил. — Парал. тит. англ.

По теме:

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