鴻蒙系統(tǒng)開發(fā)教程到這已經(jīng)是第16期了,今天我們介紹一下DirectionalLayout線性布局,帶好小本本我們開始今天的課程了。
DirectionalLayout布局
DirectionalLayout是Java UI中的重要布局,主要是用于將一組組件(Component)按照水平或者垂直方向排布,能夠很方便的對(duì)其布局內(nèi)的所有組件,同時(shí)也可以和其他布局進(jìn)行組合,實(shí)現(xiàn)更加豐富的布局方式。
DirectionalLayout的所有共有屬性是繼承自:Component基礎(chǔ)組件
DirectionalLayout示意圖
IT培訓(xùn)鴻蒙教程1" />
DirectionalLayout自有的布局屬性如下:
alignment屬性:表示在自有的XML屬性,其中包括對(duì)齊方式,有左對(duì)齊、右對(duì)齊、水平居中對(duì)齊、垂直居中對(duì)齊等方式horizontal_center、垂直居中對(duì)齊vertical_center等方式??梢栽O(shè)置取值項(xiàng)如表中所列,也可以使用“|”進(jìn)行多項(xiàng)組合。ohos:alignment="top|left" 或者ohos:alignment="left"
orientation屬性:是表示子布局的排列方向,其中有兩個(gè)重要的屬性,一個(gè)是水平方向 horizontal,一個(gè)是垂直方向vertical。示例如下:水平方向:ohos:orientation="horizontal" 垂直方向:ohos:orientation="vertical"
total_weight權(quán)重:所有子視圖的權(quán)重之和,可以直接設(shè)置浮點(diǎn)數(shù)值,也可以引用float浮點(diǎn)數(shù)資源。ohos:total_weight="2.5"ohos:total_weight="$float:total_weight"
layout_alignment對(duì)齊方式:表示DirectionalLayout所包含的可支持的XML屬性。其中對(duì)其方式有左對(duì)齊、頂部對(duì)齊、水平居中對(duì)齊、垂直居中對(duì)齊等??梢栽O(shè)置取值項(xiàng)如表中所列,也可以使用“|”進(jìn)行多項(xiàng)組合。ohos:layout_alignment="top" ohos:layout_alignment="top|left"
weight權(quán)重:權(quán)重(weight)就是按比例來(lái)分配組件占用父組件的大小,在水平布局下計(jì)算公式為:
父布局可分配寬度=父布局寬度-所有子組件width之和;
組件寬度=組件weight/所有組件weight之和*父布局可分配寬度;
實(shí)際使用過(guò)程中,建議使用width=0來(lái)按比例分配父布局的寬度,1:1:1效果如下:
案例一:排列方向
DirectionalLayout的排列方向(orientation)分為水平(horizontal)或者垂直(vertical)方向。使用orientation設(shè)置布局內(nèi)組件的排列方式,默認(rèn)為垂直排列。
案例二:權(quán)重
權(quán)重(weight)就是按比例來(lái)分配組件占用父組件的大小
以上就是這一期的鴻蒙系統(tǒng)DirectionalLayout線性布局的介紹了,同學(xué)們趕緊去試試吧,最后歡迎對(duì)鴻蒙開發(fā)感興趣的同學(xué)來(lái)到千鋒web前端培訓(xùn)班參加我們的培訓(xùn)課程的學(xué)習(xí),課程不僅包含了全套的鴻蒙系統(tǒng)開發(fā)教程,更含有全套的大前端開發(fā)課程,現(xiàn)在咨詢還有免費(fèi)學(xué)習(xí)教程可以領(lǐng)取,趕緊去找在線老師了解一下吧。