flutter -------- ListView的使用
学习了Flutter,来分享一下学习的一些常用的知识,先来说说ListView
案例效果:

ListView是一个类似列的widget,它的内容对于其渲染框太长时会自动提供滚动。
ListView 摘要:
用于组织盒子中列表的特殊Column
可以水平或垂直放置
检测它的内容超过显示框时提供滚动
比Column配置少,但更易于使用并支持滚动
构建ListView有四个选项:
默认构造函数采用子类的显式List <Widget>。此构造函数适用于具有少量子项的列表视图,因为构造List需要为可能在列表视图中显示的每个子项执行工作,而不仅仅是那些实际可见的子项。
该ListView.builder构造函数采用IndexedWidgetBuilder,它建立在孩子的需求。此构造函数适用于具有大量(或无限)子项数的列表视图,因为仅为那些实际可见的子项调用构建器。
该ListView.separated构造函数有两个IndexedWidgetBuilder S: itemBuilder按需建立个子项目,separatorBuilder 同样建立其出现在子项之间的分隔符的孩子。此构造函数适用于具有固定数量子项的列表视图。
该ListView.custom构造需要SliverChildDelegate,它提供了自定义子模型的其他方面的能力。例如,SliverChildDelegate可以控制用于估计实际上不可见的子项大小的算法。
官方文档介绍:
https://docs.flutter.io/flutter/widgets/ListView-class.html
案例代码:
class UITest3_ListView extends StatelessWidget{
List<Widget> list = <Widget>[
new ListTile(
title: new Text('Mi is One',
style: new TextStyle(fontWeight: FontWeight.w500,fontSize: 20),
),
subtitle: new Text("85 W zq"),
leading: new Icon(Icons.theaters,color: Colors.blue[500]),
),
new ListTile(
title: new Text("Test at Tow",style: new TextStyle(fontWeight: FontWeight.w500,fontSize: 20)),
subtitle: new Text("666 Car"),
leading: new Icon(Icons.list,color: Colors.blue[500])
),
new ListTile(
title: new Text('Three',
style: new TextStyle(fontWeight: FontWeight.w500,fontSize: 20),
),
subtitle: new Text("85 W zq"),
leading: new Icon(Icons.theaters,color: Colors.blue[500]),
),
new ListTile(
title: new Text("Four",style: new TextStyle(fontWeight: FontWeight.w500,fontSize: 20)),
subtitle: new Text("666 Car"),
leading: new Icon(Icons.list,color: Colors.blue[500]),
onTap: (){
Fluttertoast.showToast(
msg: " Four",
toastLength: Toast.LENGTH_SHORT,
gravity: ToastGravity.BOTTOM,
timeInSecForIos: 1,
backgroundColor: Colors.blue,
textColor: Colors.white
);
},
)
];
@override
Widget build(BuildContext context) {
// TODO: implement build
return new Scaffold(
appBar: new AppBar(
title: Text("ListView"),
),
body: new Center(
child: new ListView(
children: list,
),
),
);
}
}
flutter -------- ListView的使用的更多相关文章
- Flutter ListView 列表组件
列表常见的情况: 1.垂直列表 2.垂直图文列表 3.横向列表 4.动态列表 名称 类型 说明 scrollDirection Axis Axis.horizontal 横向列表 Axis.verti ...
- Flutter——ListView组件(平铺列表组件)
ListView的常见参数: 名称 类型 说明 scrollDirection Axis Axis.horizontal 水平列表 Axis.vertical 垂直列表 padding EdgeIns ...
- flutter ListView列表和导航传值以及回调
main.dart import 'package:flutter/material.dart'; void main(){ return runApp(MyApp()); } class Produ ...
- flutter ListView简介
child: new Container( child: new Center( child: ListView( shrinkWrap:true, children: <Widget>[ ...
- Flutter - ListView禁止用户上下滑动
ListView禁止用户上下滑动可以使用physics属性 physics: const NeverScrollableScrollPhysics()
- flutter ListView 页面滚动组件
ListView class A scrollable list of widgets arranged linearly. ListView is the most commonly used sc ...
- flutter ListView嵌套高度问题
ListView嵌套时高度无法自适应,需要设置高度才可以显示,设置以下属性可以解决上述问题 shrinkWrap: true, physics: NeverScrollableScrollPhysic ...
- Flutter 自定义列表以及本地图片引用
前言 上篇关于Flutter的文章总结了下标签+导航的项目模式的搭建,具体的有需要的可以去看看Flutter分类的文章,这篇文章我们简单的总结一下关于Flutter本地文件引用以及简单的自定义List ...
- flutter - 01 基础介绍以及ListView
这篇主要讲flutter最基本的操作.我们从一个实例入手,先不需要知道它里面的每一行是什么意思,我会慢慢说. main.dart import 'package:flutter/material.da ...
随机推荐
- 如何在Jenkins上配置一个可以从其它Job取回Artifact的Job
今天因为工作上的需求,需要在Jenskin上配置一个job, 它应该可以从其它所选择的Job中取回Artifact. 首先,在"构建"步骤中添加 "Copy Artifa ...
- 安利一款强大的学习软件XMind(顺便放上这几天制作的JavaSE的思维导图day1-day4)
最近在学习Java,并且在使用一款非常酷炫无敌吊炸天的软件,思维导图制作神器-XMind,然后就像分享给大家,至于XMind是什么大家自行百度,在这里我就不赘述了 我这里说下我认为的好的实用的常用快捷 ...
- JS 画框操作
Js中,我们有时候需要对图片进行操作,包括画框,其实对于UI前端来说挺简单的,没有网上说的那样复杂,这里说明一下 <div style="width:80%;height:300px; ...
- 20175208《Java程序设计》第五周学习总结
教材学习内容总结 1.接口:1)接口声明: interface //接口的名字 2)接口体2.实现接口:类实现接口:一个类需要在类声明中使用关键字implements声明该类实现一个或多个接口.如果实 ...
- 关于eric4和pyqt的入门学习(转)
在Eric4下用PyQt4编写Python的图形界面程序 转载请注明作者RunningOn 本文是PyQt4的入门教程.网上能搜到其它教程,但我觉得讲得不是很清楚,希望这篇文章对入门者更加有帮助. 先 ...
- JavaScript之事件的绑定与移除
对于事件的绑定的方法有多种多样,但是在解除绑定事件的时候,就要注意使用的是那种绑定事件的方法,因为不同的绑定方法所对应的解除事件是不同的. 1. 原始写法 1.1 绑定事件:对象.事件=事件处理函数 ...
- C++ 创建快捷方式
https://blog.csdn.net/morewindows/article/details/6686683
- get 和 post 请求的区别,一个不错的链接
https://www.cnblogs.com/logsharing/p/8448446.html
- ltp-ddt git
ltp-ddt目录下有一个文件夹 confrVOaeL confvp5WrA 这个文件夹是由./configure --host=arm-linux-gnueabihf命令生成的. 每次configu ...
- C 语言多线程与锁机制
C 语言多线程与锁机制 多线程 #include <pthread.h> void *TrainModelThread(void *id) { ... pthread_exit(NULL) ...