一、PositionLayout 說明

• 在 PositionLayout 中，子組件通過指定準確的 x/y 坐標值在屏幕上顯示，(0, 0)為左上角；當向下或向右移動時，坐標值變大；允許組件之間互相重疊。
• PositionLayout 示意如下：

二、布局方式

• PositionLayout 以坐標的形式控制組件的顯示位置，允許組件相互重疊。
• 在 layout 目錄下的 XML 文件中創(chuàng)建 PositionLayout 并添加多個組件，并通過 position_x 和 position_y 屬性設(shè)置子組件的坐標。
• 使用 PositionLayout 的布局效果如下：

• 示例代碼：

<?xml version="1.0" encoding="utf-8"?><PositionLayoutxmlns:ohos="http://schemas.huawei.com/res/ohos"ohos:id="$+id:position"ohos:height="match_parent"ohos:width="300vp"ohos:background_element="#3387CEFA"><Textohos:id="$+id:position_text_1"ohos:height="50vp"ohos:width="200vp"ohos:background_element="#9987CEFA"ohos:position_x="50vp"ohos:position_y="8vp"ohos:text="Title"ohos:text_alignment="center"ohos:text_size="20fp"/><Textohos:id="$+id:position_text_2"ohos:height="200vp"ohos:width="200vp"ohos:background_element="#9987CEFA"ohos:position_x="8vp"ohos:position_y="64vp"ohos:text="Content"ohos:text_alignment="center"ohos:text_size="20fp"/><Textohos:id="$+id:position_text_3"ohos:height="200vp"ohos:width="200vp"ohos:background_element="#9987CEFA"ohos:position_x="92vp"ohos:position_y="188vp"ohos:text="Content"ohos:text_alignment="center"ohos:text_size="20fp"/></PositionLayout>

• 設(shè)置子組件的坐標時（position_x 和 position_y 屬性），除了上述示例中的 XML 方式，還可以在對應的 AbilitySlice 中通過 setPosition(int x, int y) 接口設(shè)置，Java 示例代碼如下：

Text title = (Text)findComponentById(ResourceTable.Id_position_text_1);Text content1 = (Text)findComponentById(ResourceTable.Id_position_text_2);Text content2 = (Text)findComponentById(ResourceTable.Id_position_text_3);title.setPosition(vp2px(50), vp2px(8));content1.setPosition(vp2px(8), vp2px(64));content2.setPosition(vp2px(92), vp2px(188));

• 單位轉(zhuǎn)換的方法如下：

private int vp2px(float vp) {return AttrHelper.vp2px(vp,this);}

• 對于超過布局本身大小的組件，超出部分將不顯示。如下所示，Right 組件右側(cè)超出部分將不顯示：

• 示例代碼：

<?xml version="1.0" encoding="utf-8"?><PositionLayout...>...<Textohos:id="$+id:position_text_4"ohos:height="120vp"ohos:width="120vp"ohos:background_element="#9987CEFA"ohos:position_x="212vp"ohos:position_y="64vp"ohos:text="Right"ohos:text_alignment="center"ohos:text_size="20fp"/></PositionLayout>

三、相關(guān)示例

• 演示 PositionLayout 的一些特性，包括子組件位置的影響和超越屏幕大小后子組件的顯示規(guī)則。請參考：PositionLayout。

總結(jié)

以上是生活随笔為你收集整理的HarmonyOS之常用布局PositionLayout的使用的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。