flutter_spotlight_tour 1.0.0

A lightweight Flutter onboarding spotlight tour package with smooth step-by-step highlights, animations, and customizable guided walkthroughs for apps.

example/lib/main.dart

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

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

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

  @override
  Widget build(BuildContext context) {
    return const MaterialApp(home: Home());
  }
}

class Home extends StatefulWidget {
  const Home({super.key});

  @override
  State<Home> createState() => _HomeState();
}

class _HomeState extends State<Home> {
  final controller = SpotlightTourController();

  final key1 = GlobalKey();
  final key2 = GlobalKey();
  final key3 = GlobalKey();

  @override
  void initState() {
    super.initState();

    WidgetsBinding.instance.addPostFrameCallback((_) {
      controller.start(context, [
        SpotlightTourItem(
          key: key1,
          title: "Home",
          description: "Main dashboard",
        ),
        SpotlightTourItem(
          key: key2,
          title: "Search",
          description: "Find anything",
        ),
      ]);
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          ElevatedButton(
            key: key1,
            onPressed: () {},
            child: const Text("Home"),
          ),
          const SizedBox(height: 40),
          ElevatedButton(
            key: key2,
            onPressed: () {},
            child: const Text("Search"),
          ),
        ],
      ),
    );
  }
}