/** * 选择弹窗 * 使用示例- *
@State parentContext:object= this
SelectPickerDialog: CustomDialogController = new CustomDialogController({ builder: SelectPickerDialog({ title: $title,parentContext:$parentContext, arr:$,//[{key:,name:,detail:,obj:,onClick:function}]列表内容 btnObj:$,//[{name:,onClick:function,key:}] }), offset: { dx: 0, dy: -25 } }) selectPickerDialogDisappear() { this.SelectPickerDialog = null // 将dialogController置空 } //this.SelectPickerDialog.close() //this.SelectPickerDialog.open(); */ @CustomDialog export default struct SelectPickerDialog { @Link title:string//标题 @Link arr:Array<Object>
@Link parentContext:Object//父级的上下文 按需声明
@Link btnObj:Array<Object>//按钮事件 controller?: CustomDialogController scroller: Scroller = new Scroller() build() { Column() { Text(this.title) .fontWeight(FontWeight.Bold) .fontSize(16) .width('100%') .padding({left:'15vp',top:15,bottom:15}) .border({width:{bottom:1},color:'#f2f2f2',style:BorderStyle.Solid}) if(this.arr.length<=0){ Text('没有数据') .fontSize(16) .fontColor('#999999') .width('90%') .padding({left:'5vp',bottom:15,top:15}) } Column(){ Column(){ Stack({ alignContent: Alignment.TopStart }) { Scroll(this.scroller) { Column() { ForEach(this.arr, (item) => { Column({ space: 5 }) { Text(item.name) .fontSize(16) .width('100%') .padding({ left: '5vp' }) .margin({ bottom: 4 }) .border({ width: { bottom: item.detail ? 0 : 1 }, color: '#f2f2f2', style: BorderStyle.Solid }) if (item.detail) { Text(item.detail) .fontSize(16) .fontColor('#999999') .width('100%') .padding({ left: '5vp', bottom: 4 }) .border({ width: { bottom: 1 }, color: '#f2f2f2', style: BorderStyle.Solid }) } } .margin({ top: 10 }) .onClick(() => { if (typeof item.onClick == "function") { item.onClick(item.obj) } }) }, item => item.key) } } .scrollable(ScrollDirection.Vertical) // 滚动方向纵向 .scrollBar(BarState.On) // 滚动条常驻显示 .scrollBarColor(Color.Gray) // 滚动条颜色 .scrollBarWidth(5) // 滚动条宽度 .edgeEffect(EdgeEffect.None) } .height(190) } Column(){ ForEach(this.btnObj,(item)=>{ Button(item.name).width('95%').margin({ bottom: 20 }) .onClick(()=>{ if(typeof item.onClick=="function"){ item.onClick() } }) },item=>item.key) } } .justifyContent(FlexAlign.SpaceBetween) .height(250) .width('90%') } .width('100%') .justifyContent(FlexAlign.Center) } }