`
iaiai
  • 浏览: 2197901 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

【flutter 溢出BUG】键盘上显示bottom overflowed by 104 PIXELS

 
阅读更多
一开始直接使用Scaffold布局,body:new Column  然后结果调出键盘的时候就报这个错了

解决办法是使用SingleChildScrollView包装一下,

原来的是这样:
return new Scaffold(
      appBar: new AppBar(
        title: new Text("搜索"),
      ),
      //使用ScrollView包装一下,否则键盘弹出时会报错空间溢出
      body: new Column( ... )
            ),
          ),
 
    );


修改后:
return new Scaffold(
      appBar: new AppBar(
        title: new Text("搜索"),
      ),
      //使用ScrollView包装一下,否则键盘弹出时会报错空间溢出
      body: new SingleChildScrollView(
            child: new ConstrainedBox(
              constraints: new BoxConstraints(
                minHeight: 120.0,
              ),
              child: new Column(
                mainAxisSize: MainAxisSize.min,
                mainAxisAlignment: MainAxisAlignment.spaceAround,
                children: <Widget>[
                  new Padding(
                    padding: EdgeInsets.fromLTRB(0.0, 40.0, 0.0, 10.0),
                    child:new Text("注意",style: new TextStyle(fontSize: 18.0,color: Colors.orangeAccent),),
                  ),
                  
 
 
                ],
              ),
            ),
          ),
 
    );
分享到:
评论

相关推荐

    flutter bottom overflowed by 50 PIXELS

    在Flutter开发过程中,你可能会遇到一个常见的错误提示:“flutter bottom overflowed by 50 PIXELS”。这个错误意味着你的用户界面(UI)中的某个组件超过了其父容器可容纳的区域,通常发生在试图显示的内容比屏幕...

    flutter弹起键盘页面布局超限问题

    BOTTOM OVERFLOWED BY 17 PIXELS 这是由于页面高度写死导致的, 1.scaffold 根布局添加 resizeToAvoidBottomPadding:false 是否自动调整body属性控件的大小,以避免脚手架底部被覆盖。例如,如果在脚手架上方显示...

    flutter_bottom_navigator.zip

    "flutter_bottom_navigator.zip"这个压缩包文件显然与Flutter的底部导航栏(BottomNavigationBar)有关,这是一种常见的用户界面元素,用于在多个页面间切换。下面将详细探讨BottomNavigationBar以及与其相关的Stack...

    Flutter Text(Flutter文本显示和样式)

    Text Widget用于显示简单样式文本,它包含一些控制文本显示样式的一些属性,类似于Android中的TextView

    flutter_bottom_nav_bar.zip

    FLutter BottomNavigationBar 底部导航 实现切换Page FLutter BottomNavigationBar 底部导航 实现切换Page FLutter BottomNavigationBar 底部导航 实现切换Page FLutter BottomNavigationBar 底部导航 实现切换Page

    支持flutter解析html 可以直接显示html对应的格式样式,转化为flutter Widget.zip

    虽然Flutter本身不直接支持快应用,但开发者可以利用Flutter的跨平台特性,结合快应用的SDK,将Flutter应用打包成快应用格式,以便在华为和其他支持快应用的设备上运行。这通常涉及到一些额外的适配工作,包括处理...

    Flutter集成百度地图api 这个demo是Flutter项目集成百度地图api 显示地图

    在本文中,我们将深入探讨如何在Flutter应用中集成百度地图API,以便显示地图。Flutter是一种由Google开发的开源UI工具包,用于构建高性能、高保真、多平台的应用程序。而百度地图API则是提供地图服务的接口,适用于...

    Flutter Text内容居中显示

    通过设置textAlign属性的值为TextAlign.center可以让Text的内容居中 class _MyHomePageState extends State { @override Widget build(BuildContext context) { return Scaffold( appBar: AppBar( ...

    解决聊天界面,软键盘和表情框切换问题

    在开发聊天应用时,软键盘和表情框的切换是一个常见的挑战。这涉及到用户交互体验的优化,特别是当界面需要在文字输入和表情选择之间流畅转换时。以下是对这个主题的详细探讨: 首先,我们需要理解软键盘是如何影响...

    flutter混合开发解决输入框被键盘遮挡的问题

    这个问题在Android平台上尤为常见,因为Android系统的键盘处理机制与iOS有所不同。本文将详细讲解如何解决这个难题。 首先,我们需要了解Flutter中的Scaffold组件。Scaffold是Flutter构建用户界面的基本构造块,它...

    获取键盘高度

    在iOS开发中,有时我们需要根据键盘的显示和隐藏来调整用户界面,比如移动输入框以避免被键盘遮挡。Objective-C是苹果平台的主要编程语言之一,用于开发iOS应用。本篇将详细介绍如何在Objective-C中动态获取键盘的...

    Flutter 项目:flutter的安装和环境配置

    1. **选择安装位置**:当显示“Select Folder for Flutter SDK”对话框时,选择您希望安装Flutter的位置,默认情况下会显示您常用的安装路径,您可以选择其他位置,例如 `%USERPROFILE%` 或 `C:\dev`。 2. **下载...

    解决Flutter启动页白屏问题,flutter启动显示图片

    启动页是App必不可少的一部分,然而在一个新创建的Flutter项目中,运行发现是没有启动页的。 Android原生的白屏问题可以通过为 Launcher Activity 设置 windowBackground 解决,而 Flutter 也是基于此办法,同时优化...

    flutter中使用基于flutter-sound的flutter-sound-record录音

    在Flutter开发中,录音功能是许多应用程序不可或缺的一部分。Flutter本身并不提供原生的录音API,但开发者可以借助第三方库来实现这一功能。本篇将详细讲解如何在Flutter中使用基于`flutter-sound`的`flutter-sound-...

    收集GitHub上的Flutter开源项目源码_2021_03_20.zip

    6. **响应式框架**:Flutter的布局系统是基于Flexbox模型,支持自适应的界面设计,能够在不同尺寸和方向的屏幕上良好显示。 现在,我们来看看这个压缩包可能包含的内容: - **多个Flutter项目示例**:这些项目可能...

    Flutter 不同终端适配方案

    Flutter 不同终端适配方案 Flutter 是一个跨平台的移动应用框架,能够在 iOS 和 Android 设备上运行。但是,随着不同设备的出现,...选择合适的适配方案可以让您的 Flutter 应用程序在不同终端上都能显示合理的布局。

    Flutter AppBar 工具栏、导航栏

    在Flutter框架中,AppBar是一个非常重要的组件,它用于构建应用程序顶部的导航栏,通常显示应用的标题、返回按钮以及其他的操作选项。这篇文章将深入探讨如何使用AppBar,包括其基本用法、与TabBar的结合、如何移除...

    flutter集成高德地图

    flutter集成高德地图,包含定位,地图显示,触摸地图插入marker,marker自定义图标,地点搜索

    FF下文本溢出的text-overflow完美解决方方案

    2. 使用伪元素和绝对定位:创建一个伪元素(`:before`或`:after`),设置为绝对定位,覆盖在溢出的文本上,模拟省略号效果。这种方法需要精确计算元素的宽度和高度,实现起来相对复杂。 3. 利用`::first-line`伪...

Global site tag (gtag.js) - Google Analytics