Flutter - Hide hint text when Text Field have focus

There is a property for that:

TextField(decoration: InputDecoration(hasFloatingPlaceholder: false));

Edit: The version above is deprecated, the new version is:

TextField(decoration: InputDecoration(floatingLabelBehavior: FloatingLabelBehavior.never,),),

For doing that matter you need to make something like that

class Play extends StatefulWidget {
  @override
  _PlayState createState() => _PlayState();
}

class _PlayState extends State<Play> {
  FocusNode focusNode = FocusNode();
  String hintText = 'Hello , iam Hint';
  @override
  void initState() {
    // TODO: implement initState
    super.initState();
    focusNode.addListener(() {
      if (focusNode.hasFocus) {
        hintText = '';
      } else {
        hintText = 'Hello , iam Hint';
      }
      setState(() {});
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      floatingActionButton: FloatingActionButton(onPressed: () {
        print(focusNode.hasFocus);
      }),
      body: Padding(
        padding: const EdgeInsets.all(8.0),
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            TextField(
              focusNode: focusNode,
              decoration: InputDecoration(
                hintText: hintText,
              ),
            ),
            TextField(
              decoration: InputDecoration(
                hintText: '!!',
              ),
            ),
          ],
        ),
      ),
    );
  }
}

Shortly i listened to TextField by its focusNode property . When TextField has focus i make hintText property equal empty String value

Tags:

Dart

Flutter