如何在具有颤动的可滚动视图中使用具有可变高度内容的TabView?

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了如何在具有颤动的可滚动视图中使用具有可变高度内容的TabView?相关的知识,希望对你有一定的参考价值。

我有一个TabBarTabBarView嵌套在Block。这是因为TabBarView内部的内容是动态的,并且直到运行时才知道内容的高度。

我无法将Block嵌套在TabBarView中,因为TabBar之前的内容应该与TabBarView内容一起滚动。

图:

Layout Diagram

码:

new DefaultTabController(
  length: 3,
  child: new Block(
    children: [
      new Container(
        height: 200.0,
        decoration: new BoxDecoration(
          backgroundColor: Colors.blue[500],
        ),
      ),
      new TabBar(
        tabs: <Widget>[
          new Tab(text: '1'),
          new Tab(text: '2'),
          new Tab(text: '3'),
        ],
      ),
      new TabBarView(
        children: [
          new Text('one'),
          new Text('two'),
          new Text('three'),
        ],
      ),
    ],
  )
);

但是,TabBarView的视口不受约束,需要具有有界高度约束的祖先窗口小部件。不幸的是,Block不具有有界高度,因为它具有可滚动性。

运行布局时收到此错误:

══╡ EXCEPTION CAUGHT BY RENDERING LIBRARY    ╞═════════════════════════════════════════════════════════
I/flutter (28715): The following assertion was thrown during   performLayout():
I/flutter (28715): RenderList object was given an infinite size during layout.
I/flutter (28715): This probably means that it is a render object that tries to be as big as possible, but it was put
I/flutter (28715): inside another render object that allows its children to pick their own size.
I/flutter (28715): The nearest ancestor providing an unbounded height constraint is: ...

关于如何最好地接近这个的任何想法?

答案

通过当前作为https://github.com/flutter/flutter/projects/3的一部分登陆的重构滚动“sliver”代码,这将变得非常容易。

SliverList https://docs.flutter.io/flutter/widgets/SliverList-class.html旨在实现这种组合,并且应该在大约两周内准备好一般使用。

以上是关于如何在具有颤动的可滚动视图中使用具有可变高度内容的TabView?的主要内容,如果未能解决你的问题,请参考以下文章

当项目具有动态高度时,如何根据设备方向创建动态颤动网格布局

UITableView 中具有动态高度的可伸缩标题视图

如何使用 UITableView 创建包含 UIWebView 的可滚动视图

Listview滚动到具有可变高度的小部件

如何在 Swift IOS 中创建具有多个堆栈视图的可滚动堆栈视图

使 NSView 具有适合内容的固定宽度和可变高度