Paddinger is a new package to help you deal with Flutter paddings and here you’ll discover how!
Have you ever been tired of writing Padding and EdgeInsets boilerplate everytime you need to add padding to a widget? I was, so I started looking for something to simplify this task. Furthermore, the necessary code to create declarative UIs can become very long and difficult to read, so, if there is a way to reduce it even by a few lines it’s something always worth to be considered.
I found out I was not the only one who was tired of this Padding boilerplate because, searching for a solution, I found someone else struggling with the same problem. One of the solution I found was Padder, which is available on Github and on pub.dev. It’s a cool set of widgets which can help you dealing with paddings.
Unfortunately, it was not what I was looking for, but having found valid proofs that there was a problem affecting someone else other than me, I decided to build what I needed on my own, and so Paddinger was born.
What is Paddinger?
Paddinger is a code generator for Flutter: it builds Padding widgets for you based on the values you have in your design system. An example is worth a thousand words, so here it is. Assuming you have
const double PADDING_NORMAL = 8;
with Paddinger you will obtain a set of widgets like
NormalAllPadding NormalLeftPadding NormalTopPadding NormalRightPadding NormalBottomPadding NormalHorizontalPadding NormalVerticalPadding NormalLeftTopPadding NormalLeftBottomPadding NormalRightTopPadding NormalRightBottomPadding
just by annotating with
@paddinger the constants you want the widgets to be generated for, like
@paddinger const double PADDING_NORMAL = 8;
Then, you can use the generated widgets like every other one. Assuming you want to give a padding of 8 to a Text, instead of writing
Padding( padding: const EdgeInsets.all(PADDING_NORMAL), child: Text( 'MyText', ), )
you can just write
NormalAllPadding( child: Text( 'MyText', ), )
which imho is far easier to remember, to write, to read and IDE code completion will come to rescue!
How to use Paddinger in your project?
- First of all, add Paddinger as a dependency:
dependencies: paddinger_annotations: [latestVersionHere] dev_dependencies: paddinger: [latestVersionHere]
- Create a file where you will add all your
PADDING_constants, the file could be named
- Add your favourite
// ignore: unused_import import 'package:flutter/material.dart';
- Add the
Now run the code generation with
flutter pub run build_runner build --delete-conflicting-outputs and your widgets will be generated and ready to be used!