相對佈局DependentLayout,也是比較常用的一個佈局管理器,在它裡面,元件的排列方式是相對於其他同級元件或者父元件的位置進行佈局。
相對同級元件
元件B神,想躲在元件A卡的
後邊
時,在B神
中用end_of屬性指定A卡的身份id即可。你將end_of理解成追尾就好,也就是說,如果想讓B在A的尾部,可在元件B神中,用end_of屬性指定元件A的id名稱,程式碼如下:
執行虛擬機器之後,效果如下圖所示:
有在尾部的end_of,就有在前面的start_of,還有在左邊的
left_of等等,更多用於指定相對位置的屬性,如下表所示:
屬性名稱
中文描述
取值
取值說明
使用案例
left_of
將右邊緣與另一個子元件的左邊緣對齊
引用
僅可引用DependentLayout中包含的其他元件的id。
說明
left_of與start_of、end_of屬性有衝突,不建議一起使用。在“水平佈局方向為從左到右”時,left_of會與start_of屬性衝突;在“水平佈局方向為從右到左”時,left_of會與end_of屬性衝突。
同時配置時,start_of、end_of優先順序高於left_of屬性。
ohos:left_of=“$id:component_id”
right_of
將左邊緣與另一個子元件的右邊緣對齊
引用
僅可引用DependentLayout中包含的其他元件的id。
說明
right_of與start_of、end_of屬性有衝突,不建議一起使用。在“水平佈局方向為從左到右”時,right_of會與end_of屬性衝突;在“水平佈局方向為從右到左”時,right_of會與start_of屬性衝突。
同時配置時,start_of、end_of優先順序高於right_of屬性。
ohos:right_of=“$id:component_id”
start_of
將結束邊與另一個子元件的起始邊對齊
引用
僅可引用DependentLayout中包含的其他元件的id。
說明
start_of與left_of、right_of屬性有衝突,不建議一起使用。在“水平佈局方向為從左到右”時,start_of會與left_of屬性衝突;在“水平佈局方向為從右到左”時,start_of會與right_of屬性衝突。
同時配置時,start_of優先順序高於left_of、right_of屬性。
ohos:start_of=“$id:component_id”
end_of
將起始邊與另一個子元件的結束邊對齊
引用
僅可引用DependentLayout中包含的其他元件的id。
說明
end_of與left_of、right_of屬性有衝突,不建議一起使用。在“水平佈局方向為從左到右”時,end_of會與right_of屬性衝突;在“水平佈局方向為從右到左”時,end_of會與left_of屬性衝突。
同時配置時,end_of優先順序高於left_of、right_of屬性。
ohos:end_of=“$id:component_id”
above
將下邊緣與另一個子元件的上邊緣對齊
引用
僅可引用DependentLayout中包含的其他元件的id
ohos:above=“$id:component_id”
below
將上邊緣與另一個子元件的下邊緣對齊
引用
僅可引用DependentLayout中包含的其他元件的id
ohos:below=“$id:component_id”
align_baseline
將子元件的基線與另一個子元件的基線對齊
引用
僅可引用DependentLayout中包含的其他元件的id
ohos:align_baseline=“$id:component_id”
align_left
將左邊緣與另一個子元件的左邊緣對齊
引用
僅可引用DependentLayout中包含的其他元件的id。
說明
align_left與align_start、align_end屬性有衝突,不建議一起使用。在“水平佈局方向為從左到右”時,align_left會與align_start屬性衝突;在“水平佈局方向為從右到左”時,align_left會與align_end屬性衝突。
同時配置時,align_start、align_end優先順序高於align_left屬性。
ohos:align_left=“$id:component_id”
align_top
將上邊緣與另一個子元件的上邊緣對齊
引用
僅可引用DependentLayout中包含的其他元件的id
ohos:align_top=“$id:component_id”
align_right
將右邊緣與另一個子元件的右邊緣對齊
引用
僅可引用DependentLayout中包含的其他元件的id。
說明
align_right與align_start、align_end屬性有衝突,不建議一起使用。在“水平佈局方向為從左到右”時,align_right會與align_end屬性衝突;在“水平佈局方向為從右到左”時,align_right會與align_start屬性衝突。
同時配置時,align_start、align_end優先順序高於align_right屬性。
ohos:align_right=“$id:component_id”
align_bottom
將底邊與另一個子元件的底邊對齊
引用
僅可引用DependentLayout中包含的其他元件的id
ohos:align_bottom=“$id:component_id”
align_start
將起始邊與另一個子元件的起始邊對齊
引用
僅可引用DependentLayout中包含的其他元件的id。
說明
align_start與align_left、align_right屬性有衝突,不建議一起使用。在“水平佈局方向為從左到右”時,align_start會與align_left屬性衝突;在“水平佈局方向為從右到左”時,align_start會與align_right屬性衝突。
同時配置時,align_start優先順序高於align_left、align_right屬性。
ohos:align_start=“$id:component_id”
align_end
將結束邊與另一個子元件的結束邊對齊
引用
僅可引用DependentLayout中包含的其他元件的id。
說明
align_end與align_left、align_right屬性有衝突,不建議一起使用。在“水平佈局方向為從左到右”時,align_end會與align_right屬性衝突;在“水平佈局方向為從右到左”時,align_end會與align_left屬性衝突。
同時配置時,align_end優先順序高於align_left、align_right屬性。
ohos:align_end=“$id:component_id”
align_parent_left
將左邊緣與父元件的左邊緣對齊
boolean型別
可以直接設定true/false,也可以引用boolean資源。
說明
align_parent_left與align_parent_start、align_parent_end屬性有衝突,不建議一起使用。在“水平佈局方向為從左到右”時,align_parent_left會與align_parent_start屬性衝突;在“水平佈局方向為從右到左”時,align_parent_left會與align_parent_end屬性衝突。
同時配置時,align_parent_start、align_parent_end優先順序高於align_parent_left屬性。
ohos:align_parent_left=“true”
ohos:align_parent_left=“$boolean:true”
align_parent_top
將上邊緣與父元件的上邊緣對齊
boolean型別
可以直接設定true/false,也可以引用boolean資源。
ohos:align_parent_top=“true”
ohos:align_parent_top=“$boolean:true”
align_parent_right
將右邊緣與父元件的右邊緣對齊
boolean型別
可以直接設定true/false,也可以引用boolean資源。
說明
align_parent_right與align_parent_start、align_parent_end屬性有衝突,不建議一起使用。在“水平佈局方向為從左到右”時,align_parent_right會與align_parent_end屬性衝突;在“水平佈局方向為從右到左”時,align_parent_right會與align_parent_start屬性衝突。
同時配置時,align_parent_start、align_parent_end優先順序高於align_parent_right屬性。
ohos:align_parent_right=“true”
ohos:align_parent_right=“$boolean:true”
align_parent_bottom
將底邊與父元件的底邊對齊
boolean型別
可以直接設定true/false,也可以引用boolean資源。
ohos:align_parent_bottom=“true”
ohos:align_parent_bottom=“$boolean:true”
align_parent_start
將起始邊與父元件的起始邊對齊
boolean型別
可以直接設定true/false,也可以引用boolean資源。
說明
align_parent_start與align_parent_left、align_parent_right屬性有衝突,不建議一起使用。在“水平佈局方向為從左到右”時,align_parent_start會與align_parent_left屬性衝突;在“水平佈局方向為從右到左”時,align_parent_start會與align_parent_right屬性衝突。
同時配置時,align_parent_start優先順序高於align_parent_left、align_parent_right屬性。
ohos:align_parent_start=“true”
ohos:align_parent_start=“$boolean:true”
align_parent_end
將結束邊與父元件的結束邊對齊
boolean型別
可以直接設定true/false,也可以引用boolean資源。
說明
align_parent_end與align_parent_left、align_parent_right屬性有衝突,不建議一起使用。在“水平佈局方向為從左到右”時,align_parent_end會與align_parent_right屬性衝突;在“水平佈局方向為從右到左”時,align_parent_end會與align_parent_left屬性衝突。
同時配置時,align_parent_end優先順序高於align_parent_left、align_parent_right屬性。
ohos:align_parent_end=“true”
ohos:align_parent_end=“$boolean:true”
center_in_parent
將子元件保持在父元件的中心
boolean型別
可以直接設定true/false,也可以引用boolean資源。
ohos:center_in_parent=“true”
ohos:center_in_parent=“$boolean:true”
horizontal_center
將子元件保持在父元件水平方向的中心
boolean型別
可以直接設定true/false,也可以引用boolean資源。
ohos:horizontal_center=“true”
ohos:horizontal_center=“$boolean:true”
vertical_center
將子元件保持在父元件垂直方向的中心
boolean型別
可以直接設定true/false,也可以引用boolean資源。
ohos:vertical_center=“true”
ohos:vertical_center=“$boolean:true”
2。 相對父級元件
內部元件相對於外部元件的位置,如內部元件A在外部元件B的左上角,將align_parent_top設定為True即可。
元件的位置佈局可以進行組合,形成處於左上角、左下角、右上角、右下角的佈局。
程式碼示例如下所示:
執行虛擬機器之後的效果如下圖所示:
好了,想對佈局的內容就說到這了,你自己多試試其他屬性,看看效果。我寫下一篇其他佈局去了。
對了,記得關注我,賺大發。
一個當了10年技術總監的老傢伙,分享多年的程式設計經驗。想學程式設計的朋友,關注我,你就賺到了。我愛分享Python、前端、Java和App方面的乾貨了。趕緊來圍觀啊!!!