1、概 述
我们在鸿蒙开发时，不免会遇到用户输入场景，当用户准备输入时，会涉及到输入法的弹出，我们的界面针对输入法的弹出有两种避让模式：上抬模式、压缩模式。
下面针对输入法的两种避让模式的设置做简单介绍。
2、设置避让模式
设置虚拟键盘抬起时页面的避让模式，API介绍如下：
setKeyboardAvoidMode(value: KeyboardAvoidMode): void获取虚拟键盘抬起时的页面避让模式，API介绍如下：
getKeyboardAvoidMode(): KeyboardAvoidMode其中，KeyboardAvoidMode是一个枚举，默认值为OFFSET上抬模式，定义如下：
OFFSET, // 上抬模式。RESIZE, // 压缩模式。
| KeyboardAvoidMode.RESIZE是压缩Page的大小，Page下设置百分比宽高的组件会跟随Page压缩，直接设置宽高的组件会按设置的固定大小布局。 |
👉🏻 设置为压缩模式
设置虚拟键盘抬起时压缩页面大小为减去键盘的高度。
下面的示例通过调用setKeyboardAvoidMode设置键盘避让模式为RESIZE模式，实现键盘抬起时page的压缩效果。
我们先在EntryAbility中设置避让模式（我们也可以在Page中获取到UIContext动态设置），示例代码如下（第10行）：
// EntryAbility.etsimport { KeyboardAvoidMode } from '@kit.ArkUI';onWindowStageCreate(windowStage: window.WindowStage) {// Main window is created, set main page for this abilityhilog.info(0x0000, 'testTag', '%{public}s', 'Ability onWindowStageCreate');windowStage.loadContent('pages/Index', (err, data) => {windowStage.getMainWindowSync().getUIContext().setKeyboardAvoidMode(KeyboardAvoidMode.RESIZE);if (err.code) {hilog.error(0x0000, 'testTag', 'Failed to load the content. Cause: %{public}s', JSON.stringify(err) ?? '');return;}hilog.info(0x0000, 'testTag', 'Succeeded in loading the content. Data: %{public}s', JSON.stringify(data) ?? '');});}
然后写一个简单的界面，代码如下：
// xxx.ets@Entry@Componentstruct KeyboardAvoidExample1 {build() {Column() {Row().height("30%").width("100%").backgroundColor(Color.Gray)TextArea().width("100%").borderWidth(1)Text("I can see the bottom of the page").width("100%").textAlign(TextAlign.Center).backgroundColor(Color.Pink).layoutWeight(1)}.width('100%').height("100%")}}
默认情况下（键盘未弹出），效果如下：
键盘弹出后，效果如下（底部的粉色区域被压缩）：
👉🏻 设置为上抬模式
下面的示例通过调用setKeyboardAvoidMode设置键盘避让模式为OFFSET模式，实现键盘抬起时page的上抬效果。
当输入光标距离屏幕底部的高度大于键盘高度时，page不会抬起
我们先在EntryAbility中设置避让模式（我们也可以在Page中获取到UIContext动态设置），示例代码如下（第10行）：
// EntryAbility.etsimport { KeyboardAvoidMode } from '@kit.ArkUI';onWindowStageCreate(windowStage: window.WindowStage) {// Main window is created, set main page for this abilityhilog.info(0x0000, 'testTag', '%{public}s', 'Ability onWindowStageCreate');windowStage.loadContent('pages/Index', (err, data) => {windowStage.getMainWindowSync().getUIContext().setKeyboardAvoidMode(KeyboardAvoidMode.OFFSET);if (err.code) {hilog.error(0x0000, 'testTag', 'Failed to load the content. Cause: %{public}s', JSON.stringify(err) ?? '');return;}hilog.info(0x0000, 'testTag', 'Succeeded in loading the content. Data: %{public}s', JSON.stringify(data) ?? '');});}
然后写一个简单的界面（与Resize的一样），代码如下：
// xxx.ets@Entry@Componentstruct KeyboardAvoidExample2 {build() {Column() {Row().height("30%").width("100%").backgroundColor(Color.Gray)TextArea().width("100%").borderWidth(1)Text("I can see the bottom of the page").width("100%").textAlign(TextAlign.Center).backgroundColor(Color.Pink).layoutWeight(1)}.width('100%').height("100%")}}
默认情况下（键盘未弹出），效果如下：
键盘弹出后，效果如下（底部粉色区域的文字被键盘遮挡，同时，由于底部粉色区域高于键盘，所以界面不会因为键盘弹出而发生布局变化）：
