Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Flutter ListView shrink wrap - nested ListView

Tags:

flutter

dart

I have a ListView inside a ListView and the inner ListView doesn't know how height it should be so I have to give it a specific height with for example a SizedBox. However the problem is that I actually want the inner ListView to shrink wrap so that it wont scroll/take unnecessary space within the parent ListView.

Thanks in advance

like image 586
Theo Bouwman Avatar asked Dec 05 '22 13:12

Theo Bouwman


1 Answers

This sounds like a good use case for CustomScrollView.

video

import 'dart:async';
import 'package:flutter/material.dart';

void main() {
  runApp(new MaterialApp(
    home: new Scaffold(
      body: new CustomScrollView(
        slivers: [
          new SliverToBoxAdapter(
            child: new Container(height: 100.0, color: Colors.blueAccent),
          ),
          new SliverList(
            delegate: new SliverChildListDelegate(
              new List<Widget>.generate(10, (int index) {
                return new Text(
                  'Item $index',
                  style: new TextStyle(fontSize: 42.0),
                );
              }),
            ),
          ),
          new SliverToBoxAdapter(
            child: new Container(height: 100.0, color: Colors.tealAccent),
          ),
        ],
      ),
    ),
  ));
}
like image 60
Collin Jackson Avatar answered Dec 15 '22 00:12

Collin Jackson