
WaterFlow組件又稱(chēng)瀑布流組件, 在A(yíng)PP中顯示列表數(shù)據(jù),除了使用List組件和Grid組件外, 也經(jīng)常使用WaterFlow組件。先看效果圖1.創(chuàng)建WaterFlow組件使用下面的接口創(chuàng)建WaterFlow組件WaterFlow(options?: WaterFlowOptions)WaterFlow組件的子組件是FlowItem, 用于展示瀑布流的Item.2. WaterFlow組件的常用屬性3.WaterFlow的組件的常用事件4.示例代碼Index_WaterFlow.ets 如下:import{WaterFlowDataSource}from'../module/WaterFlowDataSource'@Entry@Componentstruct Index_WaterFlow{privatewaterFlowDataSource:WaterFlowDataSource=newWaterFlowDataSource();@Statesections:WaterFlowSections=newWaterFlowSections()oneColumSection:SectionOptions={itemsCount:1,// 該分組中Item的個(gè)數(shù)crossCount:1,// 列數(shù)為 1margin:{bottom:10},onGetItemMainSizeByIndex:()={return160}}twoColumSection:SectionOptions={itemsCount:14,// 該分組中Item的個(gè)數(shù)crossCount:2,// 列數(shù)為2onGetItemMainSizeByIndex:()={return160}}aboutToAppear():void{// 準(zhǔn)備數(shù)據(jù)源this.waterFlowDataSource.setDataArray(WaterFlowDataModule.WATER_FLOW_DATA)this.sections.push(this.oneColumSection)this.sections.push(this.twoColumSection)}build(){// 瀑布流WaterFlow({sections