Flutter アニメーション付きのページインジケーターのライブラリ紹介

今回はPageViewなど横スクロールしてページを切り替えれるようなページを実装する際にあると便利なページインジケーターのライブラリ紹介です。

smooth_page_indicatorというライブラリです。

smooth_page_indicator | Flutter package

Customizable animated page indicator with a set of built-in effects.

pub.dev

こちらは様々なアニメーション付きのページインジケーターをお手軽に実装できるライブラリとなっています。

SmoothPageIndicatorというWidgetが用意されており、そこにcontrollerと使いたいアニメーションのeffectを指定するといった感じになっています。

SmoothPageIndicator(  
   controller: controller,  // PageController  
   count:  6,  
   effect:  WormEffect(),  // effect  
   onDotClicked: (index){  
         
   }  
)  

用意されているeffectは10以上と豊富です。

また、PageControllerがいらないAnimatedSmoothIndicatorというWidgetも用意されています。

AnimatedSmoothIndicator(  
   activeIndex: index,  
   count: 5,  
   effect: WormEffect(),  
)  

アニメーション付きのページインジケーター実装したいなという時は、非常に便利なライブラリかと思います。
ぜひ使ってみてください。