HarmonyOS 鸿蒙Next 页面底部输入框会顶起视图到状态栏

页面构成： titile（顶部）+ List（中间）+ 输入框（底部）

1.在点击输入框时，软键盘会将页面整体顶起来，丢失title，并侵入到状态栏

2.将 顶部title 设置 安全区域后，title 是固定了，但还是侵入到状态栏

如何设置，视图不侵入 状态栏？

代码：

@Entry
@Component
export default struct TestKeyBoardPage {

@State text: string = ''
@State list: number[] = []
controller: TextInputController = new TextInputController()

aboutToAppear() {
for (let index = 0; index < 20; index++) {
this.list.push(index)
}
}

@Builder
TabHeader(text = '') {
Text(text).fontSize(30).fontColor(Color.Red).expandSafeArea([SafeAreaType.KEYBOARD])
}

build() {
Flex({ direction: FlexDirection.Column }) {
Row() {
Text("顶部标题栏内容,我不能被顶出去")
}
.width('100%')
.height(50)
.backgroundColor(Color.Pink)
.padding({ left: 20, right: 20 })
.zIndex(99)
.expandSafeArea([SafeAreaType.KEYBOARD]) // 配置键盘弹出安全区域
Tabs() {
TabContent() {
List({ space: 20 }) {
ForEach(this.list, (item: number) => {
ListItem() {
Row() {
Text('我要正常滚动__测试数据' + item).fontSize(20)
}
}
}, (i: string) => i)
}.width('100%').layoutWeight(1) // 设置组件占比权重
}.tabBar(this.TabHeader('消息'))

TabContent() {
Column() {
}.layoutWeight(1) // 设置组件占比权重
}.tabBar(this.TabHeader('云空间'))
}
.width('100%')
.layoutWeight(1) // 设置组件占比权重
.backgroundColor("#f1f2f6")
.flexGrow(1)

Row() {
TextInput({ text: this.text, placeholder: '底部输入框', controller: this.controller })
}
.width('100%')
.height(50)
.backgroundColor("#dfe4ea")
.padding({ left: 20, right: 20 })
}.width("100%")
}
}