SingleChildScrollView 嵌套 Expanded

最新推荐文章于 2024-04-30 23:22:35 发布
最新推荐文章于 2024-04-30 23:22:35 发布
阅读量1.3k 收藏 1
点赞数 1
文章标签： flutter
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/tianhongfan10106/article/details/124613245
版权

问题：SingleChildScrollView 嵌套 Expanded，导致页面内容不显示

解决方案：使用ConstrainedBox，加个约束

SingleChildScrollView(
    child: ConstrainedBox(
        constraints: BoxConstraints(maxHeight: Screen.height - 100),
        child: _getContentWidget())));

Widget _getContentWidget() {
  return Column(
    children: <Widget>[
       Expanded(
          child: Container(
            padding: EdgeInsets.only(bottom: 15, left: 12, right: 12),
            alignment: Alignment.bottomCenter,
            child: Text(
              "审核大约需要3天",
              style: TextStyle(
                  color: CommercialColors.color_999999, fontSize: 15),
    ),
  ),
),
])；
老仙儿
关注
Flutter使用可滚动组件（SingleChildScrollView,ListView,GridView）时的典型错误
m0_37828249的博客
01-31 3332
话不多说，直接丢报错信息，看看自己是否遇到： The following assertion was thrown during performLayout(): RenderFlex children have non-zero flex but incoming height constraints are unbounded. When a column is in a parent th...
Flutter Listview.builder嵌套出现的问题
徐代龙的技术专栏
07-09 3030
场景描述 在一个SingleChildScrollView中嵌套ListView出现的情况，里面的ListView可以滑动，但是外面的父view不跟着动，这时候我们需要对ListView的相关属性进行设置。 设置 listview设置： ListView.builder( itemBuilder: _buildLeftItem, shrink...
SingleChildScrollView 嵌套 Expanded
u013297881的专栏
03-18 2435
SingleChildScrollView( child: ConstrainedBox( constraints: BoxConstraints(maxHeight: MediaQuery.of(context).size.height), child: Column( mainAxisAlig...
ScrollView，嵌套ListView,ListView并同时嵌套GridView
06-20
ScrollView，嵌套ListView,ListView并同时嵌套GridView
Expanded, SingleChildScrollView, CustomScrollView, container, height, width
weixin_30702413的博客
04-30 331
SingleChildScrollView, CustomScrollView, container, init: double.inifinity. then use Expanded to constraint height, width both horizontal, and vertical. 转载于:https://www.cnblogs.c...
Flutter-问题：Wrap a column with an Expand in a SingleChildScrollView
cnting
08-01 1572
首先来看下面例子，项目中需要实现如图功能，解析一下需求： 【确定】按钮需要放在页面底部 页面需要包裹在SingleChildScrollView中，当键盘出现时，系统才会滚动布局避免TextField被遮挡 登录按钮不会被顶到键盘上方（下面几种方案都没实现这需求，有知道解决方案的大大回复下
Flutter使用可滚动组件（SingleChildScrollView,ListView,GridView）时的典型错误二
m0_37828249的博客
02-02 3840
当一个可滚动组件中嵌套另一个可滚动组件时，会抛出如下错误信息： The following assertion was thrown during performResize(): Vertical viewport was given unbounded height. Viewports expand in the scrolling direction to fill their cont...
Flutter基础：布局出了问题，为什么我的Column用不好？
m0_37828249的博客
02-03 4713
满怀信心使用Column进行布局，总会遇到各种各样异常，有的直接报错，有的表现形式和预想的不同。下面直接分场景归纳并解决Column中的问题（大多数布局问题都有Column这货参与）： 1.Column中嵌套Column，外层Column直接撑满屏幕，而内层Column只是刚好为子元素高度（子元素没有Flexible类型组件） 2.Column中嵌套Column，内层Column有Expand...
Flutter布局分析
2401_84537540的博客
04-30 864
这里我希望可以帮助到大家提升进阶。Android学习PDF+架构视频+面试文档+源码笔记高级架构技术进阶脑图、Android开发面试专题资料，高级进阶架构资料这几块的内容。非常适合近期有面试和想在技术道路上继续精进的朋友。喜欢本文的话，不妨给我点个小赞、评论区留言或者转发支持一下呗~网上学习资料一大堆，但如果学到的知识不成体系，遇到问题时只是浅尝辄止，不再深入研究，那么很难做到真正的技术提升。需要这份系统化学习资料的朋友，可以戳这里获取一个人可以走的很快，但一群人才能走的更远！
Flutter中Column嵌套GridView不显示问题解决
weixin_44408818的博客
11-17 1678
【代码】Flutter中Column嵌套GridView不显示问题解决。
flutter开发中遇到的问题总结
Awna的博客
12-18 4152
文章目录flutter Error: Could not resolve the package ‘characters‘ in ‘package:characters/characters.dart‘.背景：解决过程：解决方法：两个Contain嵌套，都设置尺寸，内部的Contain为什么尺寸不起作用显示结果如下解决办法如上面的页面如何阻止事件冒泡充满屏幕遇到可用区域显示不下使用fitteedBox多设备适配（推荐）去掉安卓状态栏半透明解决ListView/GridView作为Column的子Widget
flutter开发踩坑记之 SingleChildScrollView
weixin_45020541的博客
02-26 2943
flutter开发踩坑记之 SingleChildScrollView 1. 问题描述 下拉刷新时，ios端头部与下面的内容分离，出现大量空白，Android端正常（如图。注解：之所以将上面黄色区域分成两块是因为此页面的头部为固定的 下面的内容与样式可通过后台单独配置，所以没有包裹在一个盒子里，空白下面的内容全部是放在SingleChildScrollView中） 2.问题原因 SingleChildScrollView中有一个属性：physics，此属性接受一个ScrollPhysics类型的对象，它决
Flutter 踩坑记录： Expanded 会尽可能占据剩余空间，导致在滑动时超出 ListView 范围的部分也被渲染
paradox212的博客
07-07 1041
旧版代码的奇怪问题当 listView 滑动的时候，滑出 listView的范围之后，按钮的 文本Perman 会立即消失，而背景色的图片 image: AssetImage("assets/pinkBtn.png")却没有消失，这个现象可能是因为在 Column 内部，ListView.builder 是在一个 Expanded 中，而 Expanded 会尽可能占据剩余空间，导致在滑动时超出 ListView 范围的部分也被渲染。
Flutter小技巧总结之SingleChildScrollView里面嵌套Column和ListView时候,ListView不显示
fuweng886的博客
12-01 4782
一，问题场景　　 　　shrinkWrap多用于嵌套listView中 内容大小不确定 比如 垂直布局中 先后放入文字 listView （需要Expend包裹否则无法显示无穷大高度 但是需要确定listview高度 shrinkWrap使用内容适配不会有这样的影响） 二，解决办法 　　设置ListView/GridView属性shrinkWrap: true 三，示例 ListView( shrinkWrap: true,//内容适配 children... ) ...
Flutter SingleChildScrollView 嵌套 ListView 或者其他可以滚动weiget 滑动滚动冲突问题
trues的博客
01-01 1万+
场景 当我们使用SingleChildScrollView 整个布局包含了ListView 滑动时会产生冲突 滚动卡顿，不流畅 原因 SingleChildScrollView 和 ListView 都有滚动属性physics 他们默认是都是可以滚动的 解决方式 禁用 ListView 的滚动physics 保留 SingleChildScrollView 的滚动 Listview 执行 phys...
flutter SingleChildScrollView的使用
senkai123的博客
11-04 2587
SingleChildScrollView相当于安卓的ScrollView，SizedBox是一个能指定宽高的盒子，一般默认占据主轴空间 import 'package:flutter/material.dart'; class Demo1 extends StatelessWidget{ @override Widget build(BuildContext context) { ...
flutter控件Flexible和 Expanded的区别
热门推荐
chunchun1230的博客
09-06 4万+
Flexible和 Expanded的区别是： Flexible是一个控制Row、Column、Flex等子组件如何布局的组件。 Flexible组件可以使Row、Column、Flex等子组件在主轴方向有填充可用空间的能力(例如，Row在水平方向，Column在垂直方向)，但是它与Expanded组件不同，它不强制子组件填充可用空间。 Flexible组件必须是Row、Column、Fle...
Flutter：Slivers大家族，让滑动视图的组合变得很简单！
weixin_33674976的博客
10-23 2067
文中所有示例代码请点击：gitee.com/yumi0629/Fl…   今天呢，我小拉面主要想给大家讲一讲Flutter中的Slivers大家族的使用场景和方法。开发过列表布局的同学们应该对Slivers系列的控件不陌生，或多或少都用过这个库中的控件，来解决复杂的滑动嵌套布局。   比如之前讲Hero的时候提到的下面这个界面，使用普通的GridView的话是没法实现的，我们选择使用CustomS...
flutter 使用SingleChildScrollView嵌套listview 监听listview滑动到顶部或底部时让外部的SingleChildScrollView继续滑动
最新发布
11-12
在 Flutter 中，如果你想要在一个 `Scaffold` 或者 `SingleChildScrollView` 内部嵌套一个 `ListView` 并监听列表滚动到顶部或底部时，同时允许外部的 `SingleChildScrollView` 继续滚动，你可以通过监听 `ScrollController` 的状态来实现。首先，你需要为 `ListView` 和 `SingleChildScrollView` 分别设置控制器，并确保它们关联起来。 这里是一个简单的步骤说明： 1. **创建 `ScrollControllers`**： - 对于 `ListView`，创建一个 `ScrollController` 对象并将其绑定到 `ListView` 上。 ```dart final listController = ScrollController(); @override Widget build(BuildContext context) { return SingleChildScrollView( controller: _scrollController, // 这里的 _scrollController 可能是你已经有的，如果没有可以初始化它 child: ListView.builder(..., controller: listController), ); } ``` 2. **监听滚动事件**： - 当 `ListView` 的滚动位置改变时，检查是否达到了顶部或底部。例如，当 `listController.position.pixels == 0` 表示顶部，而 `listController.position.pixels >= listController.position.maxScrollExtent` 表示底部。 ```dart listController.addListener(() { if (listController.position.pixels == 0) { // 列表滚到了顶部 handleListTop(); } else if (listController.position.pixels >= listController.position.maxScrollExtent) { // 列表滚到了底部 handleListBottom(); } }); ``` 3. **处理动作**： - `handleListTop()` 和 `handleListBottom()` 函数里，你需要阻止 `listController` 的滚动，然后更新外部 `SingleChildScrollView` 的滚动位置，让它继续滚动： ```dart void handleListTop() { listController.stop(); // 停止 `listController` setState(() { // 更新外部 `_scrollController` 的位置 _scrollController.animateTo(0); }); } void handleListBottom() { listController.stop(); // 停止 `listController` setState(() { // 更新外部 `_scrollController` 的位置 _scrollController.animateTo(listController.position.maxScrollExtent); }); } ``` 4. **添加动画效果**（可选）： - 如果你想给滚动过程加上平滑的动画效果，可以在 `animateTo()` 方法中传递参数，比如 `Duration(milliseconds: 500)`。 记得确保 `_scrollController` 是一个全局变量或者已经初始化过了，因为你在外部需要访问到它的状态。这只是一个基础的实现，实际应用中可能还需要考虑一些其他因素，如异常处理、动画缓存等。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值