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

Question

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

Answer 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)

  }
}