flutter_walkthrough_screen 2.0.2 copy "flutter_walkthrough_screen: ^2.0.2" to clipboard
flutter_walkthrough_screen: ^2.0.2 copied to clipboard

A flutter package which help developer in creating a customize onboarding screens of their app.

Flutter Walkthrough Screen #

A flutter package which help developer in creating a customize onboarding screens of their app.

Bitbucket open issues

Screenshots #

Usage #

Example

To use this package :

  dependencies:
    flutter:
      sdk: flutter
    flutter_walkthrough_screen:
copied to clipboard

How to use #

class TestScreen extends StatelessWidget {
    /*here we have a list of OnbordingScreen which we want to have, each OnbordingScreen have a imagePath,title and an desc.
      */
  final List<OnbordingData> list = [
      OnbordingData(
        image: AssetImage("images/pic1.png"),
        titleText:Text("This is Title1"),
        descText: Text("This is desc1"),
      ),
       OnbordingData(
        image: AssetImage("images/pic2.png"),
        titleText:Text("This is Title2"),
        descText: Text("This is desc2"),
      ),
       OnbordingData(
        image: AssetImage("images/pic3.png"),
        titleText:Text("This is Title3"),
        descText: Text("This is desc4"),
      ),
       OnbordingData(
        image: AssetImage("images/pic4.png"),
        titleText:Text("This is Title4"),
        descText: Text("This is desc4"),
      ),
    ];

  @override
  Widget build(BuildContext context) {
    /* remove the back button in the AppBar is to set automaticallyImplyLeading to false
  here we need to pass the list and the route for the next page to be opened after this. */
    return IntroScreen(
                 onbordingDataList: list,
                 colors: [
                   //list of colors for per pages
                   Colors.white,
                   Colors.red,
                 ],
                 pageRoute: MaterialPageRoute(
                   builder: (context) => NextPage(),
                 ),
                 nextButton: Text(
                   "NEXT",
                   style: TextStyle(
                     color: Colors.purple,
                   ),
                 ),
                 lastButton: Text(
                   "GOT IT",
                   style: TextStyle(
                     color: Colors.purple,
                   ),
                 ),
                 skipButton: Text(
                   "SKIP",
                   style: TextStyle(
                     color: Colors.purple,
                   ),
                 ),
                 selectedDotColor: Colors.orange,
                 unSelectdDotColor: Colors.grey,
               );
  }
}
copied to clipboard

Customize your onboarding screen design #

Background color Background gradient color
Last page button Next page button
Skip button Define next page route
Selected dot Color Unselected dot Color

Created & Maintained By #

Tushar Nikam

  Stackoverflow Buy Me A Coffee

26
likes
145
points
171
downloads

Publisher

unverified uploader

Weekly Downloads

2024.08.08 - 2025.02.20

A flutter package which help developer in creating a customize onboarding screens of their app.

Repository (GitHub)

Documentation

API reference

License

MIT (license)

Dependencies

flutter

More

Packages that depend on flutter_walkthrough_screen