Wp8.1 UI programming III. Layout

1. Panel is the parent class of all layout panels. Common Layout panels:

Canvas. child elements can be located based on the coordinates of the region.

Stackpanel, stack panel, layout structure is like a stack, only horizontal and vertical direction.

Grid, grid, and sub-elements can be laid out based on the row and column layout.

If Complex layout is not required, use a relatively simple layout panel to improve performance. For example, use canvas instead of grid.

The layout is a recursive system that first performs measurements and then arranges them. Measurement refers to the size and position of the final child element.

Relayout should be minimized to improve performance.

The UI element has two important classes: uielement and frameworkelement. The Inheritance structure is as follows:

Windows. UI. XAML. dependencyobject

Windows. UI. XAML. uielement: Has the measure and arrange methods.

Windows. UI. XAML. frameworkelement: has two virtual Methods: measureoverride and arrangeoverride.

Recursion of measurement and arrangement:

Call measure and arrange successively;

Measure first calls measureoverride (if this method is implemented). If the element has a sub-object, measureoverride then calls the sub-object's measure;

Arrange first calls arrangeoverride (if this method is implemented). If the element has a sub-object, arrangeoverride then calls the sub-object arrange.

 

Deploy different resolutions to avoid the number of hardcoded workers.

You can also use the height and width attributes of the windows. UI. XAML. Window. Current. bounds class to obtain the resolution and proportion of the mobile phone, so as to dynamically adapt to the actual resolution.

 

2. Based on the above, you can customize layout rules.

Inherit the Panel to customize the layout panel.

If some parameters are passed to implement a special layout (for example, the circle surrounding layout requires a radius value), use the invalidatearrange method to rearrange the layout dynamically according to the parameter changes.

Override the measureoverride and arrangeoverride methods.

Wp8.1 UI programming III. Layout