首页 > 代码库 > WP8.1 UI 编程 三、布局
WP8.1 UI 编程 三、布局
1. Panel是所有布局面板的父类。常用的布局面板:
Canvas,子元素可以根据区域内坐标定位。
StackPanel,栈面板,布局结构就像一个栈,只有水平竖直两种方向。
Grid,网格,子元素可以根据行列布局。
如果不需要进行复杂的布局,应尽量用相对简单的布局面板以提升表现,如用Canvas替代Grid。
布局是一个递归系统,先进行测量,再进行排列。测量是测量子元素所需大小,排列是最终子元素大小及位置。
应尽量减少重新布局,以提升表现。
UI元素有两个重要的类UIElement和FrameworkElement,继承结构如下:
Windows.UI.Xaml.DependencyObject
Windows.UI.Xaml.UIElement:具有Measure和Arrange方法
Windows.UI.Xaml.FrameworkElement:具有两个虚方法MeasureOverride和ArrangeOverride
测量和排列的递归:
先后调用Measure和Arrange;
Measure会先调用MeasureOverride(如果实现了此方法),如果元素有子对象,MeasureOverride再调用子对象的Measure;
Arrange会先调用ArrangeOverride(如果实现了此方法),如果元素有子对象,ArrangeOverride再调用子对象的Arrange。
对不同分辨率上进行布局,应避免硬编码像素数。
也可以用Windows.UI.Xaml.Window.Current.Bounds类的Height和Width属性获取手机分辨率及比例,从而根据实际分辨率进行动态适配。
2. 以上面为基础,可以实现自定义布局规则。
先继承Panel来自定义布局面板。
如果传递一些参数来实现特殊的布局(如圆形环绕布局需要半径值),当布局根据参数动态变化时,要使用InvalidateArrange方法重新排列。
接着重写MeasureOverride和ArrangeOverride方法。
WP8.1 UI 编程 三、布局