intro_onboarding_slider

A simple, reusable onboarding slider for Flutter apps.

  • PageView-based flow with animated indicators and controls
  • Works with asset or network images
  • Clean API: pass a list of pages and an onCompleted callback

Usage

import 'package:intro_onboarding_slider/intro_onboarding_slider.dart';

final pages = [
  OnboardingPageData.fromAsset(
    title: 'Welcome',
    description: 'Keep your users in the loop.',
    assetPath: 'images/1.png',
  ),
  OnboardingPageData.fromNetwork(
    title: 'Beautiful',
    description: 'Animations and a simple API.',
    url: 'https://picsum.photos/seed/2/800/600',
  ),
  // Lottie from local asset
  OnboardingPageData.fromLottieAsset(
    title: 'Delightful',
    description: 'Use Lottie animations from assets.',
    assetPath: 'assets/anim.json',
  ),
  // Lottie from network
  OnboardingPageData.fromLottieNetwork(
    title: 'Connected',
    description: 'Or load Lottie from a URL.',
    url: 'https://example.com/anim.json',
    buttonText: 'Let\'s go',
  ),
  OnboardingPageData.fromAsset(
    title: 'Get Started',
    description: 'All set! Let\'s begin.',
    assetPath: 'images/3.png',
    buttonText: 'Let\'s go',
  ),
];

return IntroOnboardingFlow(
  pages: pages,
  onCompleted: () {
    // Navigate to your app's home screen
  },
  // v0.1.3 options:
  onSkip: () {
    // Navigate elsewhere on Skip
  },
  getStartedText: 'Start Now',
  isBreathable: true, // false -> title, then media without container, then description
);

Theming

  • Provide backgroundGradient for a custom backdrop
  • Customize indicator colors with navActiveColor / navInactiveColor

License

MIT

Libraries

intro_onboarding_slider
Intro Onboarding Slider