Flutter PageViewIndicator

Pub Version

Builds indicators marks for PageView from any widget it's very customizable.

To get started you need to install our plugin and that's very easy

Installation

  1. add this to your packages pubspec.yaml file:
dependencies:
  flutter_page_view_indicator: ^0.0.3
  1. Install it You can install it from the command line:
$ flutter pub get

if you use Android Studio or Intellij just click pub get.

  1. Import it Now in Dart code, you can use:
import 'package:flutter_page_view_indicator/flutter_page_view_indicator.dart';

Using

You need to use just the following code:

PageViewIndicator(
    length: screens.length,
    currentIndex: currentIndex,
),

Example 1

this a default indicators, when you want to customize the indicators you can do it just passing a property which you want.

PageViewIndicator(
   length: length,
   currentIndex: currentIndex,
   otherItemWidth: 20,
   otherItemHeight: 8,
),

Example 2

PageViewIndicator(
   length: length,
   currentIndex: currentIndex,
   indicatorMargin: EdgeInsets.all(5),
   borderRadius: BorderRadius.circular(5),
),

Example 3

This an Example of a full property :

PageViewIndicator(
   length: screens.length,
   currentIndex: currentIndex,
   currentItemColor: Colors.teal,
   otherItemColor: Colors.grey.shade800,
   currentItemWidth: 15,
   currentItemHeight: 15,
   otherItemWidth: 15,
   otherItemHeight: 15,
   indicatorMargin: EdgeInsets.all(5),
   borderRadius: BorderRadius.circular(9999),
   alignment: MainAxisAlignment.center,
   animationDuration: Duration(milliseconds: 750),
   direction: Axis.horizontal,
),

So how did you see you do not need to write too much code in the first case if you use the default indicators.

Libraries

flutter_page_view_indicator