Xamarin XAML Language tutorial XAML file structure and parsing XAML

Xamarin XAML Language tutorial XAML file structure and parsing XAMLXAML file structure

In the previous section, after we created the XAML file, we would see a structure like that shown in Figure 1.16

Figure 1.16 Structure

Where. xaml files and. xaml.cs files are the structure of XAML files. The following is a description of the two files.

• The. xaml file contains the XAML code, which is actually the XML syntax. The official saying: It is a language that declares objects and provides a convenient way for us to create objects. Similar to HTML, features are used to describe user interface (UI) content.
• Typically, the. xaml.cs file that we associate with the. xaml file is called a code-behind file. If the developer refers to any one of the events in XAML, such as the Click event of a button, the corresponding event-handling code is written in this file.

Parsing XAML

After we created the XAML file above, we see 3 kinds of code similar to the following.

(1) The first is the XAML code that creates a XAML file display after you create a project using Visual Studio:

• <?xml version= "1.0" encoding= "Utf-8"?>
• <contentpage xmlns= "Http://xamarin.com/schemas/2014/forms"
• xmlns:x= "Http://schemas.microsoft.com/winfx/2009/xaml"
• x:class= "Hello.xamlpage" >
• <label text= "{Binding MainText}" verticaloptions= "center" horizontaloptions= "center"/>
• </ContentPage>

(2) The second is the XAML code that is displayed by creating a XAML file after you create a project using Xamarin Studio:

• <?xml version= "1.0" encoding= "UTF-8"?>
• <contentpage xmlns= "Http://xamarin.com/schemas/2014/forms"
• xmlns:x= "Http://schemas.microsoft.com/winfx/2009/xaml"
• x:class= "Hello.mypage" >
• <ContentPage.Content>
• </ContentPage.Content>
• </ContentPage>

(3) The third way is to create the code that the XAML file displays while creating the project:

• <?xml version= "1.0" encoding= "Utf-8"?>
• <contentpage xmlns= "Http://xamarin.com/schemas/2014/forms"
• xmlns:x= "Http://schemas.microsoft.com/winfx/2009/xaml"
• Xmlns:local= "Clr-namespace:hello"
• x:class= "Hello.mainpage" >
• <label text= "Welcome to Xamarin forms!"
• Verticaloptions= "Center"
• horizontaloptions= "Center"/>
• </ContentPage>

The public part of these 3 file codes is as follows:

• <?xml version= "1.0" encoding= "Utf-8"?>
• <contentpage xmlns= "Http://xamarin.com/schemas/2014/forms"
• xmlns:x= "Http://schemas.microsoft.com/winfx/2009/xaml"
• x:class= "Hello.mainpage" >
• </ContentPage>

The following is a description of the XAML public default section.

1. The first line is a simple description of the XML, which contains the XML version number and the encoding format.
2. The function of the second line of code to the last line of code is what is needed to build the interface. Where the second and third lines refer to the URL using two XML namespace (xmlns) declarations. Developers don't need to know what these URLs point to. They're just the URLs that Xamarin and Microsoft have, and they basically act as version identifiers. The first XML namespace declaration means that a label without a prefix is defined in a XAML file that references a class in xamarin.forms, such as Contentpage. The second namespace declaration defines the prefix for x, which is used for several elements and attributes inherent in the XAML itself, and (theoretically) supported by all implementations of XAML.

Note: these elements and attributes are slightly different depending on the year that is embedded in the URL. Xamarin.Forms supports the XAML specification, but not all.

1. The four lines of code. After declaring the x prefix, the prefix is immediately used for attributes named class, because using this x prefix is very common in XAML files. For example, Class is abbreviated as x:class. X:CLASS specifies the. NET class name.

Note:The X:class property can only appear in the root element of a XAML file to define a derived C # class.

For the definition of the x:class specified class, developers can see in the. xaml.cs file that the code resembles the following code:

• Using System;
• Using System.Collections.Generic;
• Using System.Linq;
• Using System.Text;
• Using System.Threading.Tasks;
• Using Xamarin.Forms;
• Namespace Hello
• {
• public partial class Mainpage:contentpage
• {
• Public MainPage ()
• {
• InitializeComponent ();
• }
• }
• }

Note:the type indicated by the value of x:class must use the partial keyword when declaring. In this way, the parts defined in the classes and. xaml.cs files that are parsed by XAML are merged. It is because of this partial mechanism that we can leave the logic code of the class in the. xaml.cs file and implement it in the C # language, separating the code that is related to the declaration and layout UI elements and implementing a logical separation of the UI.

Xamarin XAML Language tutorial XAML file structure and parsing XAML