gapplus 1.0.0 gapplus: ^1.0.0 copied to clipboard
Flutter widgets for easily adding gaps inside Flex widgets such as Columns and Rows or scrolling views.
Gap #
Flutter widgets for easily adding gaps inside Flex widgets such as Columns and Rows or scrolling views.
Introduction #
When it comes to add empty space between widgets inside a Column
or a Row
, we have multiple options:
- We can either add a
Padding
around these widgets but it's very verbose - Or we can add
SizedBox
widgets between them.
Gap
is another option. It's like SizedBox
but you don't have to know if it's inside a Row
or a Column
. So that it's less verbose than using a SizedBox
.
Getting started #
In your library add the following import:
import 'package:gapplus/gapplus.dart';
Then you just have to add a Gap
inside a Column
or a Row
with the specified extent.
return Column(
children: <Widget>[
Container(color: Colors.red, height: 20),
const Gap(20), // Adds an empty space of 20 pixels.
Container(color: Colors.red, height: 20),
],
);
The Gap
widget also works inside Scrollable
widgets such as ListViews
. In these cases, it will occupy the space in the same direction as the Scrollable
.
MaxGap #
This package also comes with a MaxGap
widget.
The MaxGap
widget will try to fill the available space in a Column
or a Row
with the specified size. If the available space
is lesser than the specified size, the MaxGap
widget will only take the available space.
It's useful when you want to have a gapplus that shrinks to avoid an overflow otherwise.
Other parameters #
By default a Gap
will have no extent in the opposite direction of the Flex
parent.
If you want the Gap
to have a color, you'll have to set the color
and the crossAxisExtent
parameters.
You can also use the Gap.expand
constructor to expand the Gap
in the opposite direction of the Flex
parent.
SliverGap #
There is also a Sliver version of the Gap
widget:
return CustomScrollView(
slivers: <Widget>[
const SliverGap(20), // Adds an empty space of 20 pixels.
],
);
Changelog #
Please see the Changelog page to know what's recently changed.
Contributions #
Feel free to contribute to this project.
If you find a bug or want a feature, but don't know how to fix/implement it, please fill an issue.
If you fixed a bug or implemented a feature, please send a pull request.