如何使用Flutter实现提供的图像中显示的滚动行为?我尝试使用ListWheelScroll,但它不适合我。
nszi6y051#
您可以使用clickable_list_wheel_view包来创建这种选择器。它类似于ListWheelScroll,也检测onTap或Click功能。为了更好地了解它,请查看官方网站。我添加了一个小例子来展示如何使用它。完整代码:-
ListWheelScroll
import 'package:clickable_list_wheel_view/clickable_list_wheel_widget.dart'; import 'package:flutter/material.dart'; void main() => runApp(const MyApp()); class MyApp extends StatelessWidget { const MyApp({Key? key}) : super(key: key); @override Widget build(BuildContext context) { return MaterialApp( title: 'List', theme: ThemeData( primarySwatch: Colors.blue, ), debugShowCheckedModeBanner: false, home: const List(), ); } } class List extends StatefulWidget { const List({Key? key}) : super(key: key); @override _ListState createState() => _ListState(); } class _ListState extends State<List> { final _scrollController = FixedExtentScrollController(initialItem: 4); int itemLength = 6; @override Widget build(BuildContext context) { return Scaffold( appBar: AppBar( title: const Text("List"), backgroundColor: Colors.green, ), body: Center( child: Column( mainAxisAlignment: MainAxisAlignment.center, crossAxisAlignment: CrossAxisAlignment.center, children: [ SizedBox( height: 20, width: 300, child: RotatedBox( quarterTurns: 1, child: ClickableListWheelScrollView( scrollController: _scrollController, itemHeight: 80, itemCount: itemLength, onItemTapCallback: (index) {}, child: ListWheelScrollView.useDelegate( controller: _scrollController, itemExtent: 80, physics: const FixedExtentScrollPhysics(), overAndUnderCenterOpacity: 1.0, perspective: 0.002, onSelectedItemChanged: (index) {}, childDelegate: ListWheelChildBuilderDelegate( builder: (context, index) { return Container( alignment: Alignment.center, child: RotatedBox( quarterTurns: -1, child: Text( '${(itemLength - index) * 5} MIN', textAlign: TextAlign.center, style: const TextStyle(fontSize: 20), )), ); }, childCount: itemLength, ), ), ), ), ), const Icon( Icons.arrow_drop_up, size: 35, ) ], ), )); } }
输出:-
1条答案
按热度按时间nszi6y051#
您可以使用clickable_list_wheel_view包来创建这种选择器。它类似于
ListWheelScroll
,也检测onTap或Click功能。为了更好地了解它,请查看官方网站。我添加了一个小例子来展示如何使用它。完整代码:-
输出:-