Dough—A tool to help you create squishy UI effects in Flutter
I’ve worked on a few Flutter projects in the past where I needed to create squishy UI effects. I searched around for packages that had this feature, but to no avail. Because of this, I’ve decided to create an open-source library called Dough which allows you to create all sorts of dough-like squish effects in Flutter.
This package offers a variety of Dough widgets (widgets that are squishy). The API for this package is in a stable state, but a few minor details may change as new features are added. If you have any suggestions, feel free to contribute or create a ticket.
Why Use Dough?
Engaging—Stagnant UI can be boring. Many apps created today are purely functional; they just perform their job. This is fine, but it can also feel lifeless.
Without sacrificing functionality for any UI, I created the Dough package to pleasantly surprise users with an engaging user experience through the use of squishy widgets.
Extendable—I designed the API for the Dough package to be highly extendable. If you need a feature, you can override behaviors to fit your needs. You can view the source code for more info on how to override behaviors.
Dough Widgets
This package provides some Dough widgets out of the box, and more will be added as time goes on.
This section only gives a brief overview of how to use Dough widgets. If you want more details and concrete examples of Dough widget usage, check out the example project provided in the source code.
Pressable Dough
This widget can be used to make any stagnant widget immediately more interactive. When a user presses and drags on any widget wrapped in a PressableDough widget, that widget will morph to match the user’s input gestures.
Draggable Dough
This widget extends the behavior of Flutter’s built-in Draggable widget. By using this widget, you can achieve the same dragging behavior as the default Draggable widget, only this time, the UI will be squishy!
Custom Dough Widget
If you want to create your own dough-like widget, you can use the native Dough widget itself (all of the provided Dough widgets use this internally).
You can check out the example widget provided in the source code for more details on how to create a custom dough-like widget. But, here’s the gist of how to do this…
Customize How the Dough Feels
If you don’t like the default Dough settings, you can easily change them. Just wrap any widget that uses the native Dough widget in a DoughRecipe widget and you’re good to go.
Conclusion
I hope you found this article helpful and I hope the Dough package helps you with your projects! Of course, you are more than welcome to contribute to the package if you have something you think would help the community.
