我们在上一章回中介绍了"如何管理输入框中的光标"相关的内容,本章回中将介绍 如何让输入键盘不遮挡屏幕.闲话休提,让我们一起Talk Flutter吧。

1. 概念介绍
我们在上一章回中介绍自动管理输入框中的光标时会涉及到输入键盘,它会随着光标出现而弹出,随后会随着光标的隐藏而收起,伴随着输入键盘的弹出和收起,屏幕中的页面也会随着键盘发生滚动,本章回中将介绍如何让输入键盘与屏幕中的页面相互配合使用。
2. 使用方法
我们在接下来的小节中将介绍两种方法来让输入键盘与屏幕中的页面相互配合使用,主要分主动滚动和自动滚动两种方法。
2.1 自动滚动
我们使用的页面由Scaffold组件构成,该组件提供了resizeToAvoidBottomInset属性,它可以控制屏幕是否随着输入键盘的弹出和收起发生滚动,该属性是bool类型,它的默认值为true,表示页面会随着输入键盘的弹出和收起发生滚动,这种设置的好处是输入键盘不会遮挡屏幕,因为屏幕在随着键盘发生滚动。如果我们不想让屏幕发生滚动,那么把resizeToAvoidBottomInset的属性值修改为false就可以。
本文详细介绍了在Flutter移动开发中如何避免输入键盘遮挡屏幕,包括自动滚动和主动滚动两种策略,以及对应的代码示例。通过scaffold的resizeToAvoidBottomInset属性控制页面滚动,或者在TextField外层使用ListView实现内容滚动。
订阅专栏 解锁全文
991

被折叠的 条评论
为什么被折叠?



