WPF01 (XAML)

XAML: (Go from http://www.cnblogs.com/huangxincheng/archive/2012/06/17/2552511.html)

<window x:class= "Wpfapplication1.mainwindow"        xmlns= "http://schemas.microsoft.com/winfx/2006/xaml/ Presentation "        xmlns:x=" Http://schemas.microsoft.com/winfx/2006/xaml "        title=" MainWindow "height=" 350 " Width= "525" >    <Grid>            </Grid></Window>

And then we'll compare the page default build pages in WebForm

1 <%@ page language= "C #" autoeventwireup= "true" codebehind= "WebForm1.aspx.cs" inherits= "Webapplication1.webform1" %> 2  3 <! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd "> 4 
We find that XAML is much like an XML structure, and yes, it is an interface description language that follows the XML specification.
One: XAML Brief
First I default everyone is familiar with the WebForm developers.
1:x:class
Does this tag have a corresponding tag in the WebForm? Yes, that's the codebehind here.
<%@ page language= "C #" autoeventwireup= "true" codebehind= "WebForm1.aspx.cs" inherits= "Webapplication1.webform1"% >
2:xmlns
Does this have a corresponding mark in the WebForm? First of all, we need to know what xmlns is doing? Oh, import namespaces, then we immediately think of the corresponding tag import in WebForm.
<%@ Import namespace= "System.IO"%>
So the next question is, what's the difference between the two? We know that importing namespaces in WebForm requires one import, 4 namespaces will write 4 imports, and XAML can do more
namespaces as an import.
Xmlns= "Http://schemas.microsoft.com/winfx/2006/xaml/presentation"
In fact, the following 4 WPF development-prerequisite DLLs are imported, which is also the default namespace in XAML.
3:xmlns:x
If we need to import some custom namespaces, then we need to add a ": + custom name " form, where Microsoft imported a custom namespace.
xmlns:x= "Http://schemas.microsoft.com/winfx/2006/xaml"
Here we will also import a namespace, in the actual development of course we do not make the form of URLs, here I named the SYS prefix
<window x:class= "Wpfapplication1.mainwindow"        xmlns= "http://schemas.microsoft.com/winfx/2006/xaml/ Presentation "        xmlns:x=" Http://schemas.microsoft.com/winfx/2006/xaml "        xmlns:sys=" Clr-namespace: System.io;assembly=mscorlib "        title=" MainWindow "height=", width= "525" >    <Grid>       </ Grid></window>
4:grid
We all know that in the HTML page layout of n years ago in the form of table, table nested table,table across rows and other means to build a beautiful web page, this layout idea is also applied to WPF.
<1>: Dividing position
We draw a two-line two-column interface layout, where we just put "mouse" in the "red box", there will be a small triangle, we can click to create a split line, red Small circle marked "Row"
The partition ratio column.
Then let's take a look at the generated code
<window x:class= "Wpfapplication1.mainwindow"        xmlns= "http://schemas.microsoft.com/winfx/2006/xaml/ Presentation "        xmlns:x=" Http://schemas.microsoft.com/winfx/2006/xaml "        xmlns:sys=" Clr-namespace: System.io;assembly=mscorlib "        title=" MainWindow "height=" width= "525" >    <Grid>        < grid.rowdefinitions>            <rowdefinition height= "161*"/>            <rowdefinition height= "150*"/>        </Grid.RowDefinitions>        <Grid.ColumnDefinitions>            <columndefinition width= "225*"/>            <columndefinition width= "278*"/>        </Grid.ColumnDefinitions>    </Grid></ Window>
We wonder why the width has a "*" number, here to explain the "wide-height" setting in WPF has three forms.
①: Absolute size <rowdefinition height= "161"/>
②: Auto size <rowdefinition height= "Auto"/>
③: Proportional size <rowdefinition height= "161*"/>
Then we have a question, in the end 161* is how much? The calculation rules are as follows:
Our form here is height=350.
The first line height is: 350/(161+150) *161
The second row height is: 350 (161+150) *150
<2>: UI element layout
①:ui elements
Very simply, we just set the button's Grid property to which cell the button should be placed.
②:ui elements span columns across rows
Two: Extended markup in XAML
There are two types of extension tags: WPF level and XAML level.
<1> WPF Level Extension markup
①: StaticResource
To get the value of the resource, the value gets done when the XAML compiles, what does that mean? Let me give you an example.
First, we find that there is a window. Resources, this thing we can think of as a global variable defined in the MainWindow class, here I define a name= "first-tier farm"
Variable, the way TextBlock gets the variable can be passed through StaticResource.
②:dynamicresource
The only difference with StaticResource is that it is acquired at runtime, and if you know the dynamic keyword inside C #, I don't want to explain the code.
③:binding
Or in the WebForm to find the key word, equivalent to WebForm in the eval, on the code to speak.
1 <window x:class= "Wpfapplication1.mainwindow" 2         xmlns= "http://schemas.microsoft.com/winfx/2006/xaml/ Presentation "3         xmlns:x=" Http://schemas.microsoft.com/winfx/2006/xaml "4         xmlns:sys=" Clr-namespace:system ; Assembly=mscorlib "5         title=" MainWindow "height=" "" Width= "525" > 6     <Grid> 7         <textbox height= "margin=" 87,75,0,0 "name=" TextBox1 "width=" "/>  8         <textbox height=" "margin=" 87,126,0,0 "Name=" TextBox2 "  width="  9                  text= "{Binding elementname=textbox1, path=text}"/>10     </grid>11 </Window>
Here I put textbox2 text bound to the text of textbox1, the final effect is I input on the textbox1, TextBox2 will change accordingly, very interesting.
④:templatebinding
This is called the template binding, you can bind the properties of the object and the template properties, detailed introduction in the next article.
<2>xaml Level extension Tags
①x:type
The type is specified when you assign a template or style to an object.
1 <window x:class= "Wpfapplication1.mainwindow" 2         xmlns= "http://schemas.microsoft.com/winfx/2006/xaml/ Presentation "3         xmlns:x=" Http://schemas.microsoft.com/winfx/2006/xaml "4         xmlns:sys=" Clr-namespace:system ; Assembly=mscorlib "5         title=" MainWindow "height=" "" Width= "525" > 6     <Window.Resources> 7         < Style targettype= "{x:type TextBox}" > 8             <setter property= "Background" value= "Red"/> 9         </Style>     </window.resources>11     <grid>12         <textbox height= "All"                  margin= "87,75,0,0" Name= "TextBox1"  width= "/>14     </grid>15 </Window>
As I define the CSS style here, background=red is assigned to the TextBox control.
②:x:static
Used primarily to get the static value of an object in XAML, the code speaks.
namespace wpfapplication1{//<summary>//    MainWindow.xaml Interactive logic///    </summary>    public partial class Mainwindow:window    {public        static string name = "Line Code farm";        Public MainWindow ()        {            InitializeComponent ();}}    }
XAML Code:
<window x:class= "Wpfapplication1.mainwindow"        xmlns= "http://schemas.microsoft.com/winfx/2006/xaml/ Presentation "        xmlns:x=" Http://schemas.microsoft.com/winfx/2006/xaml "        xmlns:local=" Clr-namespace: WpfApplication1 "        title=" MainWindow "height=" "width=" 525 ">    <Grid>        <textbox height=" 23 "  text= "{x:static local:MainWindow.name}"                 Margin= "87,75,0,0" name= "TextBox1"  width= "</Grid></Window>"/>    
Final effect:
③:x:null
This is easier, and a control in XAML is set to null.
1     <grid>2         <textbox height= "text="  {x:null} "3                  margin=" 87,75,0,0 "name=" TextBox1 "  width= "/>4 </Grid>"     
④:x:array
The main thing is to create an array in XAML, or to give an example.
WPF01 (XAML)