tiktoklikescroller 0.1.8 copy "tiktoklikescroller: ^0.1.8" to clipboard
tiktoklikescroller: ^0.1.8 copied to clipboard

outdated

A vertical fullscreen scroll implementation that snaps in place, similar to the TikTok app

example/lib/example.dart

import 'package:flutter/material.dart';
import 'package:tiktoklikescroller/tiktoklikescroller.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    final List<Color> _colors = <Color>[
      Colors.red,
      Colors.blue,
      Colors.green,
      Colors.orange,
    ];

    return MaterialApp(
      home: HomeWidget(colors: _colors),
    );
  }
}

class HomeWidget extends StatelessWidget {
  const HomeWidget({
    required this.colors,
  });

  final List<Color> colors;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: TikTokStyleFullPageScroller(
        contentSize: colors.length,
        swipePositionThreshold: 0.2,
        // ^ the fraction of the screen needed to scroll
        swipeVelocityThreshold: 2000,
        // ^ the velocity threshold for smaller scrolls
        animationDuration: const Duration(milliseconds: 300),
        // ^ how long the animation will take
        onScrollEvent: _handleCallbackEvent,
        // ^ registering our own function to listen to page changes
        builder: (BuildContext context, int index) {
          return Container(
            color: colors[index],
            child: Center(
              child: Text(
                '$index',
                key: Key('$index-text'),
                style: const TextStyle(fontSize: 48, color: Colors.white),
              ),
            ),
          );
        },
      ),
    );
  }

  void _handleCallbackEvent(ScrollEventType type, {int? currentIndex}) {
    print(
        "Scroll callback received with data: {type: $type, and index: ${currentIndex ?? 'not given'}}");
  }
}
191
likes
0
pub points
96%
popularity

Publisher

verified publisherdavidtaylor.io

A vertical fullscreen scroll implementation that snaps in place, similar to the TikTok app

Homepage
Repository (GitHub)
View/report issues

License

unknown (LICENSE)

Dependencies

flutter

More

Packages that depend on tiktoklikescroller