Flutter- How do exit the textfield in a multiline textfield?

Question

I want to have a multiline textfield where some paragraph data can be returned. I changed the 'new line' button to 'done' button using the textInputAction property, and though it calls onEditingComplete, it is still not exiting the textfield. I know it has something to do with focus but i am not able to figure out exactly how to do it.

This is my code

TextField(
              onChanged: (text){
                print('On changed is called');
              },
              onEditingComplete: (){
                print('Editing is done ');
              },
              textInputAction: TextInputAction.done,
              maxLines: 6 ,

              controller: textEditingController,
              decoration: InputDecoration(
                  .....
              )
          ),

How can i de-focus on pressing done? Thanks in advance

Answer 1

You can use FocusNode to control the focus.

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'MyApp',
      home: MyWidget(),
    );
  }
}
class MyWidget extends StatefulWidget {
  @override
  State<MyWidget> createState() {
    return _MyWidget();
  }
}
class _MyWidget extends State<MyWidget> {
  FocusNode _focusNode;

  @override
  void initState() {
    super.initState();
    _focusNode = FocusNode();
  }
  @override
  void dispose() {
    super.dispose();
    _focusNode.dispose();
  }
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Container(
        child: TextField(
          focusNode: _focusNode,
          maxLines: 8,
          autofocus:false ,
          textInputAction: TextInputAction.done,
          onEditingComplete: () {
            print("edit");
            _focusNode.unfocus();
          },
        ),
      )
    );
  }
}