Definition of an xaml file
Learn .NET MAUI creating projects
Learn how to create cross-platform applications, thanks to the power of .NET MAUI and a series of real projects.
In this section we will give a brief introduction to the XAML markup language, which is the type of file format that will be used to create graphical interfaces in .NET MAUI applications.
In previous lessons, we have created a .NET MAUI application, which has created a set of files that are part of the project:
In the file listing, we can see files that end with the .xaml extension, such as App.xaml, AppShell.xaml and MainPage.xaml.
One thing that is important to know is that each of these XAML files contains an associated C# file, which is known as code behind. For example, if we expand the MainPage.xaml page node, we will see a file called MainPage.xaml.cs, which contains C# code associated with the XAML file:
We can see the same with each xaml file.
Now, there is a fundamental difference with the file named App.xaml with respect to the other files. If we proceed to open it, we can see that the main tag of the file is an Application tag:
This App file is very important, because the code behind specifies which is the home page of the application:
Unlike the App.xaml page, the MainPage.xaml page has a tag called ContentPage at the beginning:
The AppShell.xaml file, on the other hand, has the Shell tag:
For the moment, don't worry about this terminology, in a later lesson of the course you will learn more about each of these elements.
For the moment, let's focus on the MainPage.xaml file to see some features of the XAML language. First of all, in this file and in practically all XAML files, you are going to find a couple of lines, which look like this:
xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
These lines are called namespaces. When you see something similar in an xaml file, remember that it is a namespace.
Although it may look like a URL pointing to a site on the Internet, the truth is that these are not URLs that you can browse to find information, but rather they are version identifiers that contain information for use in XAML pages.
The first tag, which contains the isolated name xmlns, refers to the classes of the .NET MAUI framework. If we proceed, for example, to delete the line from the file, look what happens:
We see different errors marked in the controls that are part of the .NET MAUI framework, as their definition is found. Therefore, it is very important that you do not delete this namespace.
The second namespace is defined by a prefix. The prefix has the following form:
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
A prefix, which is composed of the term xmlns: followed by a name that can be any term you like, is used to declare namespaces that are not defined by default, in this particular case, it refers to XAML elements.
If we remove this line, we will see another type of errors:
This is happening, because the declaration of the prefix named x is not found, so we must leave again this prefix created by default.
A prefix is used to access a namespace, which in turn contains different classes that we can use in the xaml file. For example, the prefix x allows us to specify the code behind class that will be used to work together with the XAML file.
In the case of the example, we specify the full name of the code behind file, which contains the main namespace (which is usually the name of the project), plus the name of the class, although if the file were inside other folders, the namespace would be much longer:
x:Class="MauiApp4.MainPage"
Another element of this prefix that is widely used is the x:Name element, which allows us to add an identifier to a control so that we can use it from the code behind: