What is the preferred way to achieve a nested ListView, or in other words, ListView Widgets that could be included within a scrollable parent?

Imagine a "Reports" page, where a section is an itemized list.

解决方案

If you want to have the inner ListView be scrollable independently of the main scroll view, you should use NestedScrollView. Otherwise, use a CustomScrollView.

Here is some code illustrating the NestedScrollView approach.

RFmZD.gif

import 'package:flutter/material.dart';

void main() {

runApp(new MyApp());

}

class MyApp extends StatelessWidget {

@override

Widget build(BuildContext context) {

return new MaterialApp(

title: 'Flutter Demo',

theme: new ThemeData(

primarySwatch: Colors.blue,

),

home: new MyHomePage(),

);

}

}

class MyHomePage extends StatelessWidget {

@override

Widget build(BuildContext context) {

return new Scaffold(

body: new NestedScrollView(

headerSliverBuilder: (BuildContext context, bool innerBoxIsScrolled) {

return [

new SliverAppBar(

pinned: true,

title: new Text('Flutter Demo'),

),

];

},

body: new Column(

children: [

new FlutterLogo(size: 100.0, colors: Colors.purple),

new Container(

height: 300.0,

child: new ListView.builder(

itemCount: 60,

itemBuilder: (BuildContext context, int index) {

return new Text('Item $index');

},

),

),

new FlutterLogo(size: 100.0, colors: Colors.orange),

],

),

),

);

}

}

Logo

开源鸿蒙跨平台开发社区汇聚开发者与厂商,共建“一次开发,多端部署”的开源生态,致力于降低跨端开发门槛,推动万物智联创新。

更多推荐