scrollable 1.0.2

A powerful set of scrollable widgets including haptics, keyboard dismissing, and more.

🔥 A powerful set of scrollable widgets: haptics, keyboard dismissing, and more 🔥

• Submit an issue here.
• Create a pull request here.
• Contact me via email here.

3 Widgets in this package 📚

💥 ScrollHaptics

• Applies haptic feedback when its child is scrolled (during scroll & reaching edge of scroll view).

💥 KeyboardDismiss

• Dismisses the soft-keyboard when its child is scrolled, or tapped.

💥 ScrollableView

• The above 2 widgets combined into 1 widget for ease-of-use.

Example Gif 📸

It's hard to display haptics in a gif, but they're there.

Installing 🧑‍🏫

• Install the package from the pub.
  • flutter pub add scrollable
• Import the package.
  • import 'package:scrollable/exports.dart';

Quick Start 💨

Simply wrap whatever you want inside the ScrollHaptics, KeyboardDismiss, or ScrollableView widgets, then edit whatever of their properties you want!

Short Examples of the 3 Widgets 📜

For a full example with context, view the examples tab. It shows just the ScrollableView, but it's the same layout for all 3 widgets.

Scroll Haptics

ScrollHaptics

ScrollHaptics(
        // <Assorted Properties Here>
        child: SingleChildScrollView(
          child: Column(
            children: [
              Container(height: 100, width: 100, color: Colors.redAccent),
              Container(height: 100, width: 100, color: Colors.blue),
              Container(height: 100, width: 100, color: Colors.purple),
            ],
          ),
        ),
      );

Keyboard Dismiss

KeyboardDismiss

KeyboardDismiss(
          // <Assorted Properties Here>
        child: SingleChildScrollView(
          child: Column(
            children: [
              Container(height: 100, width: 100, color: Colors.redAccent),
              Container(height: 100, width: 100, color: Colors.blue),
              Container(height: 100, width: 100, color: Colors.purple),
            ],
          ),
        ),
      );

Scrollable View

ScrollableView

ScrollableView(
          // <Assorted Properties Here>
        controller: ScrollController(),
        child: SingleChildScrollView(
          child: Column(
            children: [
              Container(height: 100, width: 100, color: Colors.redAccent),
              Container(height: 100, width: 100, color: Colors.blue),
              Container(height: 100, width: 100, color: Colors.purple),
            ],
          ),
        ),
      );

Properties of the 3 Widgets 📜

Scroll Haptics

ScrollHaptics

Highly reccomended to use ClampingScrollPhysics for the physics of whatever scrollable you're wrapping, as it works best with haptics.

• child (required): This widget's child.
• bubbleUpScrollNotifications: Whether the widget should bubble up scroll notifications, or block them.
• heavyHapticsAtEdgeEnabled: When a scroll reaches the edge, if there should be a haptic effect emitted.
• hapticEffectAtEdge: Which kind of haptic effect should be emitted when the scroll edge is reached?
• hapticEffectDuringScroll: Which kind of haptic effect should be emitted during the scroll.
• distancebetweenHapticEffectsDuringScroll: The distance, in pixels, that should be scrolled before emitting a new haptic scroll effect.

Keyboard Dismiss

KeyboardDismiss

• child (required): This widget's child.
• bubbleUpScrollNotifications: Whether the widget should bubble up scroll notifications, or block them.
• closeKeyboardOnTap: If the keyboard should also be closed just on the widget being tapped.

Scrollable View

ScrollableView

• child (required): This widget's child.
• controller (required): A ScrollController to manage the scrolling of the widget.
• bubbleUpScrollNotifications: Whether the widget should bubble up scroll notifications, or block them.
• closeKeyboardOnScroll: Whether the keyboard should be automatically closed on the widget being scrolled.
• closeKeyboardOnTap: If the keyboard should also be closed just on the widget being tapped.
• physics: Physics of the scroll view. Highly reccomended to use ClampingScrollPhysics as it works best with haptics.
• scrollDirection: Direction of the scroll.
• inlineBottomOrRightPadding: Inline padding of the scroll view. This is a clean substitute to having to add SizedBox widgets inside your scroll view. For the bottom (if vertical) or right (if horizontal) of the scroll view.
• inlineTopOrLeftPadding: Inline padding of the scroll view. This is a clean substitute to having to add SizedBox widgets inside your scroll view. For the top (if vertical) or left (if horizontal) of the scroll view.
• padding: Outer padding of the widget.
• hapticsEnabled: If haptics should be enabled.
• distancebetweenHapticEffectsDuringScroll: The distance, in pixels, that should be scrolled before emitting a new haptic scroll effect.
• heavyHapticsAtEdgeEnabled: If the haptics when the edge of the scroll is reached should be enabled or not.
• hapticEffectAtEdge: Which kind of haptic effect should be emitted when the scroll edge is reached?
• hapticEffectDuringScroll: Which kind of haptic effect should be emitted during the scroll.
• primary: Whether this is the primary scroll view associated with the parent PrimaryScrollController.
• dragStartBehavior: Determines the way that drag start behavior is handled.
• restorationId: Restoration ID to save and restore the scroll offset of the scrollable.
• reverse: Whether the scroll view scrolls in the reading direction.

Additional Info 📣

• The package is always open to improvements, suggestions, and additions!

• I'll look through PRs and issues as soon as I can!

• Learn about me.