[Wp8.1ui Control Programming] Compilation of Windows Phone XAML pages

1.1.2 Compilation of XAML pages

The Windows Phone Application project compiles XAML pages through Visual Studio, and when the program is run, it loads and parses the XAML through a direct link operation, connecting XAML and procedural code automatically. If you don't care about fusing XAML files with procedural code, you just need to add it to the Windows Phone project of Visual Studio and compile it with the build action in the interface, which is common to XAML files for public style resources. However, if you want to compile a XAML file and mix it with procedural code, the first step is to specify a subclass for the root element of the XAML file, which can be done with the class keyword in the XAML language namespace, which is typically used by Windows Phone's program pages. Typically a new XAML file in a Windows Phone project automatically generates a corresponding XAML.CS file and associates two files by default, for example, adding a XAML file as follows:

    < Page         x:class = "Phoneapp1.mainpage"         ... >         ... Omit several codes     </  Page>

The XAML.CS file associated with the XAML file is as follows:

namespace phoneapp1{    publicsealedpartialclass  mainpage:page    {    ... Omit several codes    }}

Typically we are XAML.CS files associated with XAML files called code-behind files. If you refer to any one of the event handlers in XAML (through the event attributes, such as the click attribute of the button), this is where we define these event handlers. The partial keyword in a class definition is important because the implementation of the class is distributed across multiple files. Perhaps you will find it strange, because in the project only see the MainPage.xaml.cs file defines the MainPage class, in fact, MainPage class is also defined in another place, just hidden in the project. When we compile the Windows Phone project, you will see a file in the project's Obj\debug folder with the G.cs extension created by Visual Studio, and for each XAML file you will find a G.cs file. For example, if we have a MainPage.xaml file in our project, you will find the Mainpage.g.cs file under the Obj\debug folder. Here's a look at the structure of the Mainpage.g.cs file:

usingSystem, ... ..namespacePhoneApp1 { Public Partial classMainPage:Global:: Windows.UI.Xaml.Controls.Page {[Global:: System.CodeDom.Compiler.GeneratedCodeAttribute ("Microsoft.Windows.UI.Xaml.Build.Tasks","4.0.0.0")]        (Global:: Windows.UI.Xaml.Controls.Grid LayoutRoot; ...Private BOOL_contentloaded; [System.Diagnostics.DebuggerNonUserCodeAttribute ()] Public voidInitializeComponent () {if(_contentloaded) {return; } _contentloaded=true; Global:: Windows.UI.Xaml.Application.LoadComponent ( This,New Global:: System.Uri ("Ms-appx:///mainpage.xaml"),Global:: Windows.UI.Xaml.Controls.Primitives.ComponentResourceLocation.Application); LayoutRoot= (Global:: Windows.UI.Xaml.Controls. Grid) This. FindName ("LayoutRoot");    ...... } }}

As we can see from the Mainpage.g.cs file, the MainPage class also defines some controls and related methods here, and InitializeComponent () The InitializeComponent () method inside the MainPage.xaml file is loaded and parsed inside the MainPage.cs file, which is defined in the Mainpage.g.cs file. Controls that are declared in a XAML page typically generate internal fields for the corresponding control in. G.cs. In fact, this depends on whether the control has a x:name property, and as long as it has this property, it automatically calls the FindName method, which associates the field with the page control. Without the x:name attribute, there is no field, and this association has some performance waste because it is associated with the Loadcomponents method when the control is loaded, and XAML is dynamically parsed at this time.

In the project's Obj\debug folder, we also found files with G.i.cs extension, and for each XAML file you will find a G.i.cs file for each, and these g.i.cs files are basically the same as the corresponding G.cs files. So what is the meaning of these g.i.cs files? In fact, these g.i.cs files are not generated at compile time, but when you create a XAML file is generated immediately, or you modify the XAML file G.i.cs file will be changed, and G.cs file is necessary to successfully compile the project will not be generated. The g in the file suffix indicates the meaning of the generated, I means IntelliSense, and the G.i.cs file is the IntelliSense file corresponding to the XAML file, using go to in VS Definition function to find the implementation of the InitializeComponent method, entered is the G.i.cs file InitializeComponent method inside.

1.1.3 Dynamically loading XAML

Dynamic load XAML is the effect of dynamically generating a UI by parsing a string or file in XAML format while the program is running. Typically, the interface elements of a Windows phone are rendered by directly reading the contents of a XAML file. As explained in the previous section, the compiler is associated with a XAML file and a XAML.CS file, which is the default UI implementation, but at some point you do not have to design all the XAML elements in advance, but you need to dynamically load the XAML objects while the program is running, then you need to use the dynamic load XAML to It is now.

The dynamic loading of XAML in the application needs to be implemented using the Xamlreader.load method, which provides a XAML processor engine for parsing XAML and creating the appropriate Windows Phone object Tree xamlreader.load method to parse a well-formed XAML fragment and create the appropriate Windows phone object tree, and then return the root of the object tree. Most of the code that can be written on a XAML page is implemented in the form of dynamically loaded XAML, not just normal UI controls, but other XAML code like animations that we can load dynamically, such as:

        //a string of XAML code that changes the animation of a transparency        Private Const stringFadeinstoryboard =@"<storyboard xmlns= "" Http://schemas.microsoft.com/winfx/2006/xaml/presentation "" > <doubleanimation duration= "" 0:0:0.2 "" storyboard.targetproperty= "" (uielement.opacity) "" to= "1" "/> </Storyboard>"; //use the Xamlreader.load method to load a XAML string and parse it into an animated objectStoryboard Storyboard = xamlreader.load (Fadeinstoryboard) asStoryboard;

There are certain requirements for dynamically loading XAML strings for XAML using the Xamlreader.load method, and these "well-formed XAML fragments" must meet the following requirements:

(1) A XAML content string must define a single root element, and content created with Xamlreader.load can only be assigned to a Windows Phone object, which is a one-to-two relationship.

(2) The content string XAML must be well-formed XML and must be parsed XAML.

(3) The required root element must also specify a default XML namespace value. This is usually the namespace xmlns= "Http://schemas.microsoft.com/winfx/2006/xaml/presentation".

The following is an example of a dynamically loaded XAML: A rectangle is generated by using the Xamlreader.load method to load a XAML string to generate a button and load a XAML file.
Code Listing 1-1 : dynamically loading XAML (source code: Chapter 1th \examples_1_1)

MainPage.xaml file Main code-------------------------------------------------------------------------------------------------- ----------------        <Gridx:name= "Contentpanel"Grid.Row= "1"Margin= "12,0,12,0">            <StackPanelx:name= "Sp_show">                <Buttonx:name= "Bt_addxaml"Content= "Load XAML button"Click= "Bt_addxaml_click"></Button>            </StackPanel>        </Grid>

Rectangle.xaml File code: A XAML file that is dynamically loaded into the program-------------------------------------------------------------------------------- ----------------------------------<Rectanglexmlns= "Http://schemas.microsoft.com/winfx/2006/xaml/presentation"xmlns:x= "Http://schemas.microsoft.com/winfx/2006/xaml"Height= "$"Width= "480">    <Rectangle.fill>        <LinearGradientBrush>            <GradientStopColor= "Black"Offset= "0"/>            <GradientStopColor= "Red"Offset= "0.5"/>            <GradientStopColor= "Black"Offset= "1"/>        </LinearGradientBrush>    </Rectangle.fill></Rectangle>

MainPage.xaml.cs file Main code--------------------------------------------------------------------------------------------------------------- ---//Load XAML Button        Private voidBt_addxaml_click (Objectsender, RoutedEventArgs e) {            //note the namespace inside the XAML string "http://schemas.microsoft.com/winfx/2006/xaml/presentation"no less."             stringButtonxaml ="<button xmlns= ' http://schemas.microsoft.com/winfx/2006/xaml/presentation '"+"content=\ "load XAML file \" foreground=\ "red\" ></Button>"; Button btnred=(Button) xamlreader.load (BUTTONXAML); Btnred.click+=Btnred_click; Sp_show.        Children.add (btnred); }        //events associated with the loaded XAML button        Async voidBtnred_click (Objectsender, RoutedEventArgs e) {            stringXAML =string.            Empty; //Rectangle.xaml file for loaderStorageFile FileRead =awaitWindows.ApplicationModel.Package.Current.InstalledLocation.GetFileAsync ("Rectangle.xaml"); //read the contents of a fileXAML =awaitFileio.readtextasync (FileRead); //Load RectangleRectangle Rectangle =(Rectangle) Xamlreader.load (XAML); Sp_show.        Children.add (Rectangle); }

This article comes from the deep understanding of Windows Phone 8.1 UI Control programming

Source code Download: Http://vdisk.weibo.com/s/zt_pyrfNHoezI

Welcome to follow my Weibo @wp forestry administration

WP8.1 Technology Group: 372552293