flutter基础之ListView

2019-02-12  本文已影响3人  iCloudEnd

数据列表显示是移动应用最基础的功能,flutter提供ListView Widget来帮我们轻松构建数据列表。

ListView 基础格式

ListView(
  children: <Widget>[
    ListTile(
      leading: Icon(Icons.map),
      title: Text('Map'),
    ),
    ListTile(
      leading: Icon(Icons.photo_album),
      title: Text('Album'),
    ),
    ListTile(
      leading: Icon(Icons.phone),
      title: Text('Phone'),
    ),
  ],
);

ListView demo

import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
 @override
 Widget build(BuildContext context) {
   final title = 'Basic List';

   return MaterialApp(
     title: title,
     home: Scaffold(
       appBar: AppBar(
         title: Text(title),
       ),
       body: ListView(
         children: <Widget>[
           ListTile(
             leading: Icon(Icons.map),
             title: Text('Map'),
           ),
           ListTile(
             leading: Icon(Icons.photo_album),
             title: Text('Album'),
           ),
           ListTile(
             leading: Icon(Icons.phone),
             title: Text('Phone'),
           ),
         ],
       ),
     ),
   );
 }
}

运行效果

Jietu20190212-175201@2x.jpg
上一篇 下一篇

猜你喜欢

热点阅读