Автор: Дмитрий Шейко, 07 апреля 2005
4 [XAML – язык авалонский]
Было бы странно, если бы столь перспективную нишу рынка проигнорировала компания Microsoft. Ныне в активном развитии XAML (eXtemsible Application Markup Language) – язык интерфейсов платформы Windows Longhorn.
Модель приложений Longhorn включает объект Application. Его набор свойств, методов исобытий позволяет объединить веб-документы в связанное приложение. Объект Application контролирует выполнение программы игенерирует события для пользовательского кода. Документы приложения пишутся на XAML. Впрочем, с помощью XAML описывается, прежде всего, пользовательский интерфейс. Логика приложения по-прежнему управляется процедурным кодом (С#, VB и т.д.). XAML может использоваться как для браузер-базированных приложений, так и для локальных настольных приложений.
XAML включает основные четыре категории элементов: панели, элементы управления, элементы, связанные с документом и графические фигуры. Заявлено 7 классов панелей, которые задают принципы отображения вложенных в них элементов. Для задания положения элементов относительно границ родительской панели используются атрибуты на манер свойств в объектно-ориентированных языках. Подобный синтаксис не очень вяжется с рекомендациями CSS, но будет привычен программистам настольных приложений.
Пример задания атрибутов элементам в XAML.
<table class=code cellpadding=5 align=center width=98% border=1 bordercolor=#3B3B3B><tr><td>
<Border Background="green"
Canvas.Top="100px" Canvas.Left="100px"
Height="100px" Width="100px" />
</td></tr></table>
Приложения, объявленные в XAML, могут включать множество страниц. Элемент управления PageViewer позволяет разбивать содержание на страницы и обеспечивает навигацию по ним. Элемент ContextMenu помогает в создании навигационных меню приложения. Код процедурного языка может быть размещен непосредственно в файле XAML или же назначен при сборке проекта.
В настоящее время стабильной версии Longhorn нет, но Microsoft выпустила в ноябре 2004 Avalon CTP, позволяющий использовать XAML на платформах Windows XP и Windows Server 2003. Последнюю версию этого пакета можно найти по этому адресу: http://www.microsoft.com/downloads/details.aspx?familyid=C8F904E1-B4CA-402B-ACCF-AAA2BD60DA74&displaylang=en
Пример простого интерфейса на XAML с 3-мя кнопками, визуализация одной из которых зависит от наличия ее содержания
Источник: http://www.joemarini.com/tutorials/tutorialpages/xamlpropertytriggers.php.
<table class=code cellpadding=5 align=center width=98% border=1 bordercolor=#3B3B3B><tr><td>
<DockPanel xmlns="http://schemas.microsoft.com/winfx/avalon/2005"
Background="#ffffffff"
xmlns:x="http://schemas.microsoft.com/winfx/xaml/2005">
<DockPanel.Resources>
<Style>
<Button Margin="5"/>
<Style.VisualTriggers>
<PropertyTrigger Property="Button.HasContent" Value="False" >
<Set PropertyPath="Visibility" Value="Collapsed" />
<Set PropertyPath="Margin" Value="0" />
</PropertyTrigger>
</Style.VisualTriggers>
</Style>
</DockPanel.Resources>
<Button Height="30" Width="100">Button One</Button>
<Button Height="30" Width="100">Button Two</Button>
<Button Height="30" Width="100">Button Three</Button>
<Button Height="30" Width="100" IsEnabled="False">Button Four</Button>
</DockPanel>
</td></tr></table>
Пример пользовательского интерфейса XAML, с динамически изменяемым оформлением
Источник: http://www.optim.ru/cs/2004/3/Avalon/Avalon.asp.
Пример пользовательского интерфейса XAML, с динамически изменяемым оформлением
Ссылка по теме:
* http://msdn.microsoft.com/library/default.asp?url=/library/en-us/dnintlong/html/longhornch03.asp
*
5 Язык насыщенных веб-приложений MXML
Macromedia традиционно выделяется на рынке поставщиков веб-технологий нетипичным подходом. Так скажем, ныне повсеместно используемый Flash столь разительно отличается от прочих технологий доставки информации, что его было бы как-то не ловко даже рассматривать в параллели с теми же языками разметки. Однако в эпоху XML и Macromedia не осталась в стороне от моды на декларативные языки. Ответ компании обозначился технологией Flex, содержащей XML-базированный язык MXML (Macromedia Flex Markup Language).
Как и рабочая группа Mozilla, и компания Microsoft, разработчики Flex стремились создать язык, эффективно сочетающий две популярных парадигмы: язык разметки и объектно-ориентированный программный язык. MXML позволяет наглядно описать структуру пользовательского интерфейса, по которой он будет воссоздан клиентским приложением. ActionScript выполняет задачи контроллера (программная реакция на события в среде) и обеспечивает уровень модели приложения.
Что стоило бы выделить среди преимуществ Flex
Flex помимо стандартных элементов форм ввода данных содержит столь актуальные компоненты пользовательского интерфейса как Tree component (структуризация данных), DataGrid component (управление большими массивами данных), различные навигационные компоненты (TabNavigator, ViewStack, Accordion, и прочее).
Как помнится, одно из основоположных свойств XML - возможно назначения собственных тегов. Flex эффективно наследует эту идею. Мы можем создать приложение, поместить его в отдельный файл с именем MyInnerApp.mxml после чего в приложениях Flex станет доступным тег <MyInnerApp />, ссылающийся на исходный код.
Flex располагает средствами для интеграции приложений. Мы можем воспользоваться протоколом SOAP и передать их Flex-приложения инструкции удаленному сервису, а затем принять от него данные. Это позволяет использовать при разработке приложений FLEX сервис ориентированную архитектуру (SOA).
Специфика интерфейсов от Macromedia в их интерактивности, мультимедийной насыщенности. Очевидно, что имеется богатая библиотека спецэффектов (библиотека событий), доступных элементам приложений Flex. Надо отметить, что и документация к технологии Flex выполнена в лучших традициях Macromedia. Особенно впечатляет интерактивный тур в технологию http://www.macromedia.com/software/flex/productinfo/brz_overview/.
На клиентской стороне приложения Flex устанавливаются на браузерах, располагающих расширением Flash Player 7. Данное обстоятельство обеспечивает приложениям Flex самую широкую поддержку на клиентских устройствах. С другой стороны необходимая серверная поддержка реализуется компонентом Flex Presentation Server, устанавливаемым на сервер приложений J2EE (Macromedia JRun, IBM Websphere, BEA WebLogic, Apache Tomcat и т.д.). Это тот самый механизм, который строит новое поколение насыщенных приложений (RIAs - Rich Internet Applications). Начальная цена Flex Presentation Server составляет 12 тыс. долл.
Пример одного из подходов к разделению слоев структуры интерфейса и программного контроллера в MXML приложении.
Источник: http://www.rewindlife.com/archives/000121.cfm)
<table class=code cellpadding=5 align=center width=98% border=1 bordercolor=#3B3B3B><tr><td>
<?xml version="1.0" ?>
<mx:Application xmlns:mx="http://www.macromedia.com/2003/mxml"
initialize="appController.initialize();">
<TempConverterController view="{this}" id="appController" />
<mx:Label text="Temperature in Farenheit:" />
<mx:TextInput id="farenheit" width="120" />
<mx:Button id="myButton" label="Convert" />
<mx:Label text="Temperature in Celsius:" />
<mx:Label id="celsius" width="120" fontSize="18" />
</mx:Application>
class TempConverterController {
[Inspectable]
public var view;
function initialize() {
view.myButton.addEventListener("click", this);
}
function click(event) {
view.celsius.text=(view.farenheit.text-32)/1.8;
}
}
</td></tr></table>
Пример электронного магазина.
Источник: http://www.macromedia.com/software/flex/productinfo/brz_overview/.
К началу статьи