【每日学点HarmonyOS Next知识】对话框回调问题、输入区域最大行数、web自定义节点、icon图标库、软键盘开关

1、HarmonyOS 使用promptAction.openCustomDialog(contentNode);无法触发onWillDismiss回调?

使用promptAction.openCustomDialog(contentNode);无法触发onWillDismiss回调

  1. 当用户执行点击遮障层关闭、左滑/右滑、三键back、键盘ESC关闭交互操作时,如果注册该回调函数,则不会立刻关闭弹窗。在回调函数中可以通过reason得到阻拦关闭弹窗的操作类型,从而根据原因选择是否能关闭弹窗。当前组件返回的reason中,暂不支持CLOSE_BUTTON的枚举值。
  2. 在onWillDismiss回调中,不能再做onWillDismiss拦截。

参考:

https://developer.huawei.com/consumer/cn/doc/harmonyos-references-V5/ts-methods-alert-dialog-box-V5

2、HarmonyOS TextArea设置maxLines(3),超过3行还可以继续增高?

想要实现,没有输入的时候,默认高度是3行的高度,超过10行输入框的内容就可滚动显示,要怎么修改呢

参考以下代码示例:

复制代码
TextArea({ placeholder: "请输入手机号" })
  .width(300)
  .placeholderColor(Color.Gray)
  .placeholderFont({ size: 20 })
  .fontColor(Color.Black)
  .fontSize(20)
  .backgroundColor(Color.Orange)
  .margin({ top: 35, left: 25 })
  .caretColor(Color.Green)
  .maxLines(3)
  .constraintSize({ maxHeight: 90 })
3、HarmonyOS 动态创建场景中,挂载web组件的自定义节点BuilderNode调用dispose后,原先与该web绑定的webviewController是否也会解绑?

这种情况下不会解绑

4、HarmonyOS icon图标库?

系统有没有自带常用的icon

参考如下链接:https://developer.huawei.com/consumer/cn/design/harmonyos-icon/

![[Pasted image 20250120235112.png]]

5、HarmonyOS 如何手动打开/关闭系统软件盘?

可以通过focusControl.requestFocus控制输入框获焦,组件获焦后会自动弹起软键盘。

  1. 通过让TextInput失焦的方法,让软键盘收起,比如通过让别的组件获焦而使当前组件失焦,可以将焦点转移给其他组件, 例如,提供一个button组件,并设置点击时可获焦,当点击按钮时,可让TextInput失焦,软键盘收起
  2. 使用focusContrl.requestFocus接口使指定组件获取焦点。可参考文档:https://developer.huawei.com/consumer/cn/doc/harmonyos-references-V5/ts-universal-attributes-focus-V5

TextInput:https://developer.huawei.com/consumer/cn/doc/harmonyos-references-V5/ts-basic-components-textinput-V5

注意Text、Image等组件则默认状态为不可获焦。不可获焦状态下,无法触发焦点事件。

复制代码
// xxx.ets
@CustomDialog
struct CustomDialogExample {
  private focusKey = 'name_input'; // 输入框焦点
  controller?: CustomDialogController
  cancel: () => void = () => {
  }
  confirm: () => void = () => {
  }

  // onPageHide(): void {
  //   focusControl.requestFocus(this.focusKey)
  // }

  build() {
    Column() {
      Text('这是自定义弹窗')
        .fontSize(30)
        .height(100)

      Text('昵称')
        .fontSize(20)
        .margin({ top: 10, bottom: 10 })
      // .key(this.focusKey)
      // .id(this.focusKey)

      TextInput({ placeholder: '输入昵称',text:'', })
        .height(60)
        .width('90%')
        .defaultFocus(true)

      Button('测试')
        .key(this.focusKey)


      Button('点我关闭弹窗')
        .onClick(() => {
          if (this.controller != undefined) {
            this.controller.close()
          }
        })
        .margin(20)
    }
  }
}
@Entry
@Component
struct CustomDialogUser {
  dialogController: CustomDialogController | null = new CustomDialogController({
    builder: CustomDialogExample({
      cancel: ()=> { this.onCancel() },
      confirm: ()=> { this.onAccept() }
    }),
    cancel: this.existApp,
    autoCancel: true,
    onWillDismiss:(dismissDialogAction: DismissDialogAction)=> {
      console.info("reason=" + JSON.stringify(dismissDialogAction.reason))
      console.log("dialog onWillDismiss")
      if (dismissDialogAction.reason == DismissReason.PRESS_BACK) {
        dismissDialogAction.dismiss()
      }
      if (dismissDialogAction.reason == DismissReason.TOUCH_OUTSIDE) {
        dismissDialogAction.dismiss()
      }
    },
    alignment: DialogAlignment.Center,
    offset: { dx: 0, dy: -20 },
    customStyle: false,
    cornerRadius: 20,
    width: 300,
    height: 400,
    borderWidth: 1,
    borderStyle: BorderStyle.Dashed,//使用borderStyle属性,需要和borderWidth属性一起使用
    borderColor: Color.Blue,//使用borderColor属性,需要和borderWidth属性一起使用
    backgroundColor: Color.White,
    shadow: ({ radius: 20, color: Color.Grey, offsetX: 50, offsetY: 0}),
  })
  // 在自定义组件即将析构销毁时将dialogController置空
  aboutToDisappear() {
    this.dialogController = null // 将dialogController置空
  }

  onCancel() {
    console.info('Callback when the first button is clicked')
  }

  onAccept() {
    console.info('Callback when the second button is clicked')
  }

  existApp() {
    console.info('Click the callback in the blank area')
  }

  build() {
    Column() {
      Button('click me')
        .onClick(() => {
          if (this.dialogController != null) {
            this.dialogController.open()
          }
        }).backgroundColor(0x317aff)
    }.width('100%').margin({ top: 5 })
  }
}
相关推荐
糕冷小美n5 小时前
elementuivue2表格不覆盖整个表格添加固定属性
前端·javascript·elementui
小哥不太逍遥5 小时前
Technical Report 2024
java·服务器·前端
沐墨染5 小时前
黑词分析与可疑对话挖掘组件的设计与实现
前端·elementui·数据挖掘·数据分析·vue·visual studio code
anOnion5 小时前
构建无障碍组件之Disclosure Pattern
前端·html·交互设计
threerocks6 小时前
前端将死,Agent 永生
前端·人工智能·ai编程
问道飞鱼6 小时前
【前端知识】Vite用法从入门到实战
前端·vite·项目构建
爱上妖精的尾巴6 小时前
8-10 WPS JSA 正则表达式:贪婪匹配
服务器·前端·javascript·正则表达式·wps·jsa
Aliex_git8 小时前
浏览器 API 兼容性解决方案
前端·笔记·学习
独泪了无痕8 小时前
useStorage:本地数据持久化利器
前端·vue.js
程序员林北北8 小时前
【前端进阶之旅】JavaScript 一些常用的简写技巧
开发语言·前端·javascript