在AppStore中如何实现左右滑动,因为使用PageView会居中显示,不会居左显示,目前没有找到解决方案,我使用的方案是ListView+自定义physics实现的。
代码
SizedBox(width: 200,height: 400,child: ListView.builder(scrollDirection: Axis.horizontal,physics: const MyScreenPagePhysics(viewportDimension: 200 + 20 * 2, //需要计算viewport宽度),itemBuilder: (context, index) {return Padding(padding: EdgeInsets.symmetric(horizontal: 20),child: Column(children: [CachedNetworkImage(//图标width: 200,height: 400,fit: BoxFit.fill,imageUrl:"https://is1-ssl.mzstatic.com/image/thumb/Purple221/v4/07/b1/d7/07b1d7f0-76b1-e292-541b-c04a2eede928/AppIcon-1x_U007emarketing-0-7-0-sRGB-85-220.png/512x512bb.jpg",placeholder: (context, url) =>LoadingAnimationWidget.threeArchedCircle(color: Colors.white,size: 20,).center(),errorWidget: (context, url, error) =>const Icon(Icons.error_outline_rounded),).border(color: Colors.blue),],),);},itemCount: 2,),)
MyScreenPagePhysics.dart源码
import 'package:flutter/cupertino.dart';
import 'dart:math' as math;class MyScreenPagePhysics extends ScrollPhysics {final double viewportDimension;const MyScreenPagePhysics({super.parent,required this.viewportDimension,});@overrideMyScreenPagePhysics applyTo(ScrollPhysics? ancestor) {return MyScreenPagePhysics(parent: buildParent(ancestor),viewportDimension: viewportDimension,);}double _getPage(ScrollMetrics position) {return position.pixels / position.viewportDimension;}double _getPixels(ScrollMetrics position, double page) {return math.min(position.maxScrollExtent,page * position.viewportDimension,);}double _getTargetPixels(ScrollMetrics position, Tolerance tolerance, double velocity) {double page = _getPage(position);if (velocity < -tolerance.velocity) {page -= 0.5;} else if (velocity > tolerance.velocity) {page += 0.5;}return _getPixels(position, page.roundToDouble());}@overrideSimulation? createBallisticSimulation(ScrollMetrics _position, double velocity) {ScrollMetrics position = _position.copyWith(viewportDimension: viewportDimension,);if ((velocity <= 0.0 && position.pixels <= position.minScrollExtent) ||(velocity >= 0.0 && position.pixels >= position.maxScrollExtent)) {return super.createBallisticSimulation(position, velocity);}final Tolerance tolerance = toleranceFor(position);final double target = _getTargetPixels(position, tolerance, velocity);if (target != position.pixels) {return ScrollSpringSimulation(spring, position.pixels, target, velocity,tolerance: tolerance);}return null;}
}
效果图