scrollDirection: Axis.horizontal,// ...) 在这个例子中,我们将scrollDirection属性设置为Axis.horizontal,以创建一个水平滚动的ListView。 如果你想控制ListView的滚动行为,你可以使用controller属性并配合ScrollController来实现。 下面是一个示例,滚动 ListView 到指定的位置: import'package:flutter/material.dart';voidm...
class MyHomeBody extends StatelessWidget { const MyHomeBody({super.key}); @override Widget build(BuildContext context) { return SizedBox( height: 180, child: ListView( scrollDirection: Axis.horizontal, children: [ ClipOval( //圆角 child: Container( width: 180, color: Colors.red, ), ), Contai...
在上面的代码中,我们创建了一个包含四个Container的ListView,每个Container都有不同的颜色,并且设置了ListView的scrollDirection为Axis.horizontal以实现横向滚动。 运行应用 将上述代码保存后,在终端中运行以下命令来启动Flutter应用: bash flutter run 你应该能够在模拟器或真实设备上看到一个可以横向滚动的ListView。 这...
水平滚动的 ListView 代码语言:txt 复制 import 'package:flutter/material.dart'; void main() { runApp(MyApp()); } class MyApp extends StatelessWidget { @override Widget build(BuildContext context) { return MaterialApp( home: Scaffold( appBar: AppBar(title: Text('Horizontal ListView')), body:...
如果需要水平的列表效果,则只需要修改 ListView组件中的scrollDirection参数,ListView默认是垂直的列表,给scrollDirection参数传Axis.horizontal即可。 Axis.horizontal: 水平列表 Axis.vertical:垂直列表 以下为一个水平列表的Demo: import 'package:flutter/cupertino.dart'; ...
body: ListView( //改变滚动方向 //scrollDirection: Axis.horizontal, scrollDirection: Axis.vertical, children: _myList(), ), ), ); } List<Widget> _myList() { return NAMES.map((name) => _item(name)).toList(); } Widget _item(String name) { ...
通过ListView()默认构造器创建出来的列表, 会一次性加载全部的 item, 是比较消耗性能的, 在列表 item 个数明确只有较少的情景下可以使用, 常见参数有: scrollDirection: 列表滚动方向, 默认是纵向, 可以使用Axis.horizontal改为横向 itemExtent: item 在 scrollDirection 方向上的尺寸, 如果列表是纵向, 则设置的是...
列表布局是项目开发中最常用的一种布局方式,Flutter 中我们可以通过 ListView 来定义列表项,支持垂直和水平方向展示。 ListView常见的参数列表: 1. scrollDirection 列表方向。主要有以下两种: (1). Axis.horizontal 水平列表; (2). Axis.vertical 垂直列表; 2. padding 内边距; 3. reverse 反向排序; 4. childre...
scrollDirection属性则决定了ListView子组件的布局方向,即ListView的滚动方向。Axis.vertical为竖直方向。Axis.horizontal为水平方向。 itemExtent属性为设置每个子组件的高度。如果此属性为null,则子组件则默认为自身高度。与UITableView一样,设置子组件的高度,会让ListView更高效。
child: ListView.builder( scrollDirection: Axis.horizontal, itemCount:5, itemBuilder: (context, index) {returnContainer( width:100,// 你可以根据需要设置宽度height:50,// 你可以根据需要设置高度color: Colors.blue,// 你可以根据需要设置颜色child: Center(child: Text('123')), ...