鸿蒙Harmony应用开发—ArkTS声明式开发(组件快捷键事件)

开发者可以设置组件的自定义组合键,组合键的行为与click行为一致,组件在未获得焦点状态下也可以响应自定义组合键,每个组件可以设置多个组合键。

说明:

从API Version 10开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。

keyboardShortcut

keyboardShortcut(value: string | FunctionKey, keys: Array<ModifierKey>, action?: () => void)

设置组件的自定义组合键。

系统能力: SystemCapability.ArkUI.ArkUI.Full

参数:

参数名 参数类型 必填 参数描述
value string | FunctionKey 热键的单个字符(可以通过键盘输入的字符)或FunctionKey
keys Array<ModifierKey> 热键组合。
action () => void 组合快捷键触发成功后的自定义事件回调。

ModifierKey

名称 描述
CTRL 表示键盘上Ctrl键。
SHIFT 表示键盘上Shift键。
ALT 表示键盘上Alt键。

FunctionKey

名称 描述
ESC 表示键盘上ESC功能键。
F1 表示键盘上F1功能键。
F2 表示键盘上F2功能键。
F3 表示键盘上F3功能键。
F4 表示键盘上F4功能键。
F5 表示键盘上F5功能键。
F6 表示键盘上F6功能键。
F7 表示键盘上F7功能键。
F8 表示键盘上F8功能键。
F9 表示键盘上F9功能键。
F10 表示键盘上F10功能键。
F11 表示键盘上F11功能键。
F12 表示键盘上F12功能键。

快捷键使用注意事项

场景 快捷键处理逻辑 例子
所有支持onClick事件的组件 支持自定义组合键
自定义组合键要求 控制键Ctrl、Shift、Alt及它们的组合加上其它可输入字符按键 Button('button1').keyboardShortcut('a',[ModifierKey.CTRL])
多个不同组件设置相同组合键 只响应结点树上的第一个组件,其它组件不响应快捷键。 Button('button1').keyboardShortcut('a',[ModifierKey.CTRL]) Button('button2').keyboardShortcut('a',[ModifierKey.CTRL])
无论组件是否获得焦点 只要窗口获焦快捷键就会响应
绑定单个快捷键时候,通过keyboardShortcut接口value值或者是keys值或两者都是空的情况下。 绑定多个快捷键的时候无法取消快捷键。 取消快捷键的设置 Button('button1').keyboardShortcut('',[ModifierKey.CTRL]) Button('button2').keyboardShortcut('a',[l]) Button('button3').keyboardShortcut('',[])
独立pipeline子窗口、主窗口共存的情况下 获焦的窗口响应快捷键
keyboardShortcut接口中的keys命令中ctrl、shift、alt 不区分左右键都响应 Button('button1').keyboardShortcut('a',[ModifierKey.CTRL, ModifierKey.ALT])
keyboardShortcut接口中的value单个字符 不区分大小写都响应 Button('button1').keyboardShortcut('a',[ModifierKey.CTRL]) Button('button2').keyboardShortcut('A',[ModifierKey.CTRL])
快捷键的响应 所有快捷键down的状态下响应、且连续响应
隐藏组件 响应快捷键
disable状态组件 不响应快捷键
1. 组件的组合键(包括系统预定义快捷键)相同时。 2. 接口参数value有多个字符时。 3. 接口参数keys有重复的控制键时。 这几种情况不绑定组合键, 先前绑定的组合键仍然有效 Button('button1').keyboardShortcut('c',[ModifierKey.CTRL]) Button('button2').keyboardShortcut('ab',[ModifierKey.CTRL]) Button('button3').keyboardShortcut('ab',[ModifierKey.CTRL,ModifierKey.CTRL])

系统已有组合键

快捷键 组件
Ctrl + C ImageTextInputTextArea
Ctrl+ A ImageTextInputTextArea
Ctrl+ V ImageTextInputTextArea
Ctrl+ X ImageTextInputTextArea
Shift + 方向键 ImageTextInputTextArea
Ctrl+ Shift+ Z ImageTextInputTextArea
Ctrl+ Z ImageTextInputTextArea
Ctrl+ Y ImageTextInputTextArea
方向键、回车键 ImageTextInputTextArea
TAB键 ImageTextInputTextArea

示例

设置组件的快捷键,同时按控制键+对应的字符可以触发组件响应快捷键,并触发onClick事件或自定义事件。

// xxx.ets
@Entry
@Component
struct Index {
  @State message: string = 'Hello World'

  build() {
    Row() {
      Column() {
        Text(this.message)
        Button("Test short cut 1").onClick((event) => {
          this.message = "I clicked Button 1";
          console.log("I clicked 1");
        }).keyboardShortcut('.', [ModifierKey.SHIFT, ModifierKey.CTRL, ModifierKey.ALT])
          .onKeyEvent((event)=>{
            console.log("event.keyCode: " + JSON.stringify(event));
          })
        Button("Test short cut 2").onClick((event) => {
          this.message = "I clicked Button 2";
          console.log("I clicked 2");
        }).keyboardShortcut('1', [ModifierKey.CTRL])
        Button("Test short cut 3").onClick((event) => {
          this.message = "I clicked Button 3";
          console.log("I clicked 3");
        }).keyboardShortcut('A', [ModifierKey.SHIFT])
        Button("Test short cut 4").onClick((event) => {
          this.message = "I clicked Button 4";
          console.log("I clicked 4");
        }).keyboardShortcut(FunctionKey.F5, [], () => {
          this.message = "I clicked Button 4";
          console.log("I clicked user callback.");
        }).keyboardShortcut(FunctionKey.F3, [])
      }
      .width('100%')
    }
    .height('100%')
  }
}

最后,有很多小伙伴不知道学习哪些鸿蒙开发技术?不知道需要重点掌握哪些鸿蒙应用开发知识点?而且学习时频繁踩坑,最终浪费大量时间。所以有一份实用的鸿蒙(Harmony NEXT)资料用来跟着学习是非常有必要的。

这份鸿蒙(Harmony NEXT)资料包含了鸿蒙开发必掌握的核心知识要点,内容包含了ArkTS、ArkUI开发组件、Stage模型、多端部署、分布式应用开发、音频、视频、WebGL、OpenHarmony **多媒体技术、Napi组件、OpenHarmony内核、Harmony南向开发、鸿蒙项目实战等等)鸿蒙(Harmony NEXT)**技术知识点。

希望这一份鸿蒙学习资料能够给大家带来帮助,有需要的小伙伴自行领取,限时开源,先到先得~无套路领取!!

获取这份完整版高清学习路线,请点击→纯血版全套鸿蒙HarmonyOS学习资料****

鸿蒙(Harmony NEXT)最新学习路线

  • HarmonOS基础技能
  • HarmonOS就业必备技能
  • HarmonOS多媒体技术
  • 鸿蒙NaPi组件进阶
  • HarmonOS高级技能
  • 初识HarmonOS内核
  • 实战就业级设备开发

有了路线图,怎么能没有学习资料呢,小编也准备了一份联合鸿蒙官方发布笔记整理收纳的一套系统性的鸿蒙(OpenHarmony )学习手册(共计1236页)鸿蒙(OpenHarmony )开发入门教学视频 ,内容包含:ArkTS、ArkUI、Web开发、应用模型、资源分类...等知识点。

获取以上完整版高清学习路线,请点击→纯血版全套鸿蒙HarmonyOS学习资料****

《鸿蒙 (OpenHarmony)开发入门教学视频》

《鸿蒙生态应用开发V2.0白皮书》

《鸿蒙 (OpenHarmony)开发基础到实战手册》

OpenHarmony北向、南向开发环境搭建

《鸿蒙开发基础》

  • ArkTS语言
  • 安装DevEco Studio
  • 运用你的第一个ArkTS应用
  • ArkUI声明式UI开发
  • .......

《鸿蒙开发进阶》

  • Stage模型入门
  • 网络管理
  • 数据管理
  • 电话服务
  • 分布式应用开发
  • 通知与窗口管理
  • 多媒体技术
  • 安全技能
  • 任务管理
  • WebGL
  • 国际化开发
  • 应用测试
  • DFX面向未来设计
  • 鸿蒙系统移植和裁剪定制
  • ......

《鸿蒙进阶实战》

  • ArkTS实践
  • UIAbility应用
  • 网络案例
  • ......

获取以上完整鸿蒙HarmonyOS学习资料,请点击→纯血版全套鸿蒙HarmonyOS学习资料****

总结

总的来说,华为鸿蒙不再兼容安卓,对中年程序员来说是一个挑战,也是一个机会。只有积极应对变化,不断学习和提升自己,他们才能在这个变革的时代中立于不败之地。

相关推荐
互联网时光机2 小时前
HarmonyOS第一课 04 应用程序框架基础-习题分析
鸿蒙
Android技术栈2 小时前
鸿蒙开发(NEXT/API 12)【请求用户授权】手机侧应用开发
harmonyos·鸿蒙·鸿蒙系统·openharmony·硬件
风槐啊3 小时前
六、Java 基础语法(下)
android·java·开发语言
皮皮虾在睡觉4 小时前
数据库基础04
android·数据库
彭于晏6896 小时前
Android高级控件
android·java·android-studio
666xiaoniuzi11 小时前
深入理解 C 语言中的内存操作函数:memcpy、memmove、memset 和 memcmp
android·c语言·数据库
Android技术栈14 小时前
鸿蒙开发(NEXT/API 12)【管理应用与Wear Engine服务的连接状态】手机侧应用开发
服务器·harmonyos·鸿蒙·鸿蒙系统·openharmony
义一14 小时前
华为---MUX VLAN简介及示例配置
华为