问题描述
我当前的项目有一个可滚动的行,效果很好,但是我找不到一种进行静态滚动的方法,当您滚动到某个项目时,该项目会自动居中。
这是我目前拥有的:
滚动卡片时,它们停留在滚动结束时的位置:
是否有一个实际上可以像这样工作的小部件?
解决方法
尝试一下,
import 'package:flutter/material.dart';
final Color darkBlue = Color.fromARGB(255,18,32,47);
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
final List<String> images = ["Me","You","Foo","Baa"];
final PageController controller = PageController(viewportFraction:0.8);
@override
Widget build(BuildContext context) {
return MaterialApp(
theme: ThemeData.dark().copyWith(scaffoldBackgroundColor: darkBlue),debugShowCheckedModeBanner: false,home: Scaffold(
body: PageView.builder(
controller: controller,itemCount: images.length,itemBuilder: (context,index){
return Container(
margin: EdgeInsets.all(16),child: Center(child:Text(images[index])),color: Colors.grey.shade200
);
}
),),);
}
}
class MyWidget extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Text('Hello,World!',style: Theme.of(context).textTheme.headline4);
}
}
,
解决方案很简单:
Padding(
padding: const EdgeInsets.symmetric(vertical: 80),child: Container(
child: PageView(
controller: controller,scrollDirection: Axis.horizontal,pageSnapping: true,physics: BouncingScrollPhysics(),children: [CardMovie(),CardMovie(),CardMovie()],)
使用PageView窗口小部件并在其顶部填充边框,因为窗口小部件的高度为全屏显示。