1# @ohos.inputMethodList (Input Method List)
2
3The **inputMethodList** module is oriented to system applications and input method applications. It provides APIs for implementing an input method list. This list displays the default input method subtypes and third-party input methods. Users can use this list to switch from the default input method to another input method.
4
5> **NOTE**
6>
7> The initial APIs of this module are supported since API version 11. Updates will be marked with a superscript to indicate their earliest API version.
8
9## Modules to Import
10
11```ts
12import { inputMethod } from '@kit.IMEKit';
13```
14
15## Child Components
16
17Not supported
18
19## Attributes
20The [universal attributes](../apis-arkui/arkui-ts/ts-universal-attributes-size.md) are not supported.
21
22## InputMethodListDialog
23
24InputMethodListDialog({controller: CustomDialogController, patternOptions?: PatternOptions})
25
26Implements a dialog box showing the input method list.
27
28**Decorator type**: @CustomDialog
29
30**System capability**: SystemCapability.MiscServices.InputMethodFramework
31
32**Parameters**
33
34| Name| Type| Mandatory| Decorator| Description|
35| -------- | -------- | -------- | -------- | -------- |
36| controller | [CustomDialogController](../apis-arkui/arkui-ts/ts-methods-custom-dialog-box.md#customdialogcontroller) | Yes| - | Controller for the dialog box showing the input method list.|
37| patternOptions | [PatternOptions](#patternoptions) | No| - | Input method pattern options (for the default input method only).|
38
39## PatternOptions
40
41**System capability**: SystemCapability.MiscServices.InputMethodFramework
42
43| Name| Type| Read-Only| Optional| Description|
44| -------- | -------- | -------- | -------- | -------- |
45| defaultSelected<sup>11+</sup>  | number | No| Yes| Optional. Default selected pattern.|
46| patterns<sup>11+</sup>    | Array<[Pattern](#pattern)> | No| No| Mandatory. Resource of the pattern option.|
47| action<sup>9+</sup> | function | No| No| Mandatory. Callback invoked when the pattern option changes.|
48
49## Pattern
50
51**System capability**: SystemCapability.MiscServices.InputMethodFramework
52
53| Name| Type| Read-Only| Optional| Description|
54| -------- | -------- | -------- | -------- | -------- |
55| icon<sup>11+</sup>  | [Resource](../apis-arkui/arkui-ts/ts-types.md#resource) | No| No| Mandatory. Default icon.|
56| selectedIcon<sup>11+</sup>    | [Resource](../apis-arkui/arkui-ts/ts-types.md#resource) | No| No| Mandatory. Icon for the selected option.|
57
58##  Events
59
60The [universal events](../apis-arkui/arkui-ts/ts-universal-events-click.md) are not supported.
61
62##  Example
63
64```ts
65import { InputMethodListDialog, Pattern, PatternOptions } from '@kit.IMEKit';
66
67@Entry
68// Configure the component.
69@Component
70export struct settingsItem {
71  @State defaultPattern: number = 1;
72  private oneHandAction: PatternOptions = {
73    defaultSelected: this.defaultPattern,
74    patterns: [
75      {
76        icon: $r('app.media.hand_icon'),
77        selectedIcon: $r('app.media.hand_icon_selected')
78      },
79      {
80        icon: $r('app.media.hand_icon1'),
81        selectedIcon: $r('app.media.hand_icon_selected1')
82      },
83      {
84        icon: $r('app.media.hand_icon2'),
85        selectedIcon: $r('app.media.hand_icon_selected2'),
86      }],
87    action:(index: number)=>{
88      console.info(`pattern is changed, current is ${index}`);
89      this.defaultPattern = index;
90    }
91  };
92  private listController: CustomDialogController = new CustomDialogController({
93    builder: InputMethodListDialog({ patternOptions: this.oneHandAction }),
94    customStyle: true,
95    maskColor: '#00000000'
96  });
97
98  build() {
99    Column() {
100      Flex({ direction: FlexDirection.Column,
101        alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
102        Text("Input Method List").fontSize(20)
103      }
104    }
105    .width("13%")
106    .id('bindInputMethod')
107    .onClick((event?: ClickEvent) => {
108      this.listController.open();
109    })
110  }
111}
112```
113