flutter/examples/api/lib/services/keyboard_key/physical_keyboard_key.0.dart
Greg Spencer efe76a5373
Update key examples to use Focus widgets instead of RawKeyboardListener (#101537)
This updates the examples for PhysicalKeyboardKey and LogicalKeyboardKey to use Focus widgets that handle the keys instead of using RawKeyboardListener, since that usually leads people down the wrong path. Updated the See Also and added tests as well. Also exposed the `physicalKey` attribute for `tester.sendKeyEvent`.
2022-04-08 12:05:41 -07:00

96 lines
2.9 KiB
Dart

// 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.
// Flutter code sample for PhysicalKeyboardKey
import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
void main() => runApp(const KeyExampleApp());
class KeyExampleApp extends StatelessWidget {
const KeyExampleApp({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
appBar: AppBar(title: const Text('PhysicalKeyboardKey Example')),
body: const MyPhysicalKeyExample(),
),
);
}
}
class MyPhysicalKeyExample extends StatefulWidget {
const MyPhysicalKeyExample({Key? key}) : super(key: key);
@override
State<MyPhysicalKeyExample> createState() => _MyPhysicalKeyExampleState();
}
class _MyPhysicalKeyExampleState extends State<MyPhysicalKeyExample> {
// The node used to request the keyboard focus.
final FocusNode _focusNode = FocusNode();
// The message to display.
String? _message;
// Focus nodes need to be disposed.
@override
void dispose() {
_focusNode.dispose();
super.dispose();
}
// Handles the key events from the RawKeyboardListener and update the
// _message.
KeyEventResult _handleKeyEvent(FocusNode node, RawKeyEvent event) {
setState(() {
if (event.physicalKey == PhysicalKeyboardKey.keyA) {
_message = 'Pressed the key next to CAPS LOCK!';
} else {
if (kReleaseMode) {
_message = 'Not the key next to CAPS LOCK: Pressed 0x${event.physicalKey.usbHidUsage.toRadixString(16)}';
} else {
// As the name implies, the debugName will only print useful
// information in debug mode.
_message = 'Not the key next to CAPS LOCK: Pressed ${event.physicalKey.debugName}';
}
}
});
return event.physicalKey == PhysicalKeyboardKey.keyA ? KeyEventResult.handled : KeyEventResult.ignored;
}
@override
Widget build(BuildContext context) {
final TextTheme textTheme = Theme.of(context).textTheme;
return Container(
color: Colors.white,
alignment: Alignment.center,
child: DefaultTextStyle(
style: textTheme.headline4!,
child: Focus(
focusNode: _focusNode,
onKey: _handleKeyEvent,
child: AnimatedBuilder(
animation: _focusNode,
builder: (BuildContext context, Widget? child) {
if (!_focusNode.hasFocus) {
return GestureDetector(
onTap: () {
FocusScope.of(context).requestFocus(_focusNode);
},
child: const Text('Click to focus'),
);
}
return Text(_message ?? 'Press a key');
},
),
),
),
);
}
}