website icon indicating copy to clipboard operation
website copied to clipboard

[PAGE ISSUE]: 'Work with long lists'

Open domesticmouse opened this issue 3 years ago • 0 comments

Page URL

https://docs.flutter.dev/cookbook/lists/long-lists/

Page source

https://github.com/flutter/website/tree/main/src/cookbook/lists/long-lists.md

Describe the problem

The Long list cookbook sample needs to discuss itemExtent and prototypeItem per https://github.com/flutter/website/pull/7404

See discussion in https://api.flutter.dev/flutter/widgets/ListView-class.html for explanation of what is required.

Expected fix

Potential fixed sample code:

import 'package:flutter/material.dart';

void main() {
  runApp(
    MyApp(
      items: List<String>.generate(10000, (i) => 'Item $i'),
    ),
  );
}

class MyApp extends StatelessWidget {
  final List<String> items;

  const MyApp({super.key, required this.items});

  @override
  Widget build(BuildContext context) {
    const title = 'Long List';

    return MaterialApp(
      title: title,
      home: Scaffold(
        appBar: AppBar(
          title: const Text(title),
        ),
        body: ListView.builder(
          itemCount: items.length,
          // Add the following prototypeItem argument
          prototypeItem: ListTile(
            title: Text(items.first),
          ),
          itemBuilder: (context, index) {
            return ListTile(
              title: Text(items[index]),
            );
          },
        ),
      ),
    );
  }
}

Additional context

No response

domesticmouse avatar Jul 31 '22 00:07 domesticmouse