import 'package:flutter/material.dart';

void main() {
runApp(MyApp());
} class MyApp extends StatelessWidget {
const MyApp({Key key}) : super(key: key); @override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
appBar: AppBar(
title: Text("flutter demo"),
),
body: HomeContent(),
),
);
}
} class HomeContent extends StatelessWidget {
const HomeContent({Key key}) : super(key: key); @override
Widget build(BuildContext context) {
return ListView(
children: <Widget>[
ListTile(
leading: Icon(Icons.home,color: Colors.blue,size: ,),
title: Text(
"大标题大标题大标题大标题大标题大标题大标题大标题",
style: TextStyle(fontSize: ),
),
subtitle: Text("小臂挑剔小臂挑剔小臂挑剔小臂挑剔小臂挑剔小臂挑剔小臂挑剔"),
),
ListTile(
leading: Image.network("https://www.itying.com/images/201905/thumb_img/1101_thumb_G_1557845381862.jpg"),
title: Text(
"大标题大标题大标题大标题大标题大标题大标题大标题",
style: TextStyle(fontSize: ),
),
subtitle: Text("小臂挑剔小臂挑剔小臂挑剔小臂挑剔小臂挑剔小臂挑剔小臂挑剔"),
),
ListTile(
title: Text(
"大标题大标题大标题大标题大标题大标题大标题大标题",
style: TextStyle(fontSize: ),
),
subtitle: Text("小臂挑剔小臂挑剔小臂挑剔小臂挑剔小臂挑剔小臂挑剔小臂挑剔"),
),
ListTile(
title: Text(
"大标题大标题大标题大标题大标题大标题大标题大标题",
style: TextStyle(fontSize: ),
),
subtitle: Text("小臂挑剔小臂挑剔小臂挑剔小臂挑剔小臂挑剔小臂挑剔小臂挑剔"),
),
],
);
}
}

动态列表实现的两种方法:

listview动态列表数据:

flutter中的listview的使用-LMLPHP

import 'package:flutter/material.dart';

void main() {
runApp(MyApp());
} class MyApp extends StatelessWidget {
const MyApp({Key key}) : super(key: key); @override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
appBar: AppBar(
title: Text("flutter demo"),
),
body: HomeContent(),
),
);
}
} class HomeContent extends StatelessWidget {
HomeContent({Key key}) : super(key: key);
//动态列表数据:
List<Widget> _getdata(){
List<Widget> list=new List();
for(var i=;i<;i++){
list.add(ListTile(
title: Text("我是$i 列表"),
));
}
return list.toList();
} @override
Widget build(BuildContext context) {
return ListView(
children:this._getdata(),
);
}
}

循环遍历数据:

flutter中的listview的使用-LMLPHP

listData.dart

List listData=[
{
"title":"Candy Shop",
"author":"小明",
"imageUrl":"https://www.itying.com/images/flutter/1.png"
},
{
"title":"Candy Shop",
"author":"小明",
"imageUrl":"https://www.itying.com/images/flutter/2.png"
},
{
"title":"Candy Shop",
"author":"小明",
"imageUrl":"https://www.itying.com/images/flutter/3.png"
},
{
"title":"Candy Shop",
"author":"小明",
"imageUrl":"https://www.itying.com/images/flutter/4.png"
},{
"title":"Candy Shop",
"author":"小明",
"imageUrl":"https://www.itying.com/images/flutter/5.png"
}
];
import 'package:flutter/material.dart';
import 'package:flutter_testdemo001/res/listData.dart'; void main() {
runApp(MyApp());
} class MyApp extends StatelessWidget {
const MyApp({Key key}) : super(key: key); @override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
appBar: AppBar(
title: Text("flutter demo"),
),
body: HomeContent(),
),
);
}
} class HomeContent extends StatelessWidget {
HomeContent({Key key}) : super(key: key);
//自定义方法:
List<Widget> _getListData() {
var tempList=listData.map((value){
return ListTile(
leading: Image.network(value['imageUrl']),
title: Text(value['title']),
subtitle: Text(value['author']),
);
});
return tempList.toList();
} @override
Widget build(BuildContext context) {
return ListView(
children:this._getListData(),
);
}
}

ListView.builder的使用:

import 'package:flutter/material.dart';
import 'package:flutter_testdemo001/res/listData.dart'; void main() {
runApp(MyApp());
} class MyApp extends StatelessWidget {
const MyApp({Key key}) : super(key: key); @override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
appBar: AppBar(
title: Text("flutter demo"),
),
body: HomeContent(),
),
);
}
} class HomeContent extends StatelessWidget {
//自定义方法:
List list = new List();
HomeContent() {
for (var i = ; i < ; i++) {
this.list.add("我是第$i 条");
}
} @override
Widget build(BuildContext context) {
return ListView.builder(
itemCount: this.list.length,
itemBuilder: (context, index) {
return ListTile(
title: Text(this.list[index]),
);
},
);
}
}
import 'package:flutter/material.dart';
import 'package:flutter_testdemo001/res/listData.dart'; void main() {
runApp(MyApp());
} class MyApp extends StatelessWidget {
const MyApp({Key key}) : super(key: key); @override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
appBar: AppBar(
title: Text("flutter demo"),
),
body: HomeContent(),
),
);
}
} class HomeContent extends StatelessWidget {
//自定义方法:
Widget _getListData(context, index) {
return ListTile(
title: Text(listData[index]['title']),
);
} @override
Widget build(BuildContext context) {
return ListView.builder(
itemCount: listData.length,
itemBuilder: this._getListData,
);
}
}
05-23 07:10