My goto flutter packages
Well, it's not a hidden fact that I'm a flutter dev and have encountered various dart packages across my small year-long journey, so here's a list of some flutter dependencies which I use in almost all my projects:
Material and Cupertino icons already included in flutter SDK (Cupertino icons is an added dependency but it's there by default) are really good and sometimes you wanna branch out and move to other design languages. Coming from web background I always had almost infinite options to select from, This package brings the most famous ones directly into fluter:
these include famous ones like:
- Ant design
- font awesome
- font awesome 5
- feather icons
- Ionic icons and many more...
I usually don't like using dart packages for UI but this one is really great, it's my go-to bottom navigation bar, the implementation is amazing, the amount of customisation is great and i love the way it looks
I think it looks really good and this package covers my need for any kinda bottom bar.
This is an animation package which provides you with really good looking high-end animation to bring your app to life, you can replace the boring old CircularProgressIndicator() with Lottie animations.
Now, this is a place where a lot of people would argue that rive/flare is much better because they worked closely with flutter team, well true they did work with flutter team but the point is Lottie has been doing this for much much longer and already supports all platforms that's why they much-assorted array docs and has a lot more community-sourced animation than rive and personally I have had a better developer experience with Lottie then with rive.
Well, this is a great one, remember those times. when you are using an emulator and it starts spitting java or swift logs right on the debug console and you can't find your print statements 😢.
Well, that's why I prefer Logger a dependency made by Simon Leier, the creator of hivedb a NoSQL database for flutter. Well, I don't really need to talk a lot about this let me just show you the logs that this package prints.
Another part you don't really need to connect your phone to laptop and try recreating that one bug which random appeared from nowhere, at least on your dev builds you can add a button that directly opens the logger console on the app.
LogConsole.open(context) add a button that runs this function and viola you have a console on your app showing the logs
Well, this package deserves a blog on it own, this is my goto solution to text scaling and responsiveness in general. It's a package that lets you define the size of the device that using to make the designs and then it handles the text scaling and other nicknack given you use ScreenUtil().foo to define the values. It mostly handles all my responsiveness needs.
Note: using this doesn't mean you don't have to write media queries, all it does is reduces the number of media queries you write by a long shot
Well, I really don't need to talk about it, and honestly, I ain't qualified enough to talk provider or complex state management like BLoc or riverpod. I haven't really explored this a lot but I mostly find everything that I want to do can be done with provider so I don't wander a lot.
Ever got into the mess where no matter what you try a simple error,
Scaffold.of(context) context does not contain a Scaffold ??
Trying to show a snackbar to tell your user something happened and all you get is an error, well here's a solution. Flutter Toast is a buildContext free toast package that works on both iOS and Android. This gives you more than enough customisation to make it look like to want it to
Flutter is not an HTML renderer and hence does not support SVGs right of the back. So here's a package which until a few months ago had the most reliable SVG support for flutter. Sadly It has not been working with flutter 1.22 as of right now but I still put it in the list as it has some community support and I am hoping they soon release and update and fix it.
Ever wanted to open a link from inside your app ??
Well URL launcher can let you do that, not just that we can also open the dialer by changing the protocol from HTTP to tel so launch('tel:8888888888') opens the dialer using mailto: we can change to the default email client and same works for SMS with sms: protocol
Ever wondered how Instagram has that blur version of image right before it loads up the proper version of the image? Well, I don't know how they do it, I for sure how to implement that, with a package called blurhash.
You can use your backend microservice to generate a hash for every image upload and send that hash along with the image then you can use the blurhash package like
AspectRatio(
aspectRatio: 1.6,
child: BlurHash(hash: "L5H2EC=PM+yV0g-mq.wG9c010J}I"),
),
The blurhash widget takes in a hash, shows that until the network image is completely loaded and then shows that
Brings functionality to execute code after the first layout of a widget has been performed, i.e. after the first frame has been displayed.
Add with AfterLayoutMixin<MyWidget> mixin to your State<MyWidget> class and then implement the void afterFirstLayout(BuildContext context) abstract method. Code in this method will be called the first time this widget is laid out on the screen.
