Scroll Mate #

Multiple scroll controller works synchronization and define how many line to show

Preview #

Getting Started #

You can handle multiple scroll controller synchronization. All lines scrolls start and end at the same time. Decide how many lines do you want to show on the screen.

Features #

• Multiple scroll controller works synchronization
• Define a line count parameter to show users
• Generic type can be used and custom widget you can show

Properties #

Scroll Mate Model #

Scroll Mate Item #

Usage #

ScrollMateList<String>(
      scrollMateModel: ScrollMateModel(
        lineCount: 4,
        items: Interests.list,
        title: buildInterestTitle(),
        builder: (String title, int index) {
          return ScrollMateItem(
            rightMargin: 20,
            leftMargin: 20,
            item: ScrollMateChip(title: title.toString(), index: index),
          );
        },
      ),
    );

const Padding(
      padding: EdgeInsets.only(bottom: 15, left: 20, top: 15),
      child: Text(
        'Interests',
        style: TextStyle(fontSize: 20, color: Color(0xff4c546d), fontWeight: FontWeight.bold),
      ),
    );

ScrollMateItem(
      rightMargin: 20,
      leftMargin: 20,
      item: Container(
        height: 40,
        padding: const EdgeInsets.symmetric(horizontal: 20),
        alignment: Alignment.center,
        decoration: BoxDecoration(
          color: const Color(0xff4c546d),
          borderRadius: BorderRadius.circular(10),
        ),
        child: Text(
          title,
          style: const TextStyle(
            color: Colors.white,
            fontWeight: FontWeight.bold,
          ),
        ),
      ),
    ).item;

Other Usage #

You can create own scroll controller widget. Just use the initialize function in your initState function and send scrollController list as a parameter.

  final scrollController = ScrollController();
  final scrollController2 = ScrollController();

  @override
  void initState() {
    super.initState();
    ScrollMateController.instance.initController(
      scrollControllers: [scrollController, scrollController2],
    );
  }