鸿蒙开发选择表情

鸿蒙开发选择表情

动态评论和聊天信息都需要用到表情，鸿蒙是没有提供的，得自己做

一、思路：

用表情字符显示表情，类似0x1F600代表笑脸

二、效果图：

三、关键代码：

// 联系：893151960
Column() {


          Swiper() {
            ForEach(CommonConstants.EMOJI_DATA, (emojiData: number[], index1: number) => {
              Column() {
                Grid() {
                  ForEach(emojiData, (item: number, index2: number) => {
                    GridItem() {
                      Stack() {
                        Text(String.fromCodePoint(item)).fontColor($r('app.color.color_black')).fontSize(24)
                      }
                      .width('100%')
                      .height('100%')
                      .onClick(() => {

                        let offsetIndex: number = this.textController.getCaretOffset().index // 光标位置
                        this.commentText = `${this.commentText.slice(0,
                          offsetIndex)}${String.fromCodePoint(item)}${this.commentText.slice(offsetIndex,
                          this.commentText.length)}`
                      })
                    }
                  })
                }
                .columnsTemplate('1fr 1fr 1fr 1fr 1fr 1fr 1fr')
                .rowsTemplate('1fr 1fr 1fr 1fr')
                .width('100%')
                .aspectRatio(7 / 4)
              }
              .width('100%')
              .padding({ bottom: 8 })
            })
          }
          .width('100%')
          .loop(false)
          .backgroundColor($r('app.color.color_ed'))
          .padding(8)
        }
        .padding(12)

四、项目demo源码结构图：

有问题或者需要完整源码demo的私信我