【自学Flutter】20.2 ListView.builder 的使用

20.2 ListView.builder 的使用

1.源代码
import 'package:flutter/material.dart';

void main () => runApp(MyApp());

class MyApp extends StatefulWidget {
  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
        home: Scaffold(
          body: Scrollbar(
            child: Center(
              child: ListView.builder(
                itemCount: 50,
                itemExtent: 50.0,
                itemBuilder: (BuildContext context, int index){
                  return ListTile(title: Text("我是列表$index"),);
                },
              )
            ),
          ),
        )
    );
  }
}

2.解释源代码
import 'package:flutter/material.dart';

void main () => runApp(MyApp());

class MyApp extends StatefulWidget {
  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
        home: Scaffold(
          body: Scrollbar(
            child: Center(
              child: ListView.builder(
                //列表数量
                itemCount: 50,
                //列表高度
                itemExtent: 50.0,
                //动态生成
                itemBuilder: (BuildContext context, int index){
                  return ListTile(title: Text("我是列表$index"),);
                },
              )
            ),
          ),
        )
    );
  }
}

3.效果图

【自学Flutter】20.2 ListView.builder 的使用_第1张图片

你可能感兴趣的:(自学Flutter,Flutter,Android)