flutter_space 0.0.2 copy "flutter_space: ^0.0.2" to clipboard
flutter_space: ^0.0.2 copied to clipboard

A Flutter package to create flexible, intuitive, and customizable spacing in your layouts, inspired by [`package:gap`](https://pub.dev/packages/gap) but improved and more powerful.

Space #

A Flutter package to create flexible, intuitive, and customizable spacing in your layouts, inspired by package:gap but improved and more powerful.

With Space, you can add consistent spacing between widgets, create sliver gaps in scrollable areas, and even build flexible layouts with adaptive space. Works perfectly with Flutter's Column, Row, Flex, CustomScrollView, and other sliver-based scrollable widgets.


Features #

  • Easy-to-use spacing widgets for both regular layouts and slivers.
  • Supports numeric spacing (double) or predefined spacing enums (Spacing.tiny, Spacing.large, etc.).
  • Sliver-compatible: use SliverSpace for scrollable areas.
  • Flexible and adaptive space with MaxSpace.
  • Optional color parameter for debugging or visual separation.
  • Improved API inspired by package:gap, with more customization options.
  • Multiple constructors for quick predefined spacing:
    • Space.small()
    • Space.medium()
    • Space.large()
    • Space.extraLarge(), etc.

Installation #

Add this to your pubspec.yaml:

dependencies:
  flutter_space: ^0.0.2

Then run:

flutter pub get

or

flutter pub add flutter_space

Usage #

Regular space #

Column(
  children: [
    Text('Hello'),
    Space(20), // 20 pixels of space
    Text('World'),
    Space(Spacing.large), // Predefined large spacing
  ],
)

Using predefined sizes #

Column(
  children: [
    Text('Tiny space above'),
    Space.tiny(),
    Text('Extra large space below'),
    Space.extraLarge(),
  ],
)

Flexible space in layouts #

Row(
  children: [
    Text('Start'),
    MaxSpace.fill(), // takes all remaining space
    Text('End'),
  ],
)

Sliver spacing #

CustomScrollView(
  slivers: [
    SliverAppBar(title: Text('Header')),
    SliverSpace(20), // 20 pixels of sliver space
    SliverSpace.large(), // Predefined large sliver space
    SliverList(
      delegate: SliverChildBuilderDelegate(
        (context, index) => ListTile(title: Text('Item $index')),
        childCount: 10,
      ),
    ),
  ],
)

Predefined Spacing Enum #

enum Spacing {
  tiny,        // small value
  extraSmall,  
  small,
  medium,
  large,
  extraLarge,
  huge,
  massive,
}

Use like this:

Space(Spacing.large)
SliverSpace(Spacing.medium)

Debugging #

Optionally, you can add a color to make spaces visible for layout debugging:

Space.large(color: Colors.red.withOpacity(0.3))
SliverSpace.medium(color: Colors.blue.withOpacity(0.3))

Why Space? #

  • Flexible: Works with both fixed and adaptive layouts.
  • Sliver-ready: Perfect for scrollable UI designs.
  • Developer-friendly: Easy constructors for common spacing.
  • Improved over gap: Adds flexibility, sliver support, and visual debugging.

Credits #

Developed by Siva Sankar Company: UpDown Co

Inspired by package:gap.

0
likes
150
points
29
downloads

Documentation

API reference

Publisher

unverified uploader

Weekly Downloads

A Flutter package to create flexible, intuitive, and customizable spacing in your layouts, inspired by [`package:gap`](https://pub.dev/packages/gap) but improved and more powerful.

Repository (GitHub)
View/report issues

License

MIT (license)

Dependencies

flutter

More

Packages that depend on flutter_space