Silverlight к насыщенным интернет-приложениям ( |
 (рис 22.1) Официальный логотип MS Silverlight |
Silverlight предоставляет графическую систему, схожую с Windows Presentation Foundation, и объединяет мультимедиа, графику, анимацию и интерактивность в одной программной платформе. Она была разработана для работы с XAML и с языками Microsoft .NET. XAML используется для разметки страниц, использующих Silverlight приложениях, доступен для поисковых систем, так как его код доступен в виде XAML, т.е. имеет текстовый формат как и XML.
Silverlight:
WMV , WMA MP3 для всех поддерживаемых браузеров, не требуя при этом дополнительных компонентов, таких как Windows Media Player XML и использовать DOM для взаимодействия с ним так же, как это делается в Ajax Silverlight содержит объект Downloader, благодаря которому можно скачивать скрипты, медиа файлы и т. д., если это необходимо приложению.Начиная с версии 2.0, логика программы может быть описана в любом из языков .NET.
Первая бета-версия Silverlight была выпущена в декабре 2006 года. Архитектура Silverlight 1.0 представлена на рис.22.2
(рис 22.2) Архитектура Silverlight 1.0Версия Silverlight 2.0 была выпущена 14 октября 2008 года и включала в себя подмножестово библиотек .NET Framework.
(рис 22.3) Архитектура Silverlight 2.0Silverlight предоставляет UI, как анимация с использованием временной шкалы, векторная графика и аудиовизуальные мультимедиа. Это возможно благодаря средствам формирования визуального представления XAML для браузера, предоставляемым Silverlight. Насыщенный UI может создаваться как XAML -код. Браузер получает XAML и визуализирует его.
В сочетании с такой технологией, как JavaScript, - Silverlight может быть динамическим процессом. Фрагменты XAML можно загружать и добавлять в UI, или можно редактировать, реорганизовывать или удалять XAML, находящийся в данный момент в дереве визуального представления, используя простое программирование на JavaScript.
Основная функциональность Silverlight обеспечивается XAML и обеспечивает модель программирования, которая может основываться либо на JavaScript, либо на .NET Framework и CLR. Поддерживающая это архитектура представлена на рис.22.3. Основным механизмом программирования Silverlight 1.0 в браузере является JavaScript DOM API. Он позволяет перехватывать JavaScript DOM можно манипулировать элементами XAML, например, управлять воспроизведением мультимедиа или анимацией.
Для создания еще более насыщенного и функционального интерфейса доступны все возможности .NET Framework CLR. Помимо того, что можно сделать в JavaScript, данная возможность предлагает множество пространств имен и элементов управления, поставляемых как часть .NET Framework, что позволяет делать вещи, которые было очень сложно, или вообще невозможно, реализовать в JavaScript. Например, доступ к данным с помощью ADO.NET и LINQ, обмен информацией с
В основе выполняющегося в браузере приложения обычно заложен обычный HTML код. Эта разметка содержит вызовы для создания экземпляров подключаемого модуля Silverlight. При взаимодействии с приложением Silverlight пользователи генерируют события, которые могут быть обработаны функциями JavaScript или .NET Framework. В свою очередь, код программы может вызывать методы элементов содержимого Silverlight для управления ими, добавления нового или удаления существующего содержимого. Наконец, XAML. Сам XAML может быть встроен в страницу, существовать как внешний статический файл или как динамический XAML, возвращаемый сервером./
Объединяя свои возможности с Microsoft Visual Studio и Microsoft Expression Blend, Silverlight 3 позволяет миллионам разработчиков приложений для платформы .NET создавать современные Silverlight, -приложения стали полноправными участниками современной ИТ-среды.
Silverlight 3 предоставляет следующие новые возможности и функции, полностью поддерживаемые Visual Studio и Expression Blend:
GPU RIA Кроме того, чтобы обеспечить полную интеграцию со всеми средствами разработки .NET, пакеты Visual Studio 2010 и Visual Web Developer Express будут поддерживать полностью интерактивный и редактируемый дизайнер для Silverlight 3.
trusted COMXAML - это язык разметки на базе XML, используемый для определения визуальных элементов приложения. К ним относятся UI, графические элементы, анимации, мультимедиа, элементы управления и пр. XAML был представлен Microsoft в Windows Presentation Foundation (WPF) , которая является технологией, ориентированной на выполнение на клиентском компьютере, и частью .NET Framework 3.0 (и последующих версий).
XAML, используемый в Silverlight, отличается от XAML в WPF. В данном случае XAML - это подмножество, ориентированное на возможности Веб-приложений.
В XAML все UI описываются с помощью элементов XML. Корнем всех XAML -документов Silverlight является элемент-контейнер, такой как Canvas (Холст), определяющий область, в которой будут отрисованы элементы UI. При построении Silverlight -приложения корневой элемент Canvas будет содержать объявления пространств имен XML, необходимых Silverlight.
Рассмотрим пример XAML -документа:
<Canvas xmlns=" http://schemas.microsoft.com/client/2007"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xam l"
Width="640" Height="480" Background = "White">
</Canvas>
Здесь можно увидеть объявление двух пространств имен. Типовой документ XAML содержит базовый набор элементов и атрибутов и дополнительный набор, для описания которого обычно используется префикс x:. Примером дополнительного атрибута пространства имен является широко используемый x:Name, с помощью которого задается имя элемента XAML, что позволяет ссылаться на него в коде. Корневой элемент Canvas объявляет местоположение пространства имен всех элементов.
Элемент Canvas является контейнером. Это означает, что он может содержать другие элементы как дочерние. Эти элементы тоже могут быть контейнерами для других элементов, определяя UI как дерево XML -документа. Например, ниже представлен простой XAML -документ с рядом дочерних элементов, некоторые из которых сами являются контейнерами Canvas:
Здесь можно увидеть, что у корневого Canvas есть два дочерних элемента: Rectangle и другой Canvas. Второй Canvas также содержит Rectangle и Canvas, и в последнем Canvas находится еще два элемента Rectangle. Такая иерархическая структура позволяет логически группировать элементы управления и использовать для них общую компоновку и поведение.
На рис.22.4 представлен результат исполнения Silverlight в браузере.
(рис 22.4) Вложенные контейнеры в Silverlight XAML в Silverlight поддерживает ряд фигур, которые можно сочетать для получения более сложных объектов. Из основных можно назвать следующие фигуры:
Rectangle позволяет определять на экране прямоугольную форму;Ellipse позволяет определять эллипс или круг;Line отрисовывает прямую линию, соединяющую две точки;Polygon отрисовывает многоугольник;Polyline Path позволяет создавать нелинейные контуры.Помимо этого, XAML поддерживает кисти ( brushes ), которые определяют, как объект закрашивается на экране. Внутренняя область объекта закрашивается с помощью кисти fill, а контур объекта отрисовывается кистью
В примере ниже используется кисть SolidColorBrush для закрашивания эллипса:
<Ellipse Canvas.Top="15" Canvas.Left="30" Width="250" Height="180">
<Ellipse.Fill>
<SolidColorBrush Color="Black" />
</Ellipse.Fill>
</Ellipse>
(рис 22.5) Пример использования кисти SolidColorBrush Заливки и обводки также могут иметь градиентную заливку. Для этого используется градиентная кисть.
XAML также поддерживает отображение текста. Для этого используется элемент TextBlock. Типовые свойства текста, такие как содержимое, тип шрифта, размер шрифта, обтекание и др., можно изменять через атрибуты.
Трансформация объектов в XAML осуществляется с помощью ряда трансформаций. К ним относятся:
RotateTransform поворачивает элемент на заданный уголScaleTransform используется для изменения масштаба объектаSkewTransform наклоняет объект в заданном направлении на заданный уголTranslateTransform перемещает объект в направлении, соответственно заданному векторуMatrixTransform используется для создания математического преобразования, которое может сочетать все вышеперечисленноеВ XAML возможна группировка трансформаций. Группируя существующие трансформации, можно создать сложную трансформацию. То есть можно, например, переместить объект с помощью трансляции, изменить его размер с помощью масштабирования и при этом повернуть его. Рассмотрим пример, в котором выполняется разворот и изменение масштаба холста:
<Grid.RenderTransform>
<TransformGroup>
<RotateTransform Angle="45" CenterX="150" CenterY="80"/>
<ScaleTransform ScaleX="1.1" ScaleY="1.2" />
</TransformGroup>
</Grid.RenderTransform>
(рис 22.6) Пример трансформаций в Silverlight Поддержка анимации в XAML реализована посредством определения изменений свойств со временем. Для этого используется временная шкала. Временные шкалы располагаются в раскадровке. Существуют различные типы анимации:
DoubleAnimation обеспечивает возможность анимации числовых свойств, например таких, которые используются для определения положенияColorAnimation обеспечивает возможность анимации цветовых свойств, таких как заливкиPointAnimation обеспечивает возможность анимации точек, определенных в двухмерном пространствеИзменять свойства можно линейно, тогда свойство меняет значения с течением времени, или в режиме "
Ниже приводится HTML код веб-страницы, использующей Silverlight приложение:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title> SilverlightSample </title>
<style type="text/css">
html, body {
height: 100%;
overflow: auto;
}
body {
padding: 0;
margin: 0;
}
#silverlightControlHost {
height: 100%;
text-align:center;
}
</style>
<script type="text/javascript" src="Silverlight.js"></script>
<script type="text/javascript">
function onSilverlightError(sender, args) {
var appSource = "";
if (sender != null sender != 0) {
appSource = sender.getHost().Source;
}
var errorType = args.ErrorType;
var iErrorCode = args.ErrorCode;
if (errorType == "ImageError" || errorType == "MediaError") {
return;
}
var errMsg = "Unhandled Error in Silverlight Application " + appSource + "\n" ;
errMsg += "Code: "+ iErrorCode + " \n";
errMsg += "Category: " + errorType + " \n";
errMsg += "Message: " + args.ErrorMessage + " \n";
if (errorType == "ParserError") {
errMsg += "File: " + args.xamlFile + " \n";
errMsg += "Line: " + args.lineNumber + " \n";
errMsg += "Position: " + args.charPosition + " \n";
}
else if (errorType == "RuntimeError") {
if (args.lineNumber != 0) {
errMsg += "Line: " + args.lineNumber + " \n";
errMsg += "Position: " + args.charPosition + " \n";
}
errMsg += "MethodName: " + args.methodName + " \n";
}
throw new Error(errMsg);
}
</script>
</head>
<body>
<form name="form1" method="post" action="SilverlightSampleTestPage.aspx" id="form1"
style="height:100%">
<div>
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE"
value="/wEPDwUJNzgzNDMwNTMzZGQ/xyUlnh+Njw13GNNCd7VpDXlAuQ==" />
</div>
<div id="silverlightControlHost">
<object data="data:application/x-silverlight-2," type="application/x-silverlight-2" width="100%"
height="100%">
<param name="source" value="ClientBin/SilverlightSample.xap"/>
<param name="onError" value="onSilverlightError" />
<param name="background" value="white" />
<param name="minRuntimeVersion" value="3.0.40624.0" />
<param name="autoUpgrade" value="true" />
<a href="http://go.microsoft.com/fwlink/?LinkID=149156v=3.0.40624.0" style="text-
decoration:none">
<img src="http://go.microsoft.com/fwlink/?LinkId=108181"
alt="Get Microsoft Silverlight" style="border-style:none"/>
</a>
</object>
<iframe id="_sl_historyFrame" style="visibility:hidden;height:
0px;width:0px;border:0px"></iframe>
</div>
</form>
</body>
</html>
Как видно из кода, на веб-странице используется сценарий Silverlight.js, который обеспечивает загрузку и установку подключаемого модуля для клиентов, не имеющих его, и элемент <object> , исходный код для которого содержится в файле с расширением XAP, созданным в Microsoft Visual Studio или Microsoft Visual Web Developer Express.
В принципе, для использования и создания приложений Silverlight не требуется никакого специального программного обеспечения. Создавать сайты на Silverlight можно, используя любое ПО для разработки веб-сайтов, начиная от Notepad, заканчивая Microsoft Visual Web Developer Express или Expression Blend.
Для этого, прежде всего, необходимо создать HTML -файл. Элемент управления Silverlight будет размещаться на этой странице путем вставки в нее тега <object> , как в приведенном выше примере. Только вместо файла с расширением XAP - указывается XAML файл.
С помощью тега <object> создается экземпляр Silverlight. Это стандартный HTML тег, следовательно, он поддерживает стандартные параметры. Ниже приводится лишь неполный список параметров (тех, которые были использованы в предыдущем примере):
Type (Тип) определяет тип загружаемого объекта. В данном случае задано значение application/x-silverlight-2, которое указывает браузеру загружать Silverlight для доступа к этому содержимому.Width (Ширина) определяет ширину элемента управления в процентном соотношении или в пикселах.Height (Высота) определяет высоту элемента управления в процентном соотношении или в пикселах.ID определяет имя элемента управления, используемое в коде JavaScript.Объекты поддерживают разные наборы настраиваемых параметров, поэтому HTML -тег <object> поддерживает список элементов <Param> , позволяющие задавать нестандартные параметры. Эти элементы используются для определения пар имя/значение.
XAML предоставляет ряд визуальных элементов для создания UI. К элементам UI относятся Canvas, Ellipse, и другие.
Каждый из этих элементов поддерживает полнофункциональный набор методов и событий.
Элемент UI поддерживает следующие события:
GotFocus (Получение фокуса) .KeyDown (Нажатие клавиши).Key Up (Удерживаемая клавиша отпущена).Loaded. Это событие формируется, когда содержимое Silverlight загружено в элемент управления Silverlight и проведен его LostFocus (Потеря фокуса).MouseEnter (Вход курсора мыши).MouseLeave (Выход курсора мыши).MouseLeftButtonDown. Это событие возникает при нажатии пользователем левой кнопки мыши, когда курсор находится над элементом UI.MouseLeftButtonUp (Удерживаемая левая кнопка мыши отпущена).MouseMove (Перемещение мыши).XAML может применяться в качестве инструмента взаимодействия из серверных приложений, разработанных на базе языков сценариев, а Silverlight может использоваться для связи с этими приложениями. Также возможно использование JavaScript для получения данных от серверных приложений, а открытая природа дерева визуального отображения Silverlight позволяет передавать эти данные в элемент управления Silverlight для дальнейшего отображения.
Silverlight предлагает ряд APIs ), обеспечивающих возможность работы с удаленными данными. Например, предоставляет в распоряжение разработчика классы для работы с сетью и для связи с WebClient, HttpWebRequest, HttpWebRespose и др.).
Одно из наиболее важных применений Silverlight в Веб - обеспечение поддержки мультимедиа следующего поколения, которое может воспроизводиться на разных платформах. Для этого Silverlight поддерживает элемент управления MediaElement.
Элемент управления MediaElement поддерживает следующие форматы.
WMV1: Windows Media Video 7 WMV2: Windows Media Video 8 WMV3: Windows Media Video 9 WMVA: Windows Media Video Advanced Profile (не-VC -1) WMVC1: Windows Media Video Advanced Profile, VC -1 H.264: Видео, кодированное в популярном формате H264 (только Silverlight 3+ ).WMA7 (Windows Media Audio 7) WMA8 (Windows Media Audio 8) WMA9 (Windows Media Audio 9) MP3 (ISO/MPEG Layer 3) Кроме этих форматов, элемент управления MediaElement также поддерживает списки воспроизведения ASX и протоколы HTTP, HTTPS и
Если говорить о потоковой передаче видео и/или аудио, MediaElement поддерживает потоковое вещание и потоковую передачу по запросу от сервера, выполняющего Windows Media. Если для URI задан протокол
Если определен протокол HTTP или HTTPS, то MediaElement сначала делает попытку выполнить прогрессивную загрузку, и в случае неудачи пытается использовать потоковую передачу файла.
Чтобы начать работу с элементом управления MediaElement, достаточно добавить его на свою страницу и задать в качестве значения его атрибута Source - URL видеофайла, который требуется воспроизвести:
<UserControl x:Class="SilverlightApplication.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d" d:DesignWidth="1280" d:DesignHeight="720">
<Grid x:Name="LayoutRoot" Background="White">
<MediaElement x:Name="vid" Source="Wildlife.wmv"/>
</Grid>
</UserControl>
Deep Zoom обеспечивает новый уникальный способ управления изображениями в приложениях. Эта технология реализована в XAML с помощью элемента MultiScaleImage, который, дает возможность управлять размером и масштабом изображений, при этом Silverlight обеспечивает необходимое виртуальное пространство, в котором эти изображения могут быть отображаться.
Deep Zoom позволяет создавать изображения с высочайшим разрешением и отображать их без предварительной полной загрузки.
Рассмотрим в качестве примера онлайн карты. По сути, карта - это огромное изображение, разделенное на фрагменты, которые можно объединять для просмотра всей области. Когда требуется просмотреть определенную часть карты, картографическое программное обеспечение загружает и отображает соответствующий фрагмент. Это же программное обеспечение предоставляет фрагменты, необходимые для реализации изменения масштаба карты. Deep Zoom работает аналогичным образом. Когда пользователь увеличивает масштаб, Silverlight загружает соответствующие фрагменты для формирования визуального представления изображения с заданным масштабом. Таким образом, можно полностью сохранить точность изображения, но при этом будут загружаться только те его фрагменты, которые просматриваются пользователем в данный момент.
Кроме того, технология Deep Zoom позволяет встраивать изображение с одним масштабом в изображение с другой степенью увеличения, что открывая возможности для разнообразных спецэффектов.
Для работы с такими изображениями удобно использовать программу Deep Zoom Composer, создающую на выходе граф сцены для XAML с несколькими изображениями в специального XML файла, который в дальнейшем используется элементом управления MultiScaleImage, формирующим представление содержимого Deep Zoom:
<MultiScaleImage x:Name="msi" Source="/GeneratedImages/dzc_output.xml"/>
Как и для всех элементов управления Silverlight для MultiScaleImage дает возможность определить методы обработки событий. Например, для перемещения изображения можно обрабатывать обычные события, связанные с мышью: MouseLeftButtonDown, MouseLeftButtonUp и MouseMove. При этом они обрабатываются так же, как это делается при перемещении любого элемента методом " drag-and-drop ".
Silverlight к насыщенным интернет-приложениям ( |
(рис 22.1) Официальный логотип MS Silverlight |
Silverlight предоставляет графическую систему, схожую с Windows Presentation Foundation, и объединяет мультимедиа, графику, анимацию и интерактивность в одной программной платформе. Она была разработана для работы с XAML и с языками Microsoft .NET. XAML используется для разметки страниц, использующих Silverlight приложениях, доступен для поисковых систем, так как его код доступен в виде XAML, т.е. имеет текстовый формат как и XML.
Silverlight:
WMV , WMA MP3 для всех поддерживаемых браузеров, не требуя при этом дополнительных компонентов, таких как Windows Media Player XML и использовать DOM для взаимодействия с ним так же, как это делается в Ajax Silverlight содержит объект Downloader, благодаря которому можно скачивать скрипты, медиа файлы и т. д., если это необходимо приложению.Начиная с версии 2.0, логика программы может быть описана в любом из языков .NET.
Первая бета-версия Silverlight была выпущена в декабре 2006 года. Архитектура Silverlight 1.0 представлена на рис.22.2
(рис 22.2) Архитектура Silverlight 1.0Версия Silverlight 2.0 была выпущена 14 октября 2008 года и включала в себя подмножестово библиотек .NET Framework.
(рис 22.3) Архитектура Silverlight 2.0Silverlight предоставляет UI, как анимация с использованием временной шкалы, векторная графика и аудиовизуальные мультимедиа. Это возможно благодаря средствам формирования визуального представления XAML для браузера, предоставляемым Silverlight. Насыщенный UI может создаваться как XAML -код. Браузер получает XAML и визуализирует его.
В сочетании с такой технологией, как JavaScript, - Silverlight может быть динамическим процессом. Фрагменты XAML можно загружать и добавлять в UI, или можно редактировать, реорганизовывать или удалять XAML, находящийся в данный момент в дереве визуального представления, используя простое программирование на JavaScript.
Основная функциональность Silverlight обеспечивается XAML и обеспечивает модель программирования, которая может основываться либо на JavaScript, либо на .NET Framework и CLR. Поддерживающая это архитектура представлена на рис.22.3. Основным механизмом программирования Silverlight 1.0 в браузере является JavaScript DOM API. Он позволяет перехватывать JavaScript DOM можно манипулировать элементами XAML, например, управлять воспроизведением мультимедиа или анимацией.
Для создания еще более насыщенного и функционального интерфейса доступны все возможности .NET Framework CLR. Помимо того, что можно сделать в JavaScript, данная возможность предлагает множество пространств имен и элементов управления, поставляемых как часть .NET Framework, что позволяет делать вещи, которые было очень сложно, или вообще невозможно, реализовать в JavaScript. Например, доступ к данным с помощью ADO.NET и LINQ, обмен информацией с
В основе выполняющегося в браузере приложения обычно заложен обычный HTML код. Эта разметка содержит вызовы для создания экземпляров подключаемого модуля Silverlight. При взаимодействии с приложением Silverlight пользователи генерируют события, которые могут быть обработаны функциями JavaScript или .NET Framework. В свою очередь, код программы может вызывать методы элементов содержимого Silverlight для управления ими, добавления нового или удаления существующего содержимого. Наконец, XAML. Сам XAML может быть встроен в страницу, существовать как внешний статический файл или как динамический XAML, возвращаемый сервером./
Объединяя свои возможности с Microsoft Visual Studio и Microsoft Expression Blend, Silverlight 3 позволяет миллионам разработчиков приложений для платформы .NET создавать современные Silverlight, -приложения стали полноправными участниками современной ИТ-среды.
Silverlight 3 предоставляет следующие новые возможности и функции, полностью поддерживаемые Visual Studio и Expression Blend:
GPU RIA Кроме того, чтобы обеспечить полную интеграцию со всеми средствами разработки .NET, пакеты Visual Studio 2010 и Visual Web Developer Express будут поддерживать полностью интерактивный и редактируемый дизайнер для Silverlight 3.
trusted COMXAML - это язык разметки на базе XML, используемый для определения визуальных элементов приложения. К ним относятся UI, графические элементы, анимации, мультимедиа, элементы управления и пр. XAML был представлен Microsoft в Windows Presentation Foundation (WPF) , которая является технологией, ориентированной на выполнение на клиентском компьютере, и частью .NET Framework 3.0 (и последующих версий).
XAML, используемый в Silverlight, отличается от XAML в WPF. В данном случае XAML - это подмножество, ориентированное на возможности Веб-приложений.
В XAML все UI описываются с помощью элементов XML. Корнем всех XAML -документов Silverlight является элемент-контейнер, такой как Canvas (Холст), определяющий область, в которой будут отрисованы элементы UI. При построении Silverlight -приложения корневой элемент Canvas будет содержать объявления пространств имен XML, необходимых Silverlight.
Рассмотрим пример XAML -документа:
<Canvas xmlns=" http://schemas.microsoft.com/client/2007"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xam l"
Width="640" Height="480" Background = "White">
</Canvas>
Здесь можно увидеть объявление двух пространств имен. Типовой документ XAML содержит базовый набор элементов и атрибутов и дополнительный набор, для описания которого обычно используется префикс x:. Примером дополнительного атрибута пространства имен является широко используемый x:Name, с помощью которого задается имя элемента XAML, что позволяет ссылаться на него в коде. Корневой элемент Canvas объявляет местоположение пространства имен всех элементов.
Элемент Canvas является контейнером. Это означает, что он может содержать другие элементы как дочерние. Эти элементы тоже могут быть контейнерами для других элементов, определяя UI как дерево XML -документа. Например, ниже представлен простой XAML -документ с рядом дочерних элементов, некоторые из которых сами являются контейнерами Canvas:
Здесь можно увидеть, что у корневого Canvas есть два дочерних элемента: Rectangle и другой Canvas. Второй Canvas также содержит Rectangle и Canvas, и в последнем Canvas находится еще два элемента Rectangle. Такая иерархическая структура позволяет логически группировать элементы управления и использовать для них общую компоновку и поведение.
На рис.22.4 представлен результат исполнения Silverlight в браузере.
(рис 22.4) Вложенные контейнеры в Silverlight XAML в Silverlight поддерживает ряд фигур, которые можно сочетать для получения более сложных объектов. Из основных можно назвать следующие фигуры:
Rectangle позволяет определять на экране прямоугольную форму;Ellipse позволяет определять эллипс или круг;Line отрисовывает прямую линию, соединяющую две точки;Polygon отрисовывает многоугольник;Polyline Path позволяет создавать нелинейные контуры.Помимо этого, XAML поддерживает кисти ( brushes ), которые определяют, как объект закрашивается на экране. Внутренняя область объекта закрашивается с помощью кисти fill, а контур объекта отрисовывается кистью
В примере ниже используется кисть SolidColorBrush для закрашивания эллипса:
<Ellipse Canvas.Top="15" Canvas.Left="30" Width="250" Height="180">
<Ellipse.Fill>
<SolidColorBrush Color="Black" />
</Ellipse.Fill>
</Ellipse>
(рис 22.5) Пример использования кисти SolidColorBrush Заливки и обводки также могут иметь градиентную заливку. Для этого используется градиентная кисть.
XAML также поддерживает отображение текста. Для этого используется элемент TextBlock. Типовые свойства текста, такие как содержимое, тип шрифта, размер шрифта, обтекание и др., можно изменять через атрибуты.
Трансформация объектов в XAML осуществляется с помощью ряда трансформаций. К ним относятся:
RotateTransform поворачивает элемент на заданный уголScaleTransform используется для изменения масштаба объектаSkewTransform наклоняет объект в заданном направлении на заданный уголTranslateTransform перемещает объект в направлении, соответственно заданному векторуMatrixTransform используется для создания математического преобразования, которое может сочетать все вышеперечисленноеВ XAML возможна группировка трансформаций. Группируя существующие трансформации, можно создать сложную трансформацию. То есть можно, например, переместить объект с помощью трансляции, изменить его размер с помощью масштабирования и при этом повернуть его. Рассмотрим пример, в котором выполняется разворот и изменение масштаба холста:
<Grid.RenderTransform>
<TransformGroup>
<RotateTransform Angle="45" CenterX="150" CenterY="80"/>
<ScaleTransform ScaleX="1.1" ScaleY="1.2" />
</TransformGroup>
</Grid.RenderTransform>
(рис 22.6) Пример трансформаций в Silverlight Поддержка анимации в XAML реализована посредством определения изменений свойств со временем. Для этого используется временная шкала. Временные шкалы располагаются в раскадровке. Существуют различные типы анимации:
DoubleAnimation обеспечивает возможность анимации числовых свойств, например таких, которые используются для определения положенияColorAnimation обеспечивает возможность анимации цветовых свойств, таких как заливкиPointAnimation обеспечивает возможность анимации точек, определенных в двухмерном пространствеИзменять свойства можно линейно, тогда свойство меняет значения с течением времени, или в режиме "
Ниже приводится HTML код веб-страницы, использующей Silverlight приложение:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title> SilverlightSample </title>
<style type="text/css">
html, body {
height: 100%;
overflow: auto;
}
body {
padding: 0;
margin: 0;
}
#silverlightControlHost {
height: 100%;
text-align:center;
}
</style>
<script type="text/javascript" src="Silverlight.js"></script>
<script type="text/javascript">
function onSilverlightError(sender, args) {
var appSource = "";
if (sender != null sender != 0) {
appSource = sender.getHost().Source;
}
var errorType = args.ErrorType;
var iErrorCode = args.ErrorCode;
if (errorType == "ImageError" || errorType == "MediaError") {
return;
}
var errMsg = "Unhandled Error in Silverlight Application " + appSource + "\n" ;
errMsg += "Code: "+ iErrorCode + " \n";
errMsg += "Category: " + errorType + " \n";
errMsg += "Message: " + args.ErrorMessage + " \n";
if (errorType == "ParserError") {
errMsg += "File: " + args.xamlFile + " \n";
errMsg += "Line: " + args.lineNumber + " \n";
errMsg += "Position: " + args.charPosition + " \n";
}
else if (errorType == "RuntimeError") {
if (args.lineNumber != 0) {
errMsg += "Line: " + args.lineNumber + " \n";
errMsg += "Position: " + args.charPosition + " \n";
}
errMsg += "MethodName: " + args.methodName + " \n";
}
throw new Error(errMsg);
}
</script>
</head>
<body>
<form name="form1" method="post" action="SilverlightSampleTestPage.aspx" id="form1"
style="height:100%">
<div>
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE"
value="/wEPDwUJNzgzNDMwNTMzZGQ/xyUlnh+Njw13GNNCd7VpDXlAuQ==" />
</div>
<div id="silverlightControlHost">
<object data="data:application/x-silverlight-2," type="application/x-silverlight-2" width="100%"
height="100%">
<param name="source" value="ClientBin/SilverlightSample.xap"/>
<param name="onError" value="onSilverlightError" />
<param name="background" value="white" />
<param name="minRuntimeVersion" value="3.0.40624.0" />
<param name="autoUpgrade" value="true" />
<a href="http://go.microsoft.com/fwlink/?LinkID=149156v=3.0.40624.0" style="text-
decoration:none">
<img src="http://go.microsoft.com/fwlink/?LinkId=108181"
alt="Get Microsoft Silverlight" style="border-style:none"/>
</a>
</object>
<iframe id="_sl_historyFrame" style="visibility:hidden;height:
0px;width:0px;border:0px"></iframe>
</div>
</form>
</body>
</html>
Как видно из кода, на веб-странице используется сценарий Silverlight.js, который обеспечивает загрузку и установку подключаемого модуля для клиентов, не имеющих его, и элемент <object> , исходный код для которого содержится в файле с расширением XAP, созданным в Microsoft Visual Studio или Microsoft Visual Web Developer Express.
В принципе, для использования и создания приложений Silverlight не требуется никакого специального программного обеспечения. Создавать сайты на Silverlight можно, используя любое ПО для разработки веб-сайтов, начиная от Notepad, заканчивая Microsoft Visual Web Developer Express или Expression Blend.
Для этого, прежде всего, необходимо создать HTML -файл. Элемент управления Silverlight будет размещаться на этой странице путем вставки в нее тега <object> , как в приведенном выше примере. Только вместо файла с расширением XAP - указывается XAML файл.
С помощью тега <object> создается экземпляр Silverlight. Это стандартный HTML тег, следовательно, он поддерживает стандартные параметры. Ниже приводится лишь неполный список параметров (тех, которые были использованы в предыдущем примере):
Type (Тип) определяет тип загружаемого объекта. В данном случае задано значение application/x-silverlight-2, которое указывает браузеру загружать Silverlight для доступа к этому содержимому.Width (Ширина) определяет ширину элемента управления в процентном соотношении или в пикселах.Height (Высота) определяет высоту элемента управления в процентном соотношении или в пикселах.ID определяет имя элемента управления, используемое в коде JavaScript.Объекты поддерживают разные наборы настраиваемых параметров, поэтому HTML -тег <object> поддерживает список элементов <Param> , позволяющие задавать нестандартные параметры. Эти элементы используются для определения пар имя/значение.
XAML предоставляет ряд визуальных элементов для создания UI. К элементам UI относятся Canvas, Ellipse, и другие.
Каждый из этих элементов поддерживает полнофункциональный набор методов и событий.
Элемент UI поддерживает следующие события:
GotFocus (Получение фокуса) .KeyDown (Нажатие клавиши).Key Up (Удерживаемая клавиша отпущена).Loaded. Это событие формируется, когда содержимое Silverlight загружено в элемент управления Silverlight и проведен его LostFocus (Потеря фокуса).MouseEnter (Вход курсора мыши).MouseLeave (Выход курсора мыши).MouseLeftButtonDown. Это событие возникает при нажатии пользователем левой кнопки мыши, когда курсор находится над элементом UI.MouseLeftButtonUp (Удерживаемая левая кнопка мыши отпущена).MouseMove (Перемещение мыши).XAML может применяться в качестве инструмента взаимодействия из серверных приложений, разработанных на базе языков сценариев, а Silverlight может использоваться для связи с этими приложениями. Также возможно использование JavaScript для получения данных от серверных приложений, а открытая природа дерева визуального отображения Silverlight позволяет передавать эти данные в элемент управления Silverlight для дальнейшего отображения.
Silverlight предлагает ряд APIs ), обеспечивающих возможность работы с удаленными данными. Например, предоставляет в распоряжение разработчика классы для работы с сетью и для связи с WebClient, HttpWebRequest, HttpWebRespose и др.).
Одно из наиболее важных применений Silverlight в Веб - обеспечение поддержки мультимедиа следующего поколения, которое может воспроизводиться на разных платформах. Для этого Silverlight поддерживает элемент управления MediaElement.
Элемент управления MediaElement поддерживает следующие форматы.
WMV1: Windows Media Video 7 WMV2: Windows Media Video 8 WMV3: Windows Media Video 9 WMVA: Windows Media Video Advanced Profile (не-VC -1) WMVC1: Windows Media Video Advanced Profile, VC -1 H.264: Видео, кодированное в популярном формате H264 (только Silverlight 3+ ).WMA7 (Windows Media Audio 7) WMA8 (Windows Media Audio 8) WMA9 (Windows Media Audio 9) MP3 (ISO/MPEG Layer 3) Кроме этих форматов, элемент управления MediaElement также поддерживает списки воспроизведения ASX и протоколы HTTP, HTTPS и
Если говорить о потоковой передаче видео и/или аудио, MediaElement поддерживает потоковое вещание и потоковую передачу по запросу от сервера, выполняющего Windows Media. Если для URI задан протокол
Если определен протокол HTTP или HTTPS, то MediaElement сначала делает попытку выполнить прогрессивную загрузку, и в случае неудачи пытается использовать потоковую передачу файла.
Чтобы начать работу с элементом управления MediaElement, достаточно добавить его на свою страницу и задать в качестве значения его атрибута Source - URL видеофайла, который требуется воспроизвести:
<UserControl x:Class="SilverlightApplication.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d" d:DesignWidth="1280" d:DesignHeight="720">
<Grid x:Name="LayoutRoot" Background="White">
<MediaElement x:Name="vid" Source="Wildlife.wmv"/>
</Grid>
</UserControl>
Deep Zoom обеспечивает новый уникальный способ управления изображениями в приложениях. Эта технология реализована в XAML с помощью элемента MultiScaleImage, который, дает возможность управлять размером и масштабом изображений, при этом Silverlight обеспечивает необходимое виртуальное пространство, в котором эти изображения могут быть отображаться.
Deep Zoom позволяет создавать изображения с высочайшим разрешением и отображать их без предварительной полной загрузки.
Рассмотрим в качестве примера онлайн карты. По сути, карта - это огромное изображение, разделенное на фрагменты, которые можно объединять для просмотра всей области. Когда требуется просмотреть определенную часть карты, картографическое программное обеспечение загружает и отображает соответствующий фрагмент. Это же программное обеспечение предоставляет фрагменты, необходимые для реализации изменения масштаба карты. Deep Zoom работает аналогичным образом. Когда пользователь увеличивает масштаб, Silverlight загружает соответствующие фрагменты для формирования визуального представления изображения с заданным масштабом. Таким образом, можно полностью сохранить точность изображения, но при этом будут загружаться только те его фрагменты, которые просматриваются пользователем в данный момент.
Кроме того, технология Deep Zoom позволяет встраивать изображение с одним масштабом в изображение с другой степенью увеличения, что открывая возможности для разнообразных спецэффектов.
Для работы с такими изображениями удобно использовать программу Deep Zoom Composer, создающую на выходе граф сцены для XAML с несколькими изображениями в специального XML файла, который в дальнейшем используется элементом управления MultiScaleImage, формирующим представление содержимого Deep Zoom:
<MultiScaleImage x:Name="msi" Source="/GeneratedImages/dzc_output.xml"/>
Как и для всех элементов управления Silverlight для MultiScaleImage дает возможность определить методы обработки событий. Например, для перемещения изображения можно обрабатывать обычные события, связанные с мышью: MouseLeftButtonDown, MouseLeftButtonUp и MouseMove. При этом они обрабатываются так же, как это делается при перемещении любого элемента методом " drag-and-drop ".
Для получения официальных документов о завершении программы дополнительного профессионального образования (удостоверения о повышении квалификации, дипломов о профессиональной переподготовке и MBA) необходимо предоставить:
Внимание! Вы можете не заказывать доставку бумажной версии официального документы, а скачать его в электронном виде и распечатать самостоятельно. Информация о выданном документе в течение 1 месяца загружается в Федеральную информационную систему «Федеральный реестр сведений о документах об образовании и (или) о квалификации, документах об обучении» - ФИС ФРДО.
Доступ на новый сайт осуществляется с использованием адреса электронной почты, который был указан вами при регистрации на "старом". Мы постарались перенести все ваши данные с прежнего ресурса, однако не исключена вероятность потери части информации.
При возникновении проблемы со входом, воспользуйтесь функцией сброса пароля
Если вы обнаружите несоответствия, пожалуйста, сообщите нам.