Created with <3 with dartpad.dev.
Created
October 25, 2022 02:11
-
-
Save ngoluuduythai/15bf07b47e6195d3c3540ff7871d6869 to your computer and use it in GitHub Desktop.
forlorn-toast-0841
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import 'package:flutter/material.dart'; | |
void main() => runApp(const MyApp()); | |
class MyApp extends StatelessWidget { | |
const MyApp({super.key}); | |
@override | |
Widget build(BuildContext context) { | |
return const MaterialApp( | |
title: 'Text Field Focus', | |
home: MyCustomForm(), | |
); | |
} | |
} | |
// Define a custom Form widget. | |
class MyCustomForm extends StatefulWidget { | |
const MyCustomForm({super.key}); | |
@override | |
State<MyCustomForm> createState() => _MyCustomFormState(); | |
} | |
// Define a corresponding State class. | |
// This class holds data related to the form. | |
class _MyCustomFormState extends State<MyCustomForm> { | |
// Define the focus node. To manage the lifecycle, create the FocusNode in | |
// the initState method, and clean it up in the dispose method. | |
late FocusNode myFocusNode; | |
@override | |
void initState() { | |
super.initState(); | |
myFocusNode = FocusNode(); | |
myFocusNode.addListener(() { | |
print(myFocusNode.hasFocus); | |
}); | |
} | |
@override | |
void dispose() { | |
// Clean up the focus node when the Form is disposed. | |
myFocusNode.dispose(); | |
super.dispose(); | |
} | |
@override | |
Widget build(BuildContext context) { | |
return Scaffold( | |
appBar: AppBar( | |
title: const Text('Text Field Focus'), | |
), | |
body: Padding( | |
padding: const EdgeInsets.all(16.0), | |
child: Column( | |
children: [ | |
// The first text field is focused on as soon as the app starts. | |
const TextField( | |
autofocus: true, | |
), | |
// The second text field is focused on when a user taps the | |
// FloatingActionButton. | |
TextField( | |
focusNode: myFocusNode, | |
), | |
], | |
), | |
), | |
floatingActionButton: FloatingActionButton( | |
// When the button is pressed, | |
// give focus to the text field using myFocusNode. | |
onPressed: () => myFocusNode.requestFocus(), | |
tooltip: 'Focus Second Text Field', | |
child: const Icon(Icons.edit), | |
), // This trailing comma makes auto-formatting nicer for build methods. | |
); | |
} | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment