| // Copyright 2014 The Flutter Authors. All rights reserved. | |
| // Use of this source code is governed by a BSD-style license that can be | |
| // found in the LICENSE file. | |
| import 'package:flutter/material.dart'; | |
| import 'package:flutter/services.dart'; | |
| /// Flutter code sample for [Focus]. | |
| void main() => runApp(const FocusExampleApp()); | |
| class FocusExampleApp extends StatelessWidget { | |
| const FocusExampleApp({super.key}); | |
| @override | |
| Widget build(BuildContext context) { | |
| return MaterialApp( | |
| home: Scaffold( | |
| appBar: AppBar(title: const Text('Focus Sample')), | |
| body: const FocusExample(), | |
| ), | |
| ); | |
| } | |
| } | |
| class FocusExample extends StatefulWidget { | |
| const FocusExample({super.key}); | |
| @override | |
| State<FocusExample> createState() => _FocusExampleState(); | |
| } | |
| class _FocusExampleState extends State<FocusExample> { | |
| Color _color = Colors.white; | |
| KeyEventResult _handleKeyPress(FocusNode node, KeyEvent event) { | |
| if (event is KeyDownEvent) { | |
| debugPrint( | |
| 'Focus node ${node.debugLabel} got key event: ${event.logicalKey}', | |
| ); | |
| switch (event.logicalKey) { | |
| case LogicalKeyboardKey.keyR: | |
| debugPrint('Changing color to red.'); | |
| setState(() { | |
| _color = Colors.red; | |
| }); | |
| return KeyEventResult.handled; | |
| case LogicalKeyboardKey.keyG: | |
| debugPrint('Changing color to green.'); | |
| setState(() { | |
| _color = Colors.green; | |
| }); | |
| return KeyEventResult.handled; | |
| case LogicalKeyboardKey.keyB: | |
| debugPrint('Changing color to blue.'); | |
| setState(() { | |
| _color = Colors.blue; | |
| }); | |
| return KeyEventResult.handled; | |
| } | |
| } | |
| return KeyEventResult.ignored; | |
| } | |
| @override | |
| Widget build(BuildContext context) { | |
| final TextTheme textTheme = Theme.of(context).textTheme; | |
| return FocusScope( | |
| debugLabel: 'Scope', | |
| autofocus: true, | |
| child: DefaultTextStyle( | |
| style: textTheme.headlineMedium!, | |
| child: Focus( | |
| onKeyEvent: _handleKeyPress, | |
| debugLabel: 'Button', | |
| child: Builder( | |
| builder: (BuildContext context) { | |
| final FocusNode focusNode = Focus.of(context); | |
| final bool hasFocus = focusNode.hasFocus; | |
| return GestureDetector( | |
| onTap: () { | |
| if (hasFocus) { | |
| focusNode.unfocus(); | |
| } else { | |
| focusNode.requestFocus(); | |
| } | |
| }, | |
| child: Center( | |
| child: Container( | |
| width: 400, | |
| height: 100, | |
| alignment: .center, | |
| color: hasFocus ? _color : Colors.white, | |
| child: Text( | |
| hasFocus | |
| ? "I'm in color! Press R,G,B!" | |
| : 'Press to focus', | |
| ), | |
| ), | |
| ), | |
| ); | |
| }, | |
| ), | |
| ), | |
| ), | |
| ); | |
| } | |
| } |