sliding_window_indicator #

A lightweight Flutter PageView line indicator with a sliding visible window.

Show a fixed number of lines while the active selection scrolls through a longer page list — ideal for carousels and galleries with many pages.

Features #

• Sliding window of lines for large itemCount
• Driven by a PageController (smooth mid-scroll interpolation)
• Tap a visible line to jump to that page (or handle via onLineTap)
• Optional wider/taller active line (activeLineWidth / activeLineHeight)
• Horizontal or vertical orientation
• Customizable colors, spacing, size, and border radius
• Supports viewportFraction for peek-style PageViews
• Accessible semantics buttons on tappable lines
• Zero third-party dependencies beyond Flutter

Install #

dependencies:
  sliding_window_indicator: ^0.2.0

import 'package:sliding_window_indicator/sliding_window_indicator.dart';

Usage #

final controller = PageController();

Column(
  children: [
    Expanded(
      child: PageView.builder(
        controller: controller,
        itemCount: 12,
        itemBuilder: (context, index) => Center(child: Text('Page $index')),
      ),
    ),
    SlidingWindowIndicator(
      itemCount: 12,
      controller: controller,
      visibleLineCount: 4,
      lineColor: Colors.grey.shade400,
      lineSelectedColor: Colors.black,
      // Tap a line to animate to that page (default).
      tapToJump: true,
    ),
  ],
)

Customization #

Example #

See the example/ app for a PageView carousel with the sliding-window indicator underneath. Tap the indicator lines to jump pages.

License #

MIT