创建水平列表
你可能需要创建可以水平而非垂直滚动的列表。ListView
部件支持水平列表。
使用标准的 ListView
构造函数,传入一个水平的 scrollDirection
,它会覆盖默认的垂直方向。
dart
ListView(
// This next line does the trick.
scrollDirection: Axis.horizontal,
children: <Widget>[
Container(width: 160, color: Colors.red),
Container(width: 160, color: Colors.blue),
Container(width: 160, color: Colors.green),
Container(width: 160, color: Colors.yellow),
Container(width: 160, color: Colors.orange),
],
),
互动示例
#import 'package:flutter/material.dart';
void main() => runApp(const MyApp());
class MyApp extends StatelessWidget {
const MyApp({super.key});
@override
Widget build(BuildContext context) {
const title = 'Horizontal List';
return MaterialApp(
title: title,
home: Scaffold(
appBar: AppBar(title: const Text(title)),
body: Container(
margin: const EdgeInsets.symmetric(vertical: 20),
height: 200,
child: ListView(
// This next line does the trick.
scrollDirection: Axis.horizontal,
children: <Widget>[
Container(width: 160, color: Colors.red),
Container(width: 160, color: Colors.blue),
Container(width: 160, color: Colors.green),
Container(width: 160, color: Colors.yellow),
Container(width: 160, color: Colors.orange),
],
),
),
),
);
}
}