2

I'm working on a refactored code to separated small piece of widgets. There's several columns with TextFields in each one of them.I have two options to complete the task :

  1. Choosing StatelessWidget since it have more performance, may put TextEditingController related code outside of sub widgets. Or include some logic in onChanged event. but still there's some events like clear text can't put in onChanged event

  2. Choosing StatefulWidget if I use TextEditingController include inside each sub widget.

How to choose between StatelessWidget and StatefulWidget when refactoring code into small widgets like this ?

Update

Here's my current conclusion which can be updated if it's not correct.

  • Prefer to put FocusNode of TextEditin parent since it's related to brother focusNode & parentNode;
  • Prefer to put TextEdtingController in parent, which will be useful in cases like when TextField is out of screen like a ListItem scrolled out of the screen, which will make the whole widget unmounted. The state will be preserved.
  • Preferring to put animation self like shaking TextField when inputting something wrong in self. Since it's a feature of the TextField not related to the parent.
Mazin Ibrahim
  • 7,433
  • 2
  • 33
  • 40
JerryZhou
  • 4,566
  • 3
  • 37
  • 60

1 Answers1

1

Edit in response to the discussion in the comments section:

You should go with the second approach when refactoring your code into smaller StatefulWidgets. And the parent should have a function to alter the nested TextFields' content and its animation behavior by calling functions inside it, as you earlier indicated you need to manage this behavior.

Mazin Ibrahim
  • 7,433
  • 2
  • 33
  • 40
  • What about clear text logic, which more like the sub widget’s feature self, to implement it I include TextEditingController which need StafulWidget – JerryZhou May 25 '19 at 12:44
  • And animation part I currently have a global animation to control TextField, after refactor, I can use StatefulWidget’s property for all of them, but what about animation which more like TextField self feature, to include animation controller , still need use Stateful Widget. – JerryZhou May 25 '19 at 12:49
  • @JerryZhou I guess you need to make to `parent` `StatefulWidget` too, since it's the only way to alter its state using `clear()`. And for the animation part of the `TextField`, again you're right. I guess my answer need a revision. – Mazin Ibrahim May 25 '19 at 12:56
  • Another way is to put most of static UI in with const when possible even in StatefulWidget to improve performance – JerryZhou May 25 '19 at 13:01
  • Using `const` may cause problems sometimes, I remember one question here where someone was complaining about a strange in its `build` function. Turned out to be solved by eliminating `const`. – Mazin Ibrahim May 25 '19 at 13:05
  • for clear() function , you prefer use only one TextEdtingController in parent widget then use as many as Textfield in each to controller it self? – JerryZhou May 25 '19 at 13:06
  • You say linking all of them with one `TextEditingController` ? – Mazin Ibrahim May 25 '19 at 13:08
  • ah , no, I mean put all TextEdtingControllers together in one parent widget – JerryZhou May 25 '19 at 13:09
  • Let us [continue this discussion in chat](https://chat.stackoverflow.com/rooms/193922/discussion-between-mazin-ibrahim-and-jerryzhou). – Mazin Ibrahim May 25 '19 at 13:10