热门标签 | HotTags
当前位置:  开发笔记 > 编程语言 > 正文

Flutter——ListView组件(列表组件)

ListView的常见参数:名称类型说明scrollDirectionAxisAxis.horizontal水平列表Axis.vertical垂直列表paddingEdgeInse

ListView的常见参数:






























名称类型说明

scrollDirection


Axis


Axis.horizontal 水平列表

Axis.vertical 垂直列表


padding


EdgeInsetsGeometry


内边距


resolve


bool


组件反向排序


children


List


列表元素

 




  • 垂直列表



技术分享图片


import ‘package:flutter/material.dart‘;
void main() {
runApp(MaterialApp(
title:
"ListWidget",
home: MyApp(),
));
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
body: ListView(
children:
[
ListTile(
leading: Icon(Icons.directions_car),
title: Text(
"标题"),
subtitle: Text(
"内容"),
trailing: Icon(Icons.airplanemode_active),
),
ListTile(
leading: Icon(Icons.directions_car),
title: Text(
"标题"),
subtitle: Text(
"内容"),
trailing: Icon(Icons.airplanemode_active),
),
ListTile(
leading: Icon(Icons.directions_car),
title: Text(
"标题"),
subtitle: Text(
"内容"),
trailing: Icon(Icons.airplanemode_active),
),
],
),
);
}
}

 




  • 水平列表



技术分享图片

 

 


import ‘package:flutter/material.dart‘;
void main() {
runApp(MaterialApp(
title:
"ListWidget",
home: MyApp(),
));
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
body: ListView(
scrollDirection: Axis.horizontal,
children:
[
Container(
color: Colors.pink,
width:
100.0,
height:
100.0,
),
Container(
color: Colors.yellow,
width:
100.0,
height:
100.0,
),
Container(
color: Colors.blue,
width:
100.0,
height:
100.0,
),
Container(
color: Colors.green,
width:
100.0,
height:
100.0,
),
Container(
color: Colors.orange,
width:
100.0,
height:
100.0,
),
],
),
);
}
}


注意:如果是垂直列表,LIstView里面的widget设置的width属性失效。

   如果是水平列表,ListView里面的widget设置的height属性失效。


 




  • 动态列表



 


import ‘package:flutter/material.dart‘;
void main() {
runApp(MaterialApp(
title:
"ListWidget",
home: MyApp(),
));
}
class MyApp extends StatelessWidget {
List list
= new List();
MyApp() {
for(var i = 0; i <15; i++) {
this.list.add("我是第$i条数据");
}
}
@override
Widget build(BuildContext context) {
return Scaffold(
body: ListView.builder(
itemCount:
this.list.length,
itemBuilder: (context,index) {
return ListTile(
leading: Icon(Icons.palette),
title: Text(
"${this.list[index]}"),
);
}
),
);
}
}

 

 

 

 


推荐阅读
  • 如果应用程序经常播放密集、急促而又短暂的音效(如游戏音效)那么使用MediaPlayer显得有些不太适合了。因为MediaPlayer存在如下缺点:1)延时时间较长,且资源占用率高 ... [详细]
  • Framework7:构建跨平台移动应用的高效框架
    Framework7 是一个开源免费的框架,适用于开发混合移动应用(原生与HTML混合)或iOS&Android风格的Web应用。此外,它还可以作为原型开发工具,帮助开发者快速创建应用原型。 ... [详细]
  • 解决Bootstrap DataTable Ajax请求重复问题
    在最近的一个项目中,我们使用了JQuery DataTable进行数据展示,虽然使用起来非常方便,但在测试过程中发现了一个问题:当查询条件改变时,有时查询结果的数据不正确。通过FireBug调试发现,点击搜索按钮时,会发送两次Ajax请求,一次是原条件的请求,一次是新条件的请求。 ... [详细]
  • 第二十五天接口、多态
    1.java是面向对象的语言。设计模式:接口接口类是从java里衍生出来的,不是python原生支持的主要用于继承里多继承抽象类是python原生支持的主要用于继承里的单继承但是接 ... [详细]
  • 自动验证时页面显示问题的解决方法
    在使用自动验证功能时,页面未能正确显示错误信息。通过使用 `dump($info->getError())` 可以帮助诊断和解决问题。 ... [详细]
  • 微软推出Windows Terminal Preview v0.10
    微软近期发布了Windows Terminal Preview v0.10,用户可以在微软商店或GitHub上获取这一更新。该版本在2月份发布的v0.9基础上,新增了鼠标输入和复制Pane等功能。 ... [详细]
  • 本文介绍了如何使用 CMD 批处理脚本进行文件操作,包括将指定目录下的 PHP 文件重命名为 HTML 文件,并将这些文件复制到另一个目录。 ... [详细]
  • 两个条件,组合控制#if($query_string~*modviewthread&t(&extra(.*)))?$)#{#set$itid$1;#rewrite^ ... [详细]
  • 本文详细介绍了DMA控制器如何通过映射表处理来自外设的请求,包括映射表的设计和实现方法。 ... [详细]
  • Spark中使用map或flatMap将DataSet[A]转换为DataSet[B]时Schema变为Binary的问题及解决方案
    本文探讨了在使用Spark的map或flatMap算子将一个数据集转换为另一个数据集时,遇到的Schema变为Binary的问题,并提供了详细的解决方案。 ... [详细]
  • 解决Parallels Desktop错误15265的方法
    本文详细介绍了在使用Parallels Desktop时遇到错误15265的多种解决方案,包括检查网络连接、关闭代理服务器和修改主机文件等步骤。 ... [详细]
  • LDAP服务器配置与管理
    本文介绍如何通过安装和配置SSSD服务来统一管理用户账户信息,并实现其他系统的登录调用。通过图形化交互界面配置LDAP服务器,确保用户账户信息的集中管理和安全访问。 ... [详细]
  • 解决 Windows Server 2016 网络连接问题
    本文详细介绍了如何解决 Windows Server 2016 在使用无线网络 (WLAN) 和有线网络 (以太网) 时遇到的连接问题。包括添加必要的功能和安装正确的驱动程序。 ... [详细]
  • 使用Jsoup解析并遍历HTML文档时,该库能够高效地生成一个清晰、规范的解析树,即使源HTML文档存在格式问题。Jsoup具备强大的容错能力,能够处理多种异常情况,如未闭合的标签等,确保解析结果的准确性和完整性。 ... [详细]
  • CentOS 7 中 iptables 过滤表实例与 NAT 表应用详解
    在 CentOS 7 系统中,iptables 的过滤表和 NAT 表具有重要的应用价值。本文通过具体实例详细介绍了如何配置 iptables 的过滤表,包括编写脚本文件 `/usr/local/sbin/iptables.sh`,并使用 `iptables -F` 清空现有规则。此外,还深入探讨了 NAT 表的配置方法,帮助读者更好地理解和应用这些网络防火墙技术。 ... [详细]
author-avatar
悍受蓁
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有