Extensible Application Markup Language

from Wikipedia, the free encyclopedia
Extensible Application Markup Language
File extension : .xaml
MIME type : application / xaml + xml
Developed by: Microsoft
Initial release: July 2009
Type: User Interface Markup Language
Extended by: XML
Website : microsoft.com


Extensible Application Markup Language ( XAML , pronounced [ ˈzæ: mɛl ]) is a description language developed by Microsoft for the design of graphical user interfaces and for the definition of workflows in the Windows Workflow Foundation (WF). First, the new declarative language for the .NET 3.0 and .NET 3.5 frameworks in Windows Presentation Foundation (WPF) was developed for WPF Windows applications. XAML is used in WPF because workflows can in turn be defined there with XAML. XAML is used in Silverlight applications and Windows 8 in on the Windows Runtime -based Windows Store - Apps building the graphical user interface.

Overview

XAML is an XML -based language that is used to define graphic elements, user interfaces, behaviors, animations, transformations, display of color gradients, playback of media files and much more. XAML was introduced by Microsoft as the markup language to be used in the Windows Presentation Foundation, a desktop-oriented technology. WPF provides the use of rotations, animations and a number of other effects and functionalities for 2D and 3D objects that are rendered by XAML. XAML elements can directly map common language runtime object instances (CLR), whereas attributes can map CLR properties and events to these objects. In common usage, XAML files are generated by optically oriented design and developer tools such as Microsoft Expression Blend , Microsoft Visual Studio , XAML Pad, or the Windows Workflow Foundation Visual Designer.

Although XAML was introduced as an essential part of the WPF , the XAML standard itself is not specifically linked to the WPF or .NET. XAML can be using any other programming interface (English application programming interface , API) applications, in which XAML represents an independent language. The main aspect of this technology is the reduced complexity that programs must have to process XAML because it is essentially simple XML. Since XAML is based on XML, developers and designers can exchange and edit content together, since the code is only compiled at runtime. As with XML, XAML differentiates between upper and lower case.

Designer-developer workflow

In application development, XAML is, so to speak, the common language between designer and developer. The graphic artist designs the user interface with the designer tools and generates XAML code. The developer takes this XAML code and develops the program logic for it in his language of choice. XAML objects created by the designer are provided with program logic functionality by the developer. Both designers and developers can work on the same project practically at the same time and no longer have to communicate with each other via detours.

In Silverlight and WPF applications, this collaboration between designer and developer can be used. a. the use of two different file types for user interface and program logic : the XAML file ( file extension .xaml), which contains the stored graphical XAML descriptions, and a code-behind file linked to this file, which contains the program logic for the declarative XAML Contains objects. In .NET the code-behind files are provided with the appropriate file extensions depending on the language selected: In C # and Visual Basic these are the extensions .xaml.cs or .xaml.vb, in JavaScript the file extension is .xaml.js.

XAML in Silverlight

In web applications, XAML is mainly used in the form of Silverlight. Microsoft Silverlight is a modified, reduced-scope subset of WPF. During development, it was called WPF / E, which stood for Windows Presentation Foundation Everywhere. Microsoft Silverlight enables WPF applications to be made available online as Rich Internet Applications with the same or minimally changed program code, without the entire .NET Framework having to be installed on the client computer. 3D functions are currently not supported, but XPS , vector-based graphics and hardware acceleration , as a result, rendering of rich user interfaces for websites is possible.

A variety of media can now be seamlessly integrated into the new interfaces, including audio, video and 2D graphics. Important graphical aspects of the XAML description are:

  • Automatic layout
  • 2D shape elements (rectangle, ellipse, etc.)
  • Color gradients with GradientBrushes
  • Transformations (scaling, rotating, shearing, matrices)
  • Animations (DoubleAnimation, ColorAnimation, PointAnimation)
  • Play media files

XAML in Windows Runtime

Starting with Windows 8, XAML will be used alongside WPF for Windows Store apps that run under the new Windows Runtime. XAML in Windows Runtime, like Microsoft Silverlight, is a modified and adapted subset of the Windows Presentation Foundation. The main difference to the previous implementations, however, is that this is a completely new interface based on native code and COM, which can be used directly via so-called projections for several programming languages, including C ++, C # and Visual Basic. The advantage over WPF and Silverlight, both of which are based on the common language runtime, is an increased execution speed, as there is no translation into the native machine code of the processor at runtime (just-in-time compilation).

Windows Store apps are currently always running as full-screen applications and the predefined appearance of the controls has been optimized for touch operation, which is reflected in elements that are larger and easier to operate with the fingers by default.

Structure & features

structure

XAML files are structured hierarchically.

One or more elements, depending on their order, can influence the layout and behavior of the surface. Each element has only one parent element (English parent ). Each element can have an unlimited number of child elements (English children ), the number is only limited for a few, e.g. B. does Scrollbarnot have a single child. In all XAML applications, the root object is typically one Panel(or one of its six subspecies) that takes care of positioning and rendering any content. One Panelcan in turn contain several other panels.

Properties and settings e.g. B. a button are listed as attributes in the tag as with XML or HTML . Like every XML file, XAML has a root tag. With XAML you take a parent object (e.g. a ) into which you can insert further children ( i.e. elements). For the parent object, the root tag must have corresponding attributes and that provide the parser with information about the namespaces to be used. <Window>xmlnsxmlns:x

XAML namespaces

Silverlight

If you use an element in a Silverlight application as <UserControl>in XAML, the Silverlight parser recognizes that you want to create an instance of the UserControl class . But it does not necessarily recognize which UserControl class to use. So you have to find a way to provide Silverlight namespace information in order to use an element. 

<UserControl x:Class="SilverlightApplication1.Page"
 xmlns="http://schemas.microsoft.com/client/2007"
 xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
 <Grid x:Name="LayoutRoot" Background="White">

 </Grid>
</UserControl>
  • http://schemas.microsoft.com/client/2007 is the core of the Silverlight 2 namespace. It encompasses all of the Silverlight 2 classes, including UserControl and Grid. Usually the namespace is declared without a prefix, so it becomes the default namespace for the entire document. This means that every element is automatically placed in this namespace until it is specified otherwise.
  • http://schemas.microsoft.com/winfx/2006/xaml is the XAML namespace. It includes various XAML features that allow you to influence how the document is interpreted. This namespace is bound to the X prefix . This means you can assert it by writing the namespace prefix in front of the element name (e.g. < x: ElementName>).

Windows Presentation Foundation

In this case one does not use the namespace xmlns = http: //schemas.microsoft.com/client/2007 , since no Silverlight application is created, but only refers to the Presentation Core of the Windows Presentation Foundation, xmlns = http: / /schemas.microsoft.com/winfx/2006/xaml/presentation . 

<Window x:Class="WpfApplication1.Window1"
 xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
 xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
 Title="Window1" Height="300" Width="300">
 <Grid>

 </Grid>
</Window>

Windows runtime

The namespaces used for Windows Store apps under Windows 8 correspond to those of the Windows Presentation Foundation, with the difference that Pageinstead of is Windowused as the standard element for user interfaces and this relates to the implementation in Windows Runtime (Windows.UI.Xaml). Height and width specifications are also omitted, as Windows Store apps are always run as full-screen applications. 

<Page x:Class="HelloWorld.BlankPage"
 xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
 xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
 <Grid>

 </Grid>
</Page>

Linking GUI and code

To z. B. to link buttons with a method is now written z. B. in Visual Basic or C # so called partial classes . They share the same namespace. The compiler then creates the necessary links. If you - contrary to the clear recommendation to separate user interface and code - want to include code in the XAML document, you can do this: <x:Code>Introduce the appropriate area. So that the parser does not interpret the corresponding lines, it must be included in <![CDATA[...]]>(example from msdn): 

<Canvas xmlns...>
 <Button Name="button1" Click="Clicked">Click Me!</Button>
 <x:Code><![CDATA[
    void Clicked(object sender, RoutedEventArgs e)
 {
 button1.Content = "Hello World";
 }
 ]]></x:Code>
</Canvas>

Styles and templates

In XAML it is possible to easily adapt the interface to individual needs. This starts with the properties of UI elements, which can be easily changed with styles, and goes on to complete control over the appearance and behavior of a UI element through the templates.

Example: Style

Within a XAML document you define your own style sheet for a button: 

<Style def:Name="MyStyle">
 <Button Background="Red" FontSize="24"/>
</Style>

When creating a new button you only have to refer to your self-created stylesheet: 

<Button Style="{MyStyle}">Styled</Button>

Example: template

You define your own control template for a button within a XAML document: 

<ControlTemplate x:Key="MyButtonTemplate"
 TargetType="{x:Type Button}">

 <Border BorderBrush="{TemplateBinding BorderBrush}"
 BorderThickness="{TemplateBinding BorderThickness}"
 Background="{TemplateBinding Background}">

 <!-- Der ContentPresenter zeigt den Inhalt an, welcher über TemplateBinding abgerufen wird -->
 <ContentPresenter
 Content="{TemplateBinding Content}"
 ContentTemplate="{TemplateBinding ContentTemplate}"
 Margin="{TemplateBinding Padding}"
 HorizontalAlignment="{TemplateBinding
 HorizontalContentAlignment}"
 VerticalAlignment="{TemplateBinding
 VerticalContentAlignment}" />

 </Border>

Transformations and Animations

XAML supports transformations as they are already known from Flash or SVG . With the animations it looks a little different. The XAML syntax does not inherently support extensive animation . In order to still do this, you have to use the Mappingand xmlnsconstructs to load your own namespace specifically for Windows Vista : 

<?Mapping XmlNamespace="animC" ClrNamespace="MSAvalon.Windows.Media.Animation" Assembly="PresentationCore" ?>
<?Mapping XmlNamespace="animF" ClrNamespace="MSAvalon.Windows.Media.Animation" Assembly="PresentationFramework" ?>

Document Services

XAML offers several features that make it easier to view, navigate, and paginate documents. Several control bars are available for this purpose, which can be activated if required. This includes a page number display, forward and back button, etc. that the PageVieweroffers.

In addition, with the Document Layout Service, texts can be provided with simple tags in order to install an appropriate and easy-to-read layout on every screen at any time .

Compare with other XML-based (programming) languages

The language LZX ( OpenLaszlo ) works in a similar way to the declarative concept of XAML and the union of XML-coded objects . Here the methods and properties, as well as the event handling, are integrated even more consistently into the tag structure. While in XAML the .NET compiler links user interfaces with the methods or event handling, in OpenLaszlo JavaScript is used as the script language and an executable Adobe Flash file (or optionally DHTML) is generated.

Code example (compare above): 

<canvas debug="true">
 <button name="button1" text="Click me !">
 <handler name="onclick">
         parent.button1.setAttribute("text","Hello, World !"); // JavaScript-Code
 </handler>
 </button>
</canvas>

See also

literature

Web links

Instructions

swell

  1. ↑ a b www.codeproject.com . Retrieved March 15, 2009.
  2. ↑ a b c M. Werner and B. Rieger: Developing interactive web applications with Silverlight 2. 2008, ISBN 978-3-8158-3009-3 .
  3. ^ Matthew MacDonald: Pro Silverlight in C # 2008 . 2008 ISBN 978-1-59059-949-5
  4. ↑ CDATA sections . Microsoft. Archived from the original on April 3, 2015. Retrieved April 2, 2019.