Xamarin绝对布局

Keywords:

AbsoluteLayout介绍(转载

AbsoluteLayout是一种绝对布局,在AbsoluteLayout中可以明确的指出子视图的位置(相对于左边和上边的坐标)和大小(不设置大小时默认为子视图本身大小),位置和大小的设置可以是一个绝对值也可以是相对于当前AbsoluteLayout的一个比例值,绝对值和比例值可以混合使用。由于设备尺寸不同故绝对值不推荐使用。

演示如何在屏幕的上下左右四边中间位置定义一个指定大小的Label。下面的效果(IOS预览效果,顶部空白是IOS状态栏预留):


AbsoluteLayout布局的子视图,通过AbsoluteLayout.LayoutBounds属性来位置和大小,AbsoluteLayout.LayoutFlags属性指定是绝对值还是比例值。

LayoutBounds是Rectangle类型对象,拥有如下四个值,AbsoluteLayouty也是通过这四个值确定子视图的位置和大小。

X – 子视图的水平坐标
Y – 子视图的垂直坐标
Width – 子视图的宽度
Height – 子视图的高度

相对值设置需指定0~1之间的一个double值,表示子视图与布局之间的对应关系,如:子视图的Width为一个.5的相对值,定义在一个宽度为480的Layout中,则子视图的宽度为480 * 0.5 = 240.
绝对值使用明确值设置子视图的X,Y,Width,Heigh值即可.

LayoutFlags是AbsoluteLayoutFlags类型枚举,多个枚举值可以通过逗号分隔(XAML中)组合使用。

None – 默认值。表示X,Y,Width,Height四个值都是绝对值.
All – 表示所有值都是相对值.
WidthProportional – 只有Width是相对值.
HeightProportional – 只有Height是相对值.
XProportional – 只有X是相对值.
YProportional – 只有Y是相对值.
PositionProportional – X,Y 是相对值.
SizeProportional – Width和Height是相对值.

本文示例Xaml定义如下:

<AbsoluteLayout>
    <Label Text="Left Center" BackgroundColor="Lime" AbsoluteLayout.LayoutBounds="0,.5,20,200" AbsoluteLayout.LayoutFlags="PositionProportional"/>
    <Label Text="Top Center" BackgroundColor="Lime" AbsoluteLayout.LayoutBounds=".5,0,200,20" AbsoluteLayout.LayoutFlags="PositionProportional"/>
    <Label Text="Rop Center" BackgroundColor="Lime" AbsoluteLayout.LayoutBounds="1,.5,20,200" AbsoluteLayout.LayoutFlags="PositionProportional"/>
    <Label Text="Right Center" BackgroundColor="Lime" AbsoluteLayout.LayoutBounds=".5,1,200,20" AbsoluteLayout.LayoutFlags="PositionProportional"/>
</AbsoluteLayout>

代码中定义布局子视图调用AbsoluteLayout提供的静态方法:AbsoluteLayout.SetLayoutBounds设置AbsoluteLayout.LayoutBounds属性,AbsoluteLayout.SetLayoutFlags设置AbsoluteLayout.LayoutFlags属性。

设置LayoutFlags的组合值
AbsoluteLayout.SetLayoutFlags(label,AbsoluteLayoutFlags.XProportional|AbsoluteLayoutFlags.YProportional);

作者:songshizhao 发表于:2017-05-13T11:51:49 访问量:587