Harmony UI布局与Android UI布局对比_directionallayout和linearlayout

作者：凡人多烦事01 | 2024-03-12 18:26:38

踩

directionallayout和linearlayout

一、线性布局—DirectionalLayout和LinearLayout

自有XML属性

HarmonyOS	Android	描述	Android取值	HarmonyOS取值
orientation	orientation	子布局排列方向	horizontal/vertical	相同
gravity	alignment	对齐方式	top/right/bottom/center_horizontal /center_vertical/center/start/end	top/right/bottom/horizontal_center /vertical_center/center/start/end
total_weight	weightSum	所有子视图的权重之和	权重数值（例:2.5）	相同

支持的XML属性

HarmonyOS	Android	描述	Android取值	HarmonyOS取值
layout_alignment	layout_gravity	对齐方式	top/right/bottom/center_horizontal /center_vertical/center/start/end	top/right/bottom/horizontal_center /vertical_center/center/start/end
weight	layout_weight	权重	权重数值（例:1）	相同

二、相对布局—DependentLayout和RelativeLayout

自有XML属性

HarmonyOS	Android	描述	Android取值	HarmonyOS取值
gravity	alignment	对齐方式	top/right/bottom/center_horizontal /center_vertical/center/start/end	top/right/bottom/horizontal_center /vertical_center/center/start/end

支持的XML属性

HarmonyOS	Android	描述	Android取值	HarmonyOS取值
left_of	layout_toLeftOf	将右边缘与另一个子组件的左边缘对齐	@id/view_id	$id:view_id
right_of	layout_toRightOf	将左边缘与另一个子组件的右边缘对齐	@id/view_id	$id:view_id
start_of	layout_toStartOf	将结束边与另一个子组件的起始边对齐	@id/view_id	$id:view_id
end_of	layout_toEndOf	将起始边与另一个子组件的结束边对齐	@id/view_id	$id:view_id
above	layout_above	将下边缘与另一个子组件的上边缘对齐	@id/view_id	$id:view_id
below	layout_below	将上边缘与另一个子组件的下边缘对齐	@id/view_id	$id:view_id
align_baseline	layout_alignBaseline	将子组件的基线与另一个子组件的基线对齐	@id/view_id	$id:view_id
align_left	layout_alignLeft	将左边缘与另一个子组件的左边缘对齐	@id/view_id	$id:view_id
align_top	layout_alignTop	将上边缘与另一个子组件的上边缘对齐	@id/view_id	$id:view_id
align_right	layout_alignRight	将右边缘与另一个子组件的右边缘对	@id/view_id	$id:view_id
align_bottom	layout_alignBottom	将底边与另一个子组件的底边对齐	@id/view_id	$id:view_id
align_start	layout_alignStart	将起始边与另一个子组件的起始边对齐	@id/view_id	$id:view_id
align_end	layout_alignEnd	将结束边与另一个子组件的结束边对齐	@id/view_id	$id:view_id
align_parent_left	-	将左边缘与父组件的左边缘对齐	-	true/false
align_parent_top	layout_alignParentTop	将上边缘与父组件的上边缘对齐	true/false	相同
align_parent_right	layout_alignParentRight	将右边缘与父组件的右边缘对齐	true/false	相同
align_parent_bottom	layout_alignParentBottom	将底边与父组件的底边对齐	true/false	相同
align_parent_start	layout_alignParentStart	将起始边与父组件的起始边对齐	true/false	相同
align_parent_start	layout_alignParentStart	将起始边与父组件的起始边对齐	true/false	相同
align_parent_start	layout_alignParentStart	将起始边与父组件的起始边对齐	true/false	相同
align_parent_end	layout_alignParentEnd	将结束边与父组件的结束边对齐	true/false	相同
center_in_parent	layout_centerInParent	将子组件保持在父组件的中心	true/false	相同
horizontal_center	layout_centerHorizontal	将子组件保持在父组件水平方向的中心	true/false	相同
vertical_center	layout_centerVertical	将子组件保持在父组件垂直方向的中心	true/false	相同

三、框架布局—FrameLayout 和StackLayout

支持的XML属性

HarmonyOS	Android	描述	Android取值	HarmonyOS取值
layout_alignment	layout_gravity	对齐方式	top/right/bottom/center_horizontal /center_vertical/center/start/end	top/right/bottom/horizontal_center /vertical_center/center/start/end

四、表格布局—TableLayout

Android和Harmony的表格布局不同，Android的行是以TableRow内的控件多少来决定的，列是TableRow的数量决定的。而Harmony是TableLayout控件内的属性来决定的。

TableLayout的自有XML属性

HarmonyOS	Android	描述	Android取值	HarmonyOS取值
alignment_type	-	对齐方式	-	align_edges/align_contents
column_count	-	列数	-	integer类型(例:2)
row_count	-	行数	-	integer类型(例:2)
orientation	-	排列方向	-	horizontal/vertical

五、绝对布局—AbsoluteLayout和PositionLayout

支持的XML属性

HarmonyOS	Android	描述	Android取值	HarmonyOS取值
position_x	layout_x	相对父控件的X轴距离	10dp	10vp
position_y	layout_y	相对父控件的Y轴距离	10dp	10vp

六、自适应布局布局—AdaptiveBoxLayout和ConstraintLayout下的Flow布局(androidx.constraintlayout.helper.widget.Flow)

在这个布局中添加子控件，会根据子控件的宽度自适应布局，类似于一些标签控件。

声明：本文内容由网友自发贡献，不代表【wpsshop博客】立场，版权归原作者所有，本站不承担相应法律责任。如您发现有侵权的内容，请联系我们。转载请注明出处：https://www.wpsshop.cn/w/凡人多烦事01/article/detail/225272