Change the Border Color of a TextField After Input Focus

Hi I would like to know how would I go about changing the border of text input that the user has “touched” and then left. So initially I have the border - OutlineInputBorder of a textfield set to gray, then when it has focus it becomes green and when the user leaves it becomes gray again. I would like it to remain red if the textfield isn’t validated or remain green if the input is validated. How do I do this? I have the following properties of the InputDecoration on the text field

focusedBorder: OutlineInputBorder(
                                        borderSide: BorderSide(
                                          color: Colors.green,
                                          style: BorderStyle.solid,
                                          width: 1,
                                        ),
                                      ),

border: OutlineInputBorder(
                                        borderRadius: BorderRadius.circular(5),
                                        borderSide: BorderSide(
                                          color: Colors.grey,
                                          style: BorderStyle.solid,
                                          width: 1,
                                        ),
                                      ),

Just realised I am a year late sorry

Hey, check out this article https://medium.com/flutter-community/a-deep-dive-into-flutter-textfields-f0e676aaab7a

Green:
there is a property called onEditingComplete: (){ } //takes a void callback
so maybe you could call on setState and change the color property of your BorderSide object
(there might be a better way but is all I can think of)

Red:
this one is easier there is a errorBorder: OutlineInputBorder and that will be used if an error happens during validation. Go to the following link and see the third answer https://stackoverflow.com/questions/50122394/not-able-to-change-textfield-border-color

hope this helps!