flutter_onboarding_package 1.0.0

A beautiful and customizable onboarding package with animated gradient buttons and smooth page transitions.

example/lib/main.dart

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

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Onboarding Example',
      theme: ThemeData(
        primarySwatch: Colors.blue,
        useMaterial3: true,
      ),
      home: const OnboardingExample(),
    );
  }
}

class OnboardingExample extends StatelessWidget {
  const OnboardingExample({super.key});

  @override
  Widget build(BuildContext context) {
    return OnboardingScreen(
      pages: [
        const OnboardingPage(
          imageUrl: 'assets/images/onboarding1.png',
          title: 'Welcome to Our App',
          subtitle:
              'Discover amazing features and start your journey with us today',
        ),
        const OnboardingPage(
          imageUrl: 'assets/images/onboarding2.png',
          title: 'Easy to Use',
          subtitle: 'Simple and intuitive interface designed for everyone',
        ),
        const OnboardingPage(
          imageUrl: 'assets/images/onboarding3.png',
          title: 'Get Started Now',
          subtitle:
              'Join thousands of happy users and experience the difference',
        ),
      ],
      onFinish: () {
        // Navigate to your home screen
        Navigator.pushReplacement(
          context,
          MaterialPageRoute(builder: (context) => const HomeScreen()),
        );
      },
      // Customization options
      primaryColor: const Color(0xFF1D3A4B),
      secondaryColor: const Color(0xFF56AEBF),
      nextButtonText: 'Next',
      finishButtonText: 'Get Started',

      // Optional: Add custom arrow icon
      buttonIcon: const Icon(
        Icons.arrow_forward,
        color: Colors.white,
      ),

      // Optional: Custom text styles
      titleTextStyle: const TextStyle(
        fontSize: 36,
        fontWeight: FontWeight.bold,
        color: Color(0xFF1D3A4B),
      ),
      subtitleTextStyle: const TextStyle(
        fontSize: 20,
        fontWeight: FontWeight.w400,
        color: Color(0xFF7C7C7C),
      ),
    );
  }
}

// Dummy home screen for example
class HomeScreen extends StatelessWidget {
  const HomeScreen({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('Home Screen'),
      ),
      body: const Center(
        child: Text(
          'Welcome to the app!',
          style: TextStyle(fontSize: 24),
        ),
      ),
    );
  }
}