HarmonyOS鸿蒙Next应用开发-原子化布局能力

HarmonyOS鸿蒙Next应用开发-原子化布局能力 由于设备屏幕规格的多样性，设计师往往需要花费许多时间精力在界面适配工作上，为了解决这一问题，HarmonyOS 设计工具提供了原子化布局能力。通过给画板上的图层设置不同能力，实现在任意拉伸画板时能够呈现理想的响应式布局效果，快速适配多屏幕设计。

工具提炼了七种原子化布局能力，可以划分为“自适应变化能力”和“自适应布局能力”两类。其中，自适应变化能力包含了缩放能力和拉伸能力，自适应布局能力包含了隐藏、折行、均分、占比和延伸能力。

一．自适应变化能力

当画板尺寸发生变化时，设置了自适应变化能力的图层，可以通过自身变化去适应画板尺寸的改变。

1. 缩放能力

缩放能力可以固定一个元素在容器中所占的宽、高比例，自动计算调整图层组的尺寸，避免手动拖拽修改尺寸带来的排版错乱等问题。缩放能力的可调参数包括：

• 可用空间：需要应用定义元素在容器中水平和垂直方向可用空间的百分比。
• 放大极限：定义元素缩放的最大值和最小值。当按照可用空间百分比计算得出的宽度或高度，超出了放大极限的定义，则按照相应的放大极限进行显示。

2. 拉伸能力

拉伸能力可以固定一个元素在容器中的边距，容器发生水平或垂直方向上的拉伸时，元素保持设定的边距不变，进行拉伸。拉伸能力的可调参数包括：

• 固定边距：需要固定元素在容器中各个方向上的间距。
• 拉伸极限：定义元素宽高的最大值和最小值。定义了最大值后，若可用区域继续变大，元素宽高维持最大值；定义了最小值后，若可用区域继续变小，元素宽高维持最小值。

二．自适应布局能力

1. 隐藏能力

隐藏能力能根据容器可用空间大小，动态计算容器内适合展示的元素，空间无法容纳全部元素时，显示优先级低的元素自动隐藏。隐藏能力的可调参数包括：

• 隐藏方向：容器可以指定水平方向还是垂直方向有隐藏能力，图层排成一行或者一列时，隐藏能力才会被触发。
• 隐藏顺序：当容器某一方向的空间发生变化时，元素根据定义的隐藏优先级顺序，体现隐藏效果。在设置隐藏优先级时，数字越大代表越优先隐藏，当有多个元素的优先级相同时，将同时出现或隐藏。

2. 折行能力

折行能力根据容器的宽度计算出每行可容纳的元素个数，当容器宽度缩小，横向空间不足时，元素将自动向下折行。折行能力的可调参数包括：

• 折行方向：定义折行后的位置顺序。
• 对齐方式：定义元素的对齐情况。
• 元素间距：定义元素之间的间距。
• 折行参考值：可以定义各元素折行的参考值，当容器的可用宽度大于参考值之和时，体现为行布局，如未定义，默认的折行参考值等于各元素的实际宽度值。

3. 均分能力

均分能力根据容器尺寸变化，重新调整内部图层与图层之间的距离，始终保证相等。均分能力的可调参数包括：

• 均分方向：容器可以指定水平方向还是垂直方向有均分能力。
• 边距定义：可以定义首尾两端的元素边距是否参与均分，或是指定固定的边距值。
• 间距极限：允许应用定义均分后的最小间距和最大间距。若达到定义的间距极限后，整体按定义的极限值，在空间中心对齐布局。

4. 占比能力

占比能力按百分比把容器划分为多个可用空间，指定每个元素在各自的比例空间中进行布局。占比能力的可调参数包括：

• 占比方向：容器可以指定水平方向还是垂直方向有占比能力。
• 比值定义：当容器尺寸发生变化，组件内元素根据当前定义好的占比规则，分别在各自可用的容器区域内进行布局。

5. 延伸能力

延伸能力可以根据容器大小，动态计算容器中可以显示的元素个数，自动复制或者隐藏元素来适应容器大小。延伸能力的可调参数包括：

• 延伸方向：容器可以指定水平方向还是垂直方向有延伸能力。
• 间距定义：需要应用给出图层之间的间距，可显示的图层数量根据可用宽度和此值计算得出。
• 露出特征：可以定义最后是否需要有露出特征，用具体的vp值进行定义。
• 间距极限：在有露出特征的情况下，根据推荐间距，露出特征，当前宽度动态计算出可显示的元素个数和最终间距。允许定义最小间距。当最终间距不满足间距最小值时，可显示的元素个数减一。

本文主要根据HarmonyOS官方文档整理创作。