- A Flutter package for simple material design app intro screens with some cool animations.
- Free tutorial
- Rating: 2.5 out of 52.5 (119 ratings)
- 7,344 students
- 31min of on-demand video
- Created by Ahmed Zeyada
English
What you’ll learn
- build Intro Views Flutter
Requirements
- VS Code
Description
A Flutter package for simple material design app intro screens with some cool animations.
Table of contents #
- Features
- Getting Started
- Usage
- Documentation
- PageViewModel Class
- IntroViewFlutter Class
- Bugs or Requests
- Donate
- Contributors
- License
Features #
- Easy addition of pages.
- Circular page reveal.
- Cool Animations.
- Animation control, if the user stops sliding in the midway.
- Skip button, for skipping the app intro.
- Custom font selection.
- Material Design.
Getting Started #
You should ensure that you add the intro_views_flutter as a dependency in your flutter project.
dependencies:
intro_views_flutter: ‘^2.8.0’
You should then run flutter packages get in your terminal so as to get the package.
Usage #
- IntroViewsFlutter widget require a list of PageViewModel , and some other parameters. Refer the code below to create a PageViewModel page.Final page = new PageViewModel( pageColor: const Color(0xFF607D8B), iconImageAssetPath: ‘assets/taxi-driver.png’, iconColor: null, bubbleBackgroundColor: null, body: Text( ‘Easy cab booking at your doorstep with cashless payment system’, ), title: Text(‘Cabs’), mainImage: Image.asset( ‘assets/taxi.png’, height: 285.0, width: 285.0, alignment: Alignment.center, ), titleTextStyle: TextStyle(fontFamily: ‘MyFont’, color: Colors.white), bodyTextStyle: TextStyle(fontFamily: ‘MyFont’, color: Colors.white), );
- Now refer the code below to get the IntroViewsFlutter widget.final Widget introViews = new IntroViewsFlutter( [page], onTapDoneButton: (){ //Void Callback }, showSkipButton: true, pageButtonTextStyles: new TextStyle( color: Colors.white, fontSize: 18.0, fontFamily: “Regular”, ), );
For further usage refer the example available.For Landscape preview click the link.Note : If you added more than four pages in the list then there might be overlapping between page icons and skip button, so my suggestion is just make the showSkipButton: false.
Who this course is for:
- Students
- Mobile Developers
- Flutter Learner
Show less
Course content
1 section • 6 lectures • 31m total length
Intro Views Flutter6 lectures • 32min
- 1- Install The Package06:36
- 2- Create IntroViewFlutter07:29
- 3- Create Page in App05:36
- 4- Try The Package05:47
- Finish05:47
- main.dart00:32
