how to make FixedExtentScrollController animateToItem method animate scroll in one direction only? (flutter)

Viewed 270

I'm trying to create a slot-machine-like behaviour with ListWheelScrollView.useDelegate() method. Here's what I have so far:

final FixedExtentScrollController _controller = FixedExtentScrollController();
...
ListWheelScrollView.useDelegate(
  controller: _controller,
  physics: NeverScrollableScrollPhysics(), // user will be unable to scroll manually
  itemExtent: 50,
  childDelegate: ListWheelChildLoopingListDelegate(
    children: model.allToppings
        .map(
          (topping) => Container(
            color: Color.fromRGBO(0, 0, 0, 0.5),
            height: 50,
            width: 50,
            child: Image.asset(topping.image),
          ),
        )
        .toList(),
  ),
),

and I have a "Spin" button that when hit, scrolls the ListWheelScrollView programmatically to a randomized item.

void userClickedSpin() {
  final Random random = new Random();
  final int randomIndex = random.nextInt(allToppings.length);
  controller.animateToItem(
    randomIndex,
    duration: Duration(milliseconds: 300),
    curve: Curves.fastOutSlowIn,
  );
}

The problem with this is that the animateToItem method scrolls in both directions when I want a behavior like those of slot machines where they only spin in one direction. How can one achieve this?

Any input is appreciated. Thank you!

0 Answers
Related