Flutter入门学习--(8)列表组件ListView

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/zx13525079024/article/details/86599999

Flutter中的列表组件是ListView,使用该组件可以以列表方式显示内容,和ANDROID中的效果一样的,我们 先看下效果图

代码如下

import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
        title: 'Flutter',
        home: Scaffold(
          appBar: AppBar(
            title: Text("List View"),
          ),
          body: new ListView(
            children: <Widget>[
                 new ListTile(
                   leading: Icon( Icons.access_alarms),
                   title: new Text("内容1"),
                 ),
                  new ListTile( 
                    leading: Icon(Icons.add_box),
                   title: new Text("内容2"),
                 ),
                  new ListTile(
                   leading: Icon(Icons.camera),
                  title: new Text("内容3"),
                 ),
                  new ListTile(
                   leading: Icon(Icons.offline_bolt),
                  title: new Text("内容4"),
                 ),
                  new ListTile(
                   leading: Icon(Icons.phone),
                  title: new Text("内容5"),
                 ),
            ],
          )
          ));
  }
}

ListView中的内容是数组,使用children属性可以放置多个组件

这里用到了ListTile,可以放置图标和标题效果的组件,有两个重要属性leading和title

猜你喜欢

转载自blog.csdn.net/zx13525079024/article/details/86599999