1# 组件快捷键事件 2 3开发者可以设置组件的自定义组合键，组合键的行为与click行为一致，组件在未获得焦点状态下也可以响应自定义组合键，每个组件可以设置多个组合键。 4 5> **说明：** 6> 7> 从API Version 10开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。 8 9## 接口 10 11keyboardShortcut(value: string | [FunctionKey], keys: Array<[ModifierKey]>) 12 13**参数：** 14 15| 参数名 | 参数类型 | 必填 | 参数描述 | 16| ----- | ------------------------------------- | ---- | ---------------------------------------- | 17| value | string \| [FunctionKey](#functionkey) | 是 | 热键的单个字符（可以通过键盘输入的字符）或[FunctionKey](#functionkey)。<br/> | 18| keys | Array<[ModifierKey](#modifierkey)> | 是 | 热键组合。<br/> | 19 20## ModifierKey 21 22| 名称 | 描述 | 23| ----- | ------------ | 24| CTRL | 表示键盘上Ctrl键。 | 25| SHIFT | 表示键盘上Shift键。 | 26| ALT | 表示键盘上Alt键。 | 27 28## FunctionKey 29 30| 名称 | 描述 | 31| ---- | ------------ | 32| ESC | 表示键盘上ESC功能键。 | 33| F1 | 表示键盘上F1功能键。 | 34| F2 | 表示键盘上F2功能键。 | 35| F3 | 表示键盘上F3功能键。 | 36| F4 | 表示键盘上F4功能键。 | 37| F5 | 表示键盘上F5功能键。 | 38| F6 | 表示键盘上F6功能键。 | 39| F7 | 表示键盘上F7功能键。 | 40| F8 | 表示键盘上F8功能键。 | 41| F9 | 表示键盘上F9功能键。 | 42| F10 | 表示键盘上F10功能键。 | 43| F11 | 表示键盘上F11功能键。 | 44| F12 | 表示键盘上F12功能键。 | 45 46## 快捷键使用注意事项 47 48| 场景 | 快捷键处理逻辑 | 例子 | 49| ---------------------------------------- | ---------------------------------- | ---------------------------------------- | 50| 所有支持onClick事件的组件 | 支持自定义组合键 | 无 | 51| 自定义组合键要求 | 控制键Ctrl，Shift，Alt及它们的组合加上其它可输入字符按键 | Button('button1').keyboardShortcut('a',[ModifierKey.CTRL]) | 52| 多个不同组件设置相同组合键 | 只响应结点树上的第一个组件、其它组件不响应快捷键。 | Button('button1').keyboardShortcut('a',[ModifierKey.CTRL])<br />Button('button2').keyboardShortcut('a',[ModifierKey.CTRL]) | 53| 无论组件是否获得焦点 | 只要窗口获焦快捷键就会响应 | 无 | 54| 绑定单个快捷键时候，通过keyboardShortcut接口value值或者是keys值或两者都是空的情况下。<br />绑定多个快捷键的时候无法取消快捷键。 | 取消快捷键的设置 | Button('button1').keyboardShortcut('',[ModifierKey.CTRL])<br />Button('button2').keyboardShortcut('a',[l])<br />Button('button3').keyboardShortcut('',[]) | 55| 独立pipeline子窗口、主窗口共存的情况下 | 获焦的窗口响应快捷键 | 无 | 56| keyboardShortcut接口中的keys命令中ctrl、shift、alt | 不区分左右键都响应 | Button('button1').keyboardShortcut('a',[ModifierKey.CTRL, ModifierKey.ALT]) | 57| keyboardShortcut接口中的value单个字符 | 不区分大小写都响应 | Button('button1').keyboardShortcut('a',[ModifierKey.CTRL])<br />Button('button2').keyboardShortcut('A',[ModifierKey.CTRL]) | 58| 快捷键的响应 | 所有快捷键down的状态下响应、且连续响应 | 无 | 59| 隐藏组件<br /> | 响应快捷键 | 无 | 60| disable状态组件 | 不响应快捷键 | 无 | 61| 1. 组件的组合键(包括系统预定义快捷键)相同时。<br />2. 接口参数value有多个字符时。<br />3. 接口参数keys有重复的控制键时。 | 这几种情况不绑定组合键, 先前绑定的组合键仍然有效 | Button('button1').keyboardShortcut('c',[ModifierKey.CTRL])<br />Button('button2').keyboardShortcut('ab',[ModifierKey.CTRL])<br />Button('button3').keyboardShortcut('ab',[ModifierKey.CTRL,ModifierKey.CTRL]) | 62 63## 系统已有组合键 64 65| 快捷键 | 组件 | 66| -------------- | ---------------------------------------- | 67| Ctrl + C | [Image](ts-basic-components-image.md)、[TextInput](ts-basic-components-textinput.md)、[TextArea](ts-basic-components-textarea.md) | 68| Ctrl+ A | [TextInput](ts-basic-components-textinput.md)、[TextArea](ts-basic-components-textarea.md) | 69| Ctrl+ V | [TextInput](ts-basic-components-textinput.md)、[TextArea](ts-basic-components-textarea.md) | 70| Ctrl+ X | [TextInput](ts-basic-components-textinput.md)、[TextArea](ts-basic-components-textarea.md) | 71| Shift + 方向键 | [TextInput](ts-basic-components-textinput.md)、[TextArea](ts-basic-components-textarea.md) | 72| Ctrl+ Shift+ Z | [TextInput](ts-basic-components-textinput.md)、[TextArea](ts-basic-components-textarea.md) | 73| Ctrl+ Z | [TextInput](ts-basic-components-textinput.md)、[TextArea](ts-basic-components-textarea.md) | 74| Ctrl+ Y | [TextInput](ts-basic-components-textinput.md)、[TextArea](ts-basic-components-textarea.md) | 75| 方向键、回车键 | [TextInput](ts-basic-components-textinput.md)、[TextArea](ts-basic-components-textarea.md) | 76| TAB键 | [TextInput](ts-basic-components-textinput.md)、[TextArea](ts-basic-components-textarea.md) | 77 78## 示例 79 80设置组件的快捷键，同时按控制键+对应的字符可以触发组件响应快捷键，并触发onClick事件或自定义事件。 81 82```ts 83// xxx.ets 84@Entry 85@Component 86struct Index { 87 @State message: string = 'Hello World' 88 89 build() { 90 Row() { 91 Column() { 92 Text(this.message) 93 Button("Test short cut 1").onClick((event) => { 94 this.message = "I clicked Button 1"; 95 console.log("I clicked 1"); 96 }).keyboardShortcut('.', [ModifierKey.SHIFT, ModifierKey.CTRL, ModifierKey.ALT]) 97 .onKeyEvent((event)=>{ 98 console.log("event.keyCode: " + JSON.stringify(event)); 99 }) 100 Button("Test short cut 2").onClick((event) => { 101 this.message = "I clicked Button 2"; 102 console.log("I clicked 2"); 103 }).keyboardShortcut('1', [ModifierKey.CTRL]) 104 Button("Test short cut 3").onClick((event) => { 105 this.message = "I clicked Button 3"; 106 console.log("I clicked 3"); 107 }).keyboardShortcut('A', [ModifierKey.SHIFT]) 108 Button("Test short cut 4").onClick((event) => { 109 this.message = "I clicked Button 4"; 110 console.log("I clicked 4"); 111 }).keyboardShortcut(FunctionKey.F5, [], () => { 112 this.message = "I clicked Button 4"; 113 console.log("I clicked user callback."); 114 }).keyboardShortcut(FunctionKey.F3, []) 115 } 116 .width('100%') 117 } 118 .height('100%') 119 } 120} 121``` 122