在需要对组团组件进行布局时,可以用表格布局TableLayout和盒子布局AdaptiveBoxLayout进行排版,至于绝对布局PositionLayout和层叠布局StackLayout,平时很少会用到。下面就一起来了解一下这4种新的布局。
表格布局表格布局TableLayout按行和列的方式进行布局,这个在布局多个组件时,会用到,它的相关属性如下表所示:
属性名称

中文描述
取值
取值说明
使用案例
alignment_type
对齐方式
align_edges
表示TableLayout内的组件按边界对齐。
ohos:alignment_type="align_edges"
align_contents
表示TableLayout内的组件按边距对齐。
ohos:alignment_type="align_contents"
column_count
列数
integer类型
可以直接设置整型数值,也可以引用integer资源。
ohos:column_count="3"
ohos:column_count="$integer:count"
row_count
行数
integer类型
可以直接设置整型数值,也可以引用integer资源。
ohos:row_count="2"
ohos:row_count="$integer:count"
orientation
排列方向
horizontal
表示水平方向布局。
ohos:orientation="horizontal"
vertical
表示垂直方向布局。
ohos:orientation="vertical"
示例代码如下所示:
<?xml version="1.0" encoding="utf-8"?><TableLayout xmlns:ohos="http://schemas.huawei.com/res/ohos" ohos:height="match_parent" ohos:width="match_parent" ohos:background_element="#e8ebf4" ohos:column_count="2" ohos:layout_alignment="horizontal_center" ohos:padding="8vp" ohos:row_count="2"> <Text ohos:height="60vp" ohos:width="60vp" ohos:margin="8vp" ohos:text="酷的" ohos:text_alignment="center" ohos:text_color="#4dd3a0" ohos:text_size="30fp"/> <Text ohos:height="60vp" ohos:width="60vp" ohos:margin="8vp" ohos:text="美的" ohos:text_alignment="center" ohos:text_color="#fe6486" ohos:text_size="30fp"/> <Text ohos:height="60vp" ohos:width="60vp" ohos:margin="8vp" ohos:text="帅的" ohos:text_alignment="center" ohos:text_color="#0099fb" ohos:text_size="30fp"/> <Text ohos:height="60vp" ohos:width="200vp" ohos:margin="8vp" ohos:text="都是关注我的" ohos:text_alignment="center" ohos:text_color="#fc7754" ohos:text_size="30fp"/></TableLayout>
虚拟机运行的效果如下所示:
表格布局在开发中,有时会用到,你熟悉一下即可。
码字不易,关注+转发是对我最大的鼓励。
一个当了10年技术总监的老家伙,分享多年的编程经验。想学编程的朋友,关注我,你就赚到了。我最喜欢分享Python、前端、Java和App方面的干货了。赶紧来围观啊!!!
#鸿蒙##华为鸿蒙##头条热搜##热门##好平台好讲师#