XAML

Extensible Application Markup Language
	Extensible Application Markup Language
Информация
Вид	application/xaml+xml
Файлово разширение	.xaml
Разработчик	Microsoft
Последна версия	v2009/; 16 април 2010

XAML (чете се „замъл“) (от английски: Extensible Application Markup Language) e декларативен маркъп език използван за иницализиране на структурирани стойности и обекти. Базиран е на XML, създаден от Microsoft с цел опростяване на създаването на потребителски интерфейс (UI) за .NET приложения.

Езикът е представен през 2006 г. заедно с WPF (Windows Presentation Foundation) в .NET 3.0. WPF е графична подсистема за рендериране на потребителски интерфейс в Windows-базирани приложения, която ползва XAML. Впоследствие през 2007 г. е представен Silverlight, който е фреймуърк изпълняващ функции, много близки до тези на Adobe Flash. През 2011 г. е представен и Windows Runtime XAML Framework, който върши същото за програми в новия „Metro“ стил.

Основните предимства на XAML са че разделя UI от бизнес логиката и че позволява едновременно да са работи върху логиката и интерфейса на една програма с различни инструменти (Visual Studio и Microsoft Expression Blend).

Елементите на XAML са директно свързани със CLR обекти, а атрибутите – с CLR свойства и събития върху тези обекти. XAML файловете могат да бъдат редактирани с инструменти за визуален дизайн като Microsoft Expression Blend и Microsoft Visual Studio, както и със стандартни текстови редактори, кодови редактори като XAMLPad или графични редактори като Vector Architect.

Всички графични елементи в XAML са Direct3D апликации (използват видео картата за рендериране), което води до висококачествен и разнообразен потребителски интерфейс. Освен това графиките са вектор-базирани, което позволява оразмеряване на обектите без загуби в качеството им. XAML поддържа множество от функции, като анимации с таймери или свързани с действия на потребителя, видео и аудио във всички формати в които операционната система поддържа, както и връзки между тези функции. XAML имплементира логическа пикселна система използваща за стойности floating-point (числа с плаваща запетая), както и поддържа 32 битови RGBA цветове.

Всичко създадено или имплементирано с XAML може да бъде направено и с по-традиционен .NET език като C# или Visual Basic.NET. Понеже е базиран на XML, обаче, XAML е по-прост, а и девелъпъри и дизайнери могат да споделят и редактират съдържанието на един проект свободно помежду си без да е нужна компилация.

Синтаксис

Синтаксисът на XAML реално е чист XML и силно наподобява HTML – идеята му е да се правят потребителски интерфейси за различни програми.

Накратко XAML се състои от Елементи (Button, Template, Grid) и Свойства(нещата които различават елементите, характеристики – Width, Height), като Елементите могат да притежават Свойства.

Всеки XAML файл има точно един елемент, който е неговия „корен“ – той обявява обекта, който ще бъде концепцуалния корен на някаква софтуерна структура (например страница или обектния граф на цялата рънтайм дефиниция на приложението). (Window или UserControl в зависимост дали ползваме WPF или Silverlight)

Елемент се обявява с отварящ и затварящ таг, точно както в HTML (<отв таг></затварящ таг><таг />), а вътре в тага се слагат свойствата (размери, местоположение, цвят и т.н.), които получават стойности чрез равно и стойност в кавички (<отварящТаг свойство1="стойност1" свойство2="стойност2">). Между отварящия и затварящия таг на елемента могат да се намират други елементи. Пример:

<Canvas Background="White" Height="680"> – отварящ таг
  <Rectangle Canvas.Left="0" Canvas.Top="0" Fill="Red"
    Width="100" Height="100" Canvas.ZIndex="3" /> – обявяване на елемент в един таг
  <Rectangle Canvas.Left="20" Canvas.Top="20"
    Fill="Orange" Width="100" Height="100"
    Canvas.ZIndex="2" /> – обявяване на елемент в един таг
  <Canvas Canvas.Left="300" Canvas.Top="300"
    Canvas.ZIndex="1"> – отварящ таг
    <Rectangle Width="120" Height="330" RadiusX="20"
      RadiusY="20" Fill="Black"/> – обявяване на елемент в един таг
    <Ellipse Canvas.Left="10" Canvas.Top="10"
      Width="100" Height="100" Fill="Red"/> – обявяване на елемент в един таг
  </Canvas> – затварящ таг
</Canvas> – затварящ таг

Основни Елементи

Панели

Панелите се използват за оформяне на лейаут на интерфейса. В тях се поставят другите елементи и целта на панела е да се декларира местоположението на тези елементи.

Canvas – Рамка. Всички дъщерни елементи се позиционират с координати спрямо нея, подадени от програмиста
StackPanel – Дъщерните елементи се редят в хоризонтален или вертикален ред.
Grid – Решетка. Всички дъщерни елементи се позиционират като в таблица с колони и редове.

Други

Button – обявява бутон, копче.
Window, UserControl – основния елемент, в който се намират всички останали елементи на съответния интерфейс
TextBlock – елемент, в който се поставя текст, който може само да се чете от потребителя.
TextBox – Много подобен на TextBlock елемент, в който се поставя текст, който може да бъде редактиран и избран от потребителя. И в двата текстови елемента текстът може да се поставя по два начина

<TextBlock>ТЕКСТ</TextBlock>

<TextBlock Text="ТЕКСТ" />

Основни Свойства

Content – съдържанието на елемента, например – текста върху определен бутон
Height – определя височината на обекта (елемента)
Width – определа широчината на обекта (елемента)

Свойства-елементи

За някои свойства, синтаксиса за нормалните свойства не върши работа, защото обектът или информацията, нужна да се даде стойност на свойството, не може да се представи адекватно заради ограниченията представени от кавичките и низа. В такива случаи се използва друг синтаксис, в който свойството се представя като елемент със стартов таг <имеНаТип.имеНаСвойство>.

<Button>
  <Button.Background>
    <SolidColorBrush Color="Blue"/>
  </Button.Background>
  <Button.Foreground>
    <SolidColorBrush Color="Red"/>
  </Button.Foreground>
  <Button.Content>
    Това е бутон
  </Button.Content>
</Button>

Този код обявява бутон с текст „Това е бутон“, син цвят на фона и червен цвят на съдържанието.

Ресурси

Стилове

Чрез стилове могат да се променят началните стойности на свойствата на елемента, към който стилът е приложен. Могат да се дефинират и тригери. Стиловете предлагат доза удобство – пишат се веднъж в кода, след което биват повиквани чрез името си. Също така могат да се дефинират в отделни файлове (предпочитания вариант).

 <Setter Property="Background">
   <Setter.Value>
     <LinearGradientBrush>
       <GradientStop Offset="0.0" Color="AliceBlue"/>
       <GradientStop Offset="1.0" Color="Salmon"/>
     </LinearGradientBrush>
   </Setter.Value>
 </Setter>
 <Setter Property="FontSize" Value="18"/>

</Style> </style> Този стил оцветява фона на бутон по специфичен начин (два преливащи един в друг цвята)

Стиловете силно напомнят CSS (Cascading Style Sheets).

Темплейти

Темплейтите са подобни на стиловете. Разликата е, че темплейтът може да променя освен свойствата на елементите, самите елементи – може да ги трие, да добавя нови, да ги пренарежда и т.н.

Тригери

В XAML определени функции могат да се задействат при определени събития чрез тригер-и (от английското trigger – спусък). Тригерите могат да са три типа:

Тригери от свойства (Property Triggers) – задействат се, когато някое свойство има определена стойност
Тригери от събития (Event Triggers) – задействат се, при определени събития
Тригери от данни (Data Triggers) – задействат се, когато определена променлива достигне специфична стойност

<Style x:Key="styleWithTrigger" TargetType="Rectangle">
    <Setter Property="Fill" Value="LightGreen" />
    <Style.Triggers>
        <Trigger Property="IsMouseOver" Value="True">
            <Setter Property="Fill" Value="Red" />
        </Trigger>
    </Style.Triggers>
</Style>

<Rectangle Style="{StaticResource styleWithTrigger}"></Rectangle>

Този код поставя светлозелен квадрат, който става червен, когато потребителя премести мишката върху квадрата.

С изключение на евент тригерите, тригери могат да се ползват само в стилове и темплейти. Лесен начин да се справим в този проблем е да сложим целия код в ето такава рамка:

<Control>
    <Control.Template>
        <ControlTemplate>
            
        </ControlTemplate>
    </Control.Template>
</Control>

Пример

Този пример показва текст „Hello World!“.

<Canvas xmlns="http://schemas.microsoft.com/client/2007"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
  <TextBlock>Hello World!</TextBlock>
</Canvas>

Примерът (xmlns="http://schemas.microsoft.com...") може да трябва да се промени за да работи на вашия компютър.

Версии

Има четири имплементации на XAML:

The Windows Presentation Foundation версия, която се използва в .NET Framework
The Silverlight 3 версия
The Silverlight 4 версия
The Windows 8 XAML/Jupiter версия

XAML файловете, които се приемат от Silverlight 3 може да не се приемат от по-новата версия.

Източници

msdn.microsoft.com
msdn.microsoft.com
telerikacademy.com Архив на оригинала от 2013-09-05 в Wayback Machine.
docs.idvsolutions.com
wpftutorial.net Архив на оригинала от 2013-09-04 в Wayback Machine.
msdn.microsoft.com
msdn.microsoft.com

Вижте също

XML