Flutter package to create Pin code input text field with every pixel customization possibility 🎨 with beautiful animations, iOS autofill, Android autofill
We love Pinput's UI and capabilities for entering typical 4-6 length pin codes. However, when faced with a very large key codes which are typical used for activating product keys or gift codes, it forces every input to stay inside a single row... With a 16-length gift code like we use, plus a few - to separate the code for easier readability, it makes it impossible to achieve a pleasant UI.
After checking the package code for a bit I experimented with switching the Row widget which holds the inputs to a Wrap. It holds the same row-like structure up to the point where it needs to shrink. It is also very customizable, which is good for fitting into various UI layouts.
It worked perfectly for us (as you can see in the screenshots below) and we're wondering if this would be a good addition to the package itself. Perhaps adding a 2nd widget or constructor which uses Wrap instead of Row is preferable, but I think that is up to the package owner to decide. Here are the small changes we did in order to make it work.
We love Pinput's UI and capabilities for entering typical 4-6 length pin codes. However, when faced with a very large key codes which are typical used for activating product keys or gift codes, it forces every input to stay inside a single row... With a 16-length gift code like we use, plus a few
-
to separate the code for easier readability, it makes it impossible to achieve a pleasant UI.After checking the package code for a bit I experimented with switching the
Row
widget which holds the inputs to aWrap
. It holds the same row-like structure up to the point where it needs to shrink. It is also very customizable, which is good for fitting into various UI layouts.It worked perfectly for us (as you can see in the screenshots below) and we're wondering if this would be a good addition to the package itself. Perhaps adding a 2nd widget or constructor which uses
Wrap
instead ofRow
is preferable, but I think that is up to the package owner to decide. Here are the small changes we did in order to make it work.