1.
Grid
Widget A grid defines a grid layout composed of columns and rows. The grid. rowdefinitions and grid. columndefinitions Collections contain rowdefinition and columndefinition respectively to define the width and height of rows and columns. The number of rows and columns is defined based on the number of neutron objects in the set. The grid. Row and grid. Column attributes of each sub-object are used to define the position in the grid.
2.
Stackpanel
Widget The stackpanel control allows the sub-objects in the layout to be arranged horizontally or vertically. You can set orientation = "vertical" or orientation = "horizontal" to define the arrangement. By default, sub-objects are arranged vertically.
3.
Canvas Layout in an absolute position. By setting the sub-object canvas. left specifies the distance between the object and the left side of the canvas (x coordinate); canvas. top specifies the distance (Y coordinate) between the object and the top of the canvas ). Canvas It can contain sub-objects. These Sub-objects are displayed in Canvas Regions are explicitly located by coordinates. Because absolute positioning does not consider the size of the browser window or browser size adjustment, it is generally best to use Grid Or Stackpanel As a container.
BecauseCanvasIsUielementType, so it can be nestedCanvasObject.
In many cases,CanvasIt is used only as a container for other objects without any visible attributes. If any of the following conditions is met,CanvasInvisible:
-
HeightThe property is equal to 0.
-
WidthThe property is equal to 0.
-
BackgroundAttribute equalsNullNothingNullptrNull reference (in Visual BasicNothing).
OpacityThe property is equal to 0.
-
VisibilityAttribute equalsVisibility.Collapsed.
-
CanvasA parent object is invisible.
<Canvas width = "300" Height = "300" background = "white">
<Canvas width = "250" Height = "250" canvas. Left = "30"
Canvas. Top = "30" background = "blue">
<Rectangle canvas. Left = "30" canvas. Top = "30"
Fill = "red" width = "200" Height = "200"/>
</Canvas>
</Canvas>
4.
Scrollviewer Scrollviewer Controls are used to indicate the scrollable areas that can contain other visible elements. You can set the horizontalscrollbarvisibility and verticalscrollbarvisibility attributes to control the status of horizontal and vertical scroll bars.
5.
Border Controls are not suitable for layout, but are indeed container controls.
BorderControls provide borders and/or backgrounds for another control. A border can contain only one child element.
Border
The following example shows howStackpanelContains multipleTextblockPlace a border around the object.
<Border borderthickness = "5" borderbrush = "blue">
<Stackpanel grid. Column = "0" grid. Row = "0">
<Textblock text = "one"/>
<Textblock text = "two"/>
<Textblock text = "three"/>
</Stackpanel>
</Border>
6.Textblock
Text Control
<Textblock X: Name = "applicationtitle" text = "my application" style = "{staticresource phonetextnormalstyle}"/> <textblock X: name = "pagetitle" text = "Page name" margin = "-3,-8, 0, 0 "style =" {staticresource phonetexttitle1style} "/> the textblock control in the example is used to display a small amount of text. The text attribute corresponds to the text content. The text attribute can be dynamically defined in The XAML file or in the C # Code . Use the name defined by the X: Name attribute to determine the textblock control to be modified. In this example, you can set a new string for applicationtitle. Text to change the text content. The textblock control cannot receive text input by users, and is not suitable for displaying too long text. The Textbox Control can perform such tasks with the following code: <textbox Height = "72" horizontalalignment = "Left" margin = "10, 10, the 460 "name =" textbox1 "text =" textbox "verticalalignment =" TOP "width =" "/> maxlength attribute controls the string length of the text. You can also use the passwordbox Control for password input. The Code is as follows: <passwordbox Height = "72" horizontalalignment = "Left" margin =, 0, 0 "name =" passwordbox1 "verticalignment =" TOP "width =" 460 "/> the passwordbox control can also use passwordchar to define the characters displayed by the password.
7.Button and hyperlinkbutton
Button Control The button control contains the button control and hyperlinkbutton control. Compared with the button control, the hyperlinkbutton control can automatically navigate to the URI specified for navigateuri without having to process the click event. <Button content = "button" Height = "72" horizontalalignment = "Left" margin = "10,174, 160 "name =" button1 "verticalignment =" TOP "width =" 176,195 "/>
8.Radiobutton checkbox
Select Control Radiobutton is used to select an option from a set of options. radiobutton can combine multiple radiobutton controls into one group. Place it in the same parent control or set the groupname attribute. The groupname attribute can also be used to divide radiobutton in the same parent control into multiple groups. Radiobutton in the same group will be mutually exclusive, that is, the user can only set the status of one button to the selected status. <Radiobutton content = "radiobutton" Height = "72" horizontalalignment = "Left" margin = "10, 10, 0, 0 "name =" radiobutton1 "verticalignment =" TOP "/> radiobutton can be set to selected, unselected, and disabled. The default status is unselected. If ischecked = "true" is set, the status can be changed to selected. If isenabled = "false" is set, the status can be changed to disabled. Checkbox is used to select multiple options. Like radiobutton, you can set ischecked and isenabled to control the status. <Checkbox content = "checkbox" Height = "72" horizontalalignment = "Left" margin = "10,166, 0, 0 "name =" checkbox1 "verticalignment =" TOP "/> after the checkbox is set to isthreestate =" true ", an uncertain state can be added. Slider is suitable for selecting a value within a range. <Slider Height = "84" horizontalalignment = "Left" margin = "0,326, 460 "name =" slider1 "verticalignment =" TOP "width =" "/> the maximum and minimum attributes are used to define the maximum and minimum values. The value attribute is a value between maximum and minimum, used to define the current value of the slider. By default, minimum = "0" Maximum = "10 ". You can drag to change the slider value. The smallchange attribute can define the dragging precision, or you can click to change the slider value. The largechange attribute defines the precision of the value change. You can set the horizontal and vertical directions using the orientation attribute based on the needs of the interface layout.
