TinoGuo / pin_input_text_field

A textField widget to help display different style pin
Apache License 2.0
374 stars 81 forks source link

Date of Birth component #21

Closed royibernthal closed 4 years ago

royibernthal commented 4 years ago

I'd like to create a date of birth component similar to the app Badoo - DD/MM/YYYY

This repo seems nearly perfect for it, except I'm not sure it supports 2 things I need: -Custom Spaces - Spaces between DD, MM and YYYY. -Text Hints - Each digit should have a hint until it's replaced with a digit. (e.g. DD/MM/YYYY -> typed 2 -> 2D/MM/YYYY)

For the spaces, I considered having 3 different components in a row, but at the very least backspace between components will like be an issue.

I suppose I could do it more easily with text masking, but it's just not as slick.

Are there any suggestions on how I can pull it off using this repo Otherwise, if it's not currently possible, would you please take it as a request to add functionalities that'd allow implementing it?

TinoGuo commented 4 years ago
  1. I would add gapSpace collections to custom for a distance of two components, except BoxTightDecoration.
  2. Text hints is a good idea and will be implemented next version.

BTW, I would consider every single word as a component. This repo still is a Pin Input Widget not a General Input Widget.

royibernthal commented 4 years ago

Thanks for the willingness to help :)

  1. Not sure I understand. Flutter gapspace collection doesn't yield any relevant results on google, and I don't see anything of the sort in this repo's API. How would you do that?

  2. Perfect, thanks.

I did consider having each word as a component, however how would you solve backspace between components? For instance, I'm on the first digit of the second component, and when I press backspace I expect to now be focused on the first component. As far as I understand flutter doesn't support detecting backspace.

Frankly if I can make the spaces between digits when it's a single component, as well as add hints, I really have no reason to have multiple components, as it gives me just what I need.

TinoGuo commented 4 years ago

LOL, gapspace collections means List<int>.

In addition, every digit refer to a component but not a widget. In this repo, I'd like to add transparent textfield in the background to receive the text changes as well as focus. And I create a paint to control the display of text and border.

TinoGuo commented 4 years ago

The final rendering if you run the latest code.

Screen Shot 2019-10-20 at 22 43 14
royibernthal commented 4 years ago

Oh. You meant you were going to add support for multiple gap spaces as well. Sorry, I didn't understand that.

Thanks a lot for adding support for both my requests :) Any idea when you'll push an official version to pub.dev?

TinoGuo commented 4 years ago

Maybe the next few days before 26th, I'd like to complete the unit test first.

royibernthal commented 4 years ago

Got it, no problem.