Опубликован: 15.06.2012 | Доступ: свободный | Студентов: 1546 / 109 | Оценка: 4.19 / 3.63 | Длительность: 07:02:00
Специальности: Программист
Лекция 7:

Работа с изображениями в Windows Phone 7

< Лекция 6 || Лекция 7: 12 || Лекция 8 >

Изображения из Интернета

Одна из самых замечательных возможностей, предоставляемых элементом Image – возможность задания URL в качестве значения свойства Source, как в данном проекте на Silverlight:

Проект Silverlight: SilverlightWebBitmap Файл: MainPage.xaml (фрагмент)

<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
            <Image Source="http://i3.msdn.microsoft.com/Areas/Sto/Content/Theming/windowsphone/images/logo_windowsphone.png" />
        </Grid>
Изображение из интернета

Рис. 7.4. Изображение из интернета

Несомненно, это довольно просто, и извлечение изображений из Интернета, вместо того чтобы сохранять их в приложении, конечно же, намного сокращает размер исполняемого файла. Но нет никакой гарантии, что приложение, выполняющееся под управлением Windows Phone 7, будет иметь подключение к Интернету, не говоря уже о других проблемах, связанных с загрузкой файлов. Элемент Image имеет два события, ImageOpened (Изображение открыто) и ImageFailed (Ошибка загрузки изображения), которые могут использоваться для определения успешности или сбоя загрузки.

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

Image и ImageSource

Более тщательное рассмотрение элемента Image приводит в замешательство. Элемент Image не является растровым изображением, он просто обеспечивает отображение растрового изображения. Во всех примерах ранее в качестве значения свойства Source объекта Image задавался путь к файлу или URL:

<Image Source="http://i3.msdn.microsoft.com/Areas/Sto/Content/Theming/windowsphone/images/logo_windowsphone.png" />

Можно предположить, что это свойство Source типа string. Это не так. На самом деле здесь представлен синтаксис XAML, скрывающий довольно многое. Свойство Source фактически типа ImageSource (Источник изображения). Это абстрактный класс, от которого наследуется BitmapSource (Источник растрового изображения). А это еще один абстрактный класс, описывающий метод SetSource (Задать источник), который позволяет загружать растровое изображение из объекта Stream.

От класса BitmapSource наследуется BitmapImage (Растровое изображение), который поддерживает конструктор, принимающий объект Uri и также включающий свойство UriSource (Источник URI) типа Uri. Проект SilverlightTapToDownload1 имитирует приложение, загружающее растровое изображение, URL которого известен только во время выполнения. XAML включает элемент Image без растрового изображения:

Проект Silverlight: SilverlightTapToDownload1 Файл: MainPage.xaml (фрагмент)

<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
            <Image Name="img" />
        </Grid>

BitmapImage требует подключения пространства имен System.Windows.Media.Imaging посредством директивы using. Когда MainPage регистрирует касание, он создает BitmapImage из объекта Uri и задает его в качестве значения свойства Source элемента Image:

Проект Silverlight: SilverlightTapToDownload1 Файл: MainPage.xaml.cs (фрагмент)

public MainPage()
        {
            InitializeComponent();
        }
        protected override void OnManipulationStarted(ManipulationStartedEventArgs args)
        {
Uri uri = new Uri("http://i3.msdn.microsoft.com/Areas/Sto/Content/Theming/windowsphone/images/logo_windowsphone.png ");
System.Windows.Media.Imaging.BitmapImage bmp = new System.Windows.Media.Imaging.BitmapImage(uri);
            img.Source = bmp; args.Complete();
            args.Handled = true;
            base.OnManipulationStarted(args);
        } 

Не забудьте коснуться экрана, чтобы начать загрузку!

Класс BitmapImage описывает события ImageOpened и ImageFailed (которые дублируются элементом Image) и также включает событие DownloadProgess (Процесс загрузки).

Ключевые термины

GIF (Graphics Interchange File) — популярный формат графических изображений. Способен хранить сжатые данные без потери качества в формате не более 256 цветов. Имеет поддержку прозрачности и анимации.

JPEG (Joint Photography Experts Group) — один из популярных графических форматов, применяемый для хранения фотоизображений и подобных им изображений. Файлы, содержащие данные JPEG, обычно имеют расширения (суффиксы) .jpeg, .jfif, .jpg, .JPG, или .JPE.

PNG (Portable Network Graphics) — растровый формат хранения графической информации, использующий сжатие без потерь по алгоритму Deflate.

Краткие итоги

В данной лекции мы:

  • Узнали, что XNA поддерживает три формата:
    • GIF
    • JPEG
    • PNG

    А Silverlight только JPEG и PNG;

  • научились загружать изображения в программу на XNA;
  • научились загружать изображения в программу на Silverlight;
  • использовали изображения из интернета;
  • более подробно рассмотрели свойство Source элемента Image.

Набор для практики

Упражнения

Создайте свою программу содержащую изображения, как из самого проекта, так и из интернета.

< Лекция 6 || Лекция 7: 12 || Лекция 8 >