Builds indication marks for PageView.
import 'package:page_view_indicator/page_view_indicator.dart';return PageViewIndicator(
pageIndexNotifier: pageIndexNotifier,
length: length,
normalBuilder: (animationController, index) => Circle(
size: 8.0,
color: Colors.black87,
),
highlightedBuilder: (animationController, index) => ScaleTransition(
scale: CurvedAnimation(
parent: animationController,
curve: Curves.ease,
),
child: Circle(
size: 12.0,
color: Colors.black45,
),
),
);return PageViewIndicator(
pageIndexNotifier: pageIndexNotifier,
length: length,
normalBuilder: (animationController, index) => Circle(
size: 8.0,
color: Colors.black87,
),
highlightedBuilder: (animationController, index) => ScaleTransition(
scale: CurvedAnimation(
parent: animationController,
curve: Curves.ease,
),
child: Circle(
size: 8.0,
color: Colors.white,
),
),
);It's not just about dots!
return PageViewIndicator(
pageIndexNotifier: pageIndexNotifier,
length: length,
normalBuilder: (animationController, index) => ScaleTransition(
scale: CurvedAnimation(
parent: animationController,
curve: Curves.ease,
),
child: Icon(
Icons.favorite,
color: Colors.black87,
),
),
highlightedBuilder: (animationController, index) => ScaleTransition(
scale: CurvedAnimation(
parent: animationController,
curve: Curves.ease,
),
child: Icon(
Icons.star,
color: Colors.white,
),
),
);You can change the padding around the indicators using the indicatorPadding property:
return PageViewIndicator(
pageIndexNotifier: pageIndexNotifier,
length: length,
indicatorPadding: const EdgeInsets.all(4.0)
...Default is const EdgeInsets.all(8.0).