alphabet_scrollbar 0.0.5 copy "alphabet_scrollbar: ^0.0.5" to clipboard
alphabet_scrollbar: ^0.0.5 copied to clipboard

an simple Alphabet-Scrollbar.

The AlphabetScrollBar Package is an Simple to use, Customizable Animated AlphabetScrollBar. You have to offer an Function where you do the Scrolling by yourself. There must be an String Parameter, where you will receive the Current Selected Letter.

Features #

it`s Possible to Change almost Everything.. the Letters that are Used, the Text-Style of the Letters, the Color of the Selected Letter, the Orientation of the Scrollbar (Left, Right, Top, Bottom, Reversed)

Click here for a simple Live-preview

Getting started #

alphabet_scrollbar: ^0.0.5
copied to clipboard
AlphabetScrollbar(
    //onLetterChange is needed and should contain a Function(String letter), where you handle your Scrolling. 
                  onLetterChange: (value) => setState(() {
                    _letter = value;
                  }),
                  reverse: false, //optional. would Reverse the Order (Z-A).
                  switchToHorizontal: false, //optional. makes the Scrollbar Horizontally not Verticaly.
                  
                  //optional. changes the side to left (if switchToHorizontal also True,Switches to Top)
                  leftSidedOrTop: false, 
                ),
copied to clipboard

Usage #

u can Simply Use this Widget. all of these Parameters (except the onLetterChange) are Optional.

AllParamsExample:

AlphabetScrollbar(
                  onLetterChange: (value) => setState(() {
                    _letter = value;
                  }),
                  style: const TextStyle(),
                  duration: const Duration(),
                  selectedLetterAdditionalSpace: 15.toDouble(),
                  selectedLetterColor: Colors.red,
                  padding: EdgeInsets.all(8),
                  factor: 30,
                  letterCollection: const ["A","B","C"],
                  reverse: false,
                  switchToHorizontal: false,
                  leftSidedOrTop: false,
                );
copied to clipboard

Minimal Params Example:

AlphabetScrollbar(
                  onLetterChange: (value) => setState(() {
                    _letter = value;
                  }),
                );
copied to clipboard

for Scrolling you have to do something like this... (Just an Example)

void _onLetterChangeExample(String letter){
    var index = _myList.indexWhere((n) =>
            n.toLowerCase().startsWith(letter.toLowerCase()));
    _scrollController.scrollTo(_itemHeight * index);
}
copied to clipboard
2
likes
120
points
92
downloads

Publisher

unverified uploader

Weekly Downloads

2024.07.08 - 2025.01.20

an simple Alphabet-Scrollbar.

Repository (GitHub)

Documentation

API reference

License

MIT (license)

Dependencies

flutter

More

Packages that depend on alphabet_scrollbar