A focusable and blurable TextField widget

flutter focus widget

a focusable and blurable widget of use the focusnode.

• when the focuswidget had focus

  tap this focuswidget outside area

  will call the focusnode’s unfocus method and trigger the focusnode’s listener

class _myhomepagestate extends state<myhomepage> {
  final focusnode _address = focusnode(), _name = focusnode();

  @override
  widget build(buildcontext context) {
    final language = demolocalizations.of(context);
    return scaffold(
      appbar: appbar(
        title: text(widget.title),
      ),
      drawer: drawer(
        child: safearea(
          child: listview(
            padding: edgeinsets.only(left: 10, right: 10),
            children: [
              focuswidget.builder(
                context,
                (ctx, focusnode) => textfield(
                  focusnode: focusnode,
                  autofocus: true,
                  decoration: inputdecoration(
                    hinttext: 'input 1',
                    labeltext: 'input 1',
                  ),
                ),
              )
            ],
          ),
        ),
      ),
      body: singlechildscrollview(
        padding: edgeinsets.only(left: 10, right: 10),
        child: column(
          crossaxisalignment: crossaxisalignment.start,
          children: [
            container(
              width: 100,
              child: focuswidget(
                focusnode: _address,
                child: textfield(
                  focusnode: _address,
                  decoration: inputdecoration(
                      hinttext: 'input 2', labeltext: 'input 2'),
                ),
              ),
            ),
            focuswidget(
              focusnode: _name,
              child: textfield(
                focusnode: _name,
                decoration: inputdecoration(
                    hinttext: 'input 3', labeltext: 'input 3'),
              ),
            ),
            sizedbox(
              height: 1000,
            ),
          ],
        ),
      ),
    );
  }
}

focusable textfield widget