DenisBogatirov / circle_wheel_scroll

Circle wheel scroll view for flutter
BSD 3-Clause "New" or "Revised" License
35 stars 47 forks source link

Show one circle at a time #9

Open iamkunalpitale opened 4 years ago

iamkunalpitale commented 4 years ago

How to show one circle at a time its moving too fast??? Speed make it slow??

Zamorite commented 4 years ago

To achieve a one-circle-at-a-time scroll behaviour, I would recommend using a custom ScrollPhysics which extends CircleFixedExtentScrollPhysics.

class CustomScrollPhysics extends CircleFixedExtentScrollPhysics {
  const CustomScrollPhysics ({ScrollPhysics parent}) : super(parent: parent);

  @override
  double get minFlingVelocity => double.infinity;

  @override
  double get maxFlingVelocity => double.infinity;

  @override
  double get minFlingDistance => double.infinity;

  @override
  CustomScrollPhysics applyTo(ScrollPhysics ancestor) {
    return CustomScrollPhysics (parent: buildParent(ancestor));
  }
}

The CustomScrollPhysics can then be passed to the CircleListScrollView as shown below.

CircleListScrollView(
    physics: CustomScrollPhysics(),
    axis: Axis.horizontal,
    itemExtent: 175,
    children: List.generate(
        5,
        (int i) => Center(
            // feel free to design each item as you wish here...
            child: Container(
                 width: 175,
                 height: 175,
                 color: Colors.blue,
            ),
         ),
     ),
     radius: MediaQuery.of(context).size.width * .65,
),

Source: StackOverflow