Flutter Focus Widget

A widget that can make FocusNode lose focus
A focusable and blurable widget of use the FocusNode.

• When FocusWidget gets focus
  Trigger PointerDown event outside the FocusWidget area
  Will call FocusNode.unfocus () and trigger the FocusNode’s listener

• 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,
            ),
          ],
        ),
      ),
    );
  }
}

Screen Recording

Source Code

Please Visit Flutter Focus Widget Source Code at GitHub