【每日学点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 })
  }
}
相关推荐
御承扬1 分钟前
鸿蒙NDK UI 之文本输入框监听
c++·harmonyos·ndk ui
梵得儿SHI1 分钟前
Vue3 实战:从 0 搭建企业级后台管理系统(Router+Pinia+Axios+Element Plus 全整合)
前端·javascript·vue.js·pinia状态管理·项目初始化·页面路由配置·后台首页布局
不能只会打代码3 分钟前
基于Vue 3 + Spring Boot的物联网生鲜品储运系统设计与实现(源码附有详细的文档讲解)
java·前端·vue.js·spring boot·后端·物联网·github
molong9313 分钟前
纯血鸿蒙应用调试证书申请与签名全流程
华为·harmonyos
A923A4 分钟前
【Vue3大事件 | 项目笔记】第三天
前端·vue.js·笔记·vue·前端项目
小白学鸿蒙5 分钟前
OpenHarmony 修改设备厂家名称 、版本号 、设备名称等系统属性
华为·harmonyos
Smoothcloud润云7 分钟前
告别 Selenium:Playwright 现代 Web 自动化测试从入门到实战
前端·人工智能·selenium·测试工具·架构·自动化
Easonmax8 分钟前
ReactNative for OpenHarmony项目鸿蒙化三方库:react-native-linear-gradient — 绚丽的渐变效果实现
react native·react.js·harmonyos
前端小D11 分钟前
ES6 中的 Promise
前端·javascript·es6·promise
光影少年11 分钟前
React和Vue的区别?
前端·vue.js·react.js