ColumnSplit
將子組件縱向布局,并在每個子組件之間插入一根橫向的分割線。
說明:
開發前請熟悉鴻蒙開發指導文檔 :[gitee.com/li-shizhen-skin/harmony-os/blob/master/README.md
]
該組件從API Version 7開始支持。后續版本如有新增內容,則采用上角標單獨標記該內容的起始版本。
子組件
可以包含子組件。
接口
ColumnSplit()
屬性
名稱 | 參數類型 | 描述 |
---|---|---|
resizeable | boolean | 分割線是否可拖拽,默認為false。 |
divider10+ | [ColumnSplitDividerStyle] | null |
ColumnSplitDividerStyle10+對象說明
名稱 | 參數類型 | 必填 | 描述 |
---|---|---|---|
startMargin | [Dimension] | 否 | 分割線與其上方子組件的距離。 默認值:0 |
endMargin | [Dimension] | 否 | 分割線與其下方子組件的距離。 默認值:0 |
說明:
與RowSplit相同,ColumnSplit的分割線可以改變上下兩邊子組件的高度,子組件可改變高度的范圍取決于子組件的最大最小高度。
HarmonyOS與OpenHarmony鴻蒙文檔籽料:mau123789是v直接拿
支持clip、margin等通用屬性,clip不設置的時候默認值為true。
示例
// xxx.ets
@Entry
@Component
struct ColumnSplitExample {
build() {
Column(){
Text('The secant line can be dragged').fontSize(9).fontColor(0xCCCCCC).width('90%')
ColumnSplit() {
Text('1').width('100%').height(50).backgroundColor(0xF5DEB3).textAlign(TextAlign.Center)
Text('2').width('100%').height(50).backgroundColor(0xD2B48C).textAlign(TextAlign.Center)
Text('3').width('100%').height(50).backgroundColor(0xF5DEB3).textAlign(TextAlign.Center)
Text('4').width('100%').height(50).backgroundColor(0xD2B48C).textAlign(TextAlign.Center)
Text('5').width('100%').height(50).backgroundColor(0xF5DEB3).textAlign(TextAlign.Center)
}
.borderWidth(1)
.resizeable(true) // 可拖動
.width('90%').height('60%')
}.width('100%')
}
}
審核編輯 黃宇
聲明:本文內容及配圖由入駐作者撰寫或者入駐合作網站授權轉載。文章觀點僅代表作者本人,不代表電子發燒友網立場。文章及其配圖僅供工程師學習之用,如有內容侵權或者其他違規問題,請聯系本站處理。
舉報投訴
-
組件
+關注
關注
1文章
517瀏覽量
17887 -
鴻蒙
+關注
關注
57文章
2392瀏覽量
42972
發布評論請先 登錄
相關推薦
評論