Flutter Scrolling Fab Animated #

This package is a floating button whose change of size when scroll down and return to its original size when on top again. It's useful with ListView widget and other scrollable widgets.

Instalation #

Include flutter_scrolling_fab_animated in your pubspec.yaml file:

dependencies:
  flutter:
    sdk: flutter
  flutter_scrolling_fab_animated: version

Usage #

To use this package, just import it into your file and enjoy it.

import 'package:bottom_sheet_expandable_bar/bottom_sheet_bar_icon.dart';
import 'package:flutter_scrolling_fab_animated/flutter_scrolling_fab_animated.dart';

...

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Flutter Scrolling Fab Animated Demo'),
      ),
      body: Container(
        child: new ListView.builder(
          controller: _scrollController,
          itemCount: items.length,
          itemBuilder: (BuildContext ctxt, int index) {
            return new Card(
              child: ListTile(
                title: Text(items[index]),
              )
            );
          }
        ),
      ),
      floatingActionButton: ScrollingFabAnimated(
        icon: Icon(Icons.add, color: Colors.white,),
        text: Text('Add', style: TextStyle(color: Colors.white, fontSize: 16.0),),
        onPress: (){},
        scrollController: _scrollController,
      )
    );
  }

...

Example with a GridView

import 'package:bottom_sheet_expandable_bar/bottom_sheet_bar_icon.dart';
import 'package:flutter_scrolling_fab_animated/flutter_scrolling_fab_animated.dart';

...

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Flutter Scrolling Fab Animated Demo'),
      ),
      body: Container(
        child: new GridView.builder(
          gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(crossAxisCount: 2),
          controller: _scrollController,
          itemCount: items.length,
          itemBuilder: (BuildContext ctxt, int index) {
            return new Card(
              child: ListTile(
                title: Center(child: Text(items[index])),
              )
            );
          }),
      ),
      floatingActionButton: ScrollingFabAnimated(
        icon: Icon(Icons.add, color: Colors.white,),
        text: Text('Add', style: TextStyle(color: Colors.white, fontSize: 16.0),),
        onPress: (){},
        scrollController: _scrollController,
      )
    );
  }

...

Properties #