目前的下拉组件如 Select 和 Menu 都是限定的内容,无法自定义

目前的下拉组件如 Select 和 Menu 都是限定的内容,无法自定义

HarmonyOS
2024-06-04 00:08:31
浏览
收藏 0
回答 1
待解决
回答 1
按赞同
/
按时间
五行缺踹

可通过该方法进行自定义:

// xxx.ets 
@Entry 
@Component 
struct PopupExample { 
  @State customPopup: boolean = false 
  // popup构造器定义弹框内容 
  @Builder 
  popupBuilder() { 
    Column() { 
      Text('笔记类型').fontSize(50) 
 
      Grid() 
 
      Row() { 
        Button("重置") 
        Button("完成") 
      } 
    } 
    .id("key") 
    .backgroundColor(Color.Yellow) 
    .width("100%") 
    .alignItems(HorizontalAlign.Start) 
  } 
 
  @Builder 
  topBuild(a: Visibility) { 
    Row() { 
      Text("综合").padding(20) 
        .backgroundColor(Color.Red) 
        .onClick(() => { 
          this.customPopup = !this.customPopup 
        }) 
      Text("用户").padding(20) 
        .backgroundColor(Color.Blue) 
    }.alignItems(VerticalAlign.Top).id("topBuild").visibility(a) 
  } 
 
  build() { 
    Stack() { 
      Column() { 
        Column() { 
          //为了匹配高度,真实请用margin,通过id获取topbuild高度 
          this.topBuild(Visibility.Hidden) 
        }.onTouch(() => { 
          if (this.customPopup) { 
            this.customPopup = false 
          } 
        }) 
        Image($r('app.media.app_icon')).width(50).height(50).onTouch(() => { 
          if (this.customPopup) { 
            this.customPopup = false 
          } 
        }) 
      }.height("100%") 
      .width("100%") 
      .alignItems(HorizontalAlign.Start) 
      .backgroundColor(Color.Gray) 
      .onTouch(() => { 
        if (this.customPopup) { 
          this.customPopup = false 
        } 
      }) 
 
      Column() { 
        this.topBuild(Visibility.Visible) 
        if (this.customPopup) { 
          this.popupBuilder() 
        } 
      }.alignItems(HorizontalAlign.Start) 
 
    }.align(Alignment.TopStart) 
 
  } 
}
分享
微博
QQ
微信
回复
2024-06-04 22:52:28
相关问题
自定义组件传值绑定
967浏览 • 1回复 待解决
自定义组件onMeasureSize使用
436浏览 • 1回复 待解决