sliding_window_indicator 0.1.0

A Flutter PageView line indicator with a sliding visible window of lines. Ideal for carousels and galleries with many pages.

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)
• Horizontal or vertical orientation
• Customizable colors, spacing, size, and border radius
• Supports viewportFraction for peek-style PageViews
• Zero third-party dependencies beyond Flutter

Install

dependencies:
  sliding_window_indicator: ^0.1.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,
    ),
  ],
)

Customization

Parameter	Description
itemCount	Total number of pages / lines
controller	PageController driving selection
lineColor	Color of inactive lines
lineSelectedColor	Color of the selected line
lineSpacing	Gap between consecutive lines
visibleLineCount	Max lines shown in the window
orientation	Axis.horizontal or Axis.vertical
lineWidth	Length of each line along the main axis
lineHeight	Thickness of each line
lineBorderRadius	Corner radius for drawn lines
viewportFraction	Match PageController.viewportFraction when < 1.0

Example

See the example/ app for a PageView carousel with the sliding-window indicator underneath.

License

MIT