解决Flutter的ListView嵌套ListView滑动冲突以及无限高度问题

小灰灰 2021-04-19 14:19 1178阅读 0赞

## 关键代码 ##

shrinkWrap: true, //解决无限高度问题
    physics:NeverScrollableScrollPhysics(),//禁用滑动事件
    复制代码

可滑动控件都有这两个属性，给子滑动部件设置上这两个参数，即可办到子ListView跟随父ListView滑动。

## demo代码 ##

import 'package:flutter/material.dart';
    
    void main() => runApp(MyApp());
    
    class MyApp extends StatelessWidget {
      @override
      Widget build(BuildContext context) {
        return MaterialApp(
          title: 'list嵌套',
          home: Scaffold(
              appBar: AppBar(
                title: Text('滚动嵌套'),
              ),
              body: ListView(
                children: <Widget>[
                  ListList(10,Colors.deepPurpleAccent),
                  ListList(20,Colors.red),
                ],
              )),
        );
      }
    }
    
    
    class ListList extends StatelessWidget {
      int length = 0; //列表长度
      Color color;//文字颜色
    
      ListList(this.length, this.color);
    
      @override
      Widget build(BuildContext context) {
        return ListView.separated(
          shrinkWrap: true,
          physics:NeverScrollableScrollPhysics(),
            itemBuilder: (context, index) => Text(
                  'item. $index',
                  style: TextStyle(color: color),
                ),
            separatorBuilder: (context, index) => Divider(
                  color: color,
                ),
            itemCount: length);
      }
    }