2022年6月12日
flutter基础教程(listview列表)
分享几个学习flutter的学习网站与资源
flutter中文文档https://flutter.cn/docs/get-started/flutter-for/web-devs
main_ ho_Listview.dart
import 'package:flutter/material.dart';
void main () => runApp(MyApp());
class MyApp extends StatelessWidget{
@override
Widget build(BuildContext context ){
return MaterialApp(
title:'ListView widget',
home:Scaffold(
body:Center(
child:Container(
height:200.0,
child:MyList()
),
),
),
);
}
}
class MyList extends StatelessWidget{
@override
Widget build(BuildContext context){
return ListView(
scrollDirection: Axis.horizontal,
children: <Widget>[
new Container(
width:180.0,
color: Colors.lightBlue,
), new Container(
width:180.0,
color: Colors.amber,
), new Container(
width:180.0,
color: Colors.deepOrange,
),new Container(
width:180.0,
color: Colors.deepPurpleAccent,
),
],
);
}
}
main_builder_listView.dart
import 'package:flutter/material.dart';
void main () => runApp(MyApp(
items: new List<String>.generate(1000, (i)=> "Item $i")
));
class MyApp extends StatelessWidget{
final List<String> items;
MyApp({Key key, @required this.items}):super(key:key);
@override
Widget build(BuildContext context ){
return MaterialApp(
title:'ListView widget',
home:Scaffold(
body:new ListView.builder(
itemCount:items.length,
itemBuilder:(context,index){
return new ListTile(
title:new Text('${items[index]}'),
);
}
)
),
);
}
}
main_pic_listVIew.dart
import 'package:flutter/material.dart';
void main()=> runApp(new MyApp());
class MyApp extends StatelessWidget{
@override
Widget build(BuildContext context){
return new MaterialApp(
title: 'welcome to Flutter',
home: new Scaffold(
appBar: new AppBar(
title: Text('wecome'),
)
body: Center(
child: new ListView(
children:<Widget>[
new Image.network(
'http://xxxx.com/static/upload/20181111/G-wj-ZQuocWlYOHM6MT2Hbh5.jpg'
),
new Image.network(
'http://xxxx.com/static/upload/20181109/1bHNoNGpZjyriCNcvqdKo3s6.jpg'
),
new Image.network(
'http://xxxx.com/static/myimg/typescript_banner.jpg'
),new Image.network(
'http://xxxx.com/static/myimg/smile-vue.jpg'
)
]
),
)
)
)
}
}