Keyboard "Done" not displaying when wrap on Material App in Flutter - flutter

Question

I am using this library keyboard_actions to display Done button when keyboard displays. Everything was working fine but when i wrap MediaQuery above on MaterialApp then that done button doesn't display when keyboard pops up. Note: I use this MediaQuery for to Restrict the bold text and font size in the app. So is there any way to fix this issue ?
main.dart
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'FirstPage.dart';
import 'package:flutter/services.dart';
void main() async {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({Key? key}) : super(key: key);
#override
Widget build(BuildContext context) {
return MediaQuery(
data: MediaQueryData.fromWindow(WidgetsBinding.instance!.window)
.copyWith(boldText: false),
child: MaterialApp(
builder: (context, child) {
return MediaQuery(
child: child!,
data: MediaQuery.of(context).copyWith(textScaleFactor: 1.0),
);
},
useInheritedMediaQuery: true,
debugShowCheckedModeBanner: false,
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: const MyHomePage(title: 'Flutter Demo Home Page'),
),
);
}
}
class MyHomePage extends StatefulWidget {
const MyHomePage({Key? key, required this.title}) : super(key: key);
final String title;
#override
State<MyHomePage> createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('App'),
),
body: Container(
width: double.infinity,
child: Column(
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisAlignment: MainAxisAlignment.spaceAround,
children: <Widget>[
SizedBox(height: 50),
Text(
'textArea',
textAlign: TextAlign.center,
style: TextStyle(fontSize: 35),
),
TextButton(
onPressed: () {
Navigator.push(context,
CupertinoPageRoute(builder: (context) => FirstPage()));
},
child: Text('Click'))
],
),
),
);
}
}
FirstPage.dart
import 'package:flutter/material.dart';
import 'package:keyboard_actions/keyboard_actions.dart';
import 'package:flutter/services.dart';
class FirstPage extends StatefulWidget {
const FirstPage({Key? key}) : super(key: key);
#override
_FirstPageState createState() => _FirstPageState();
}
class _FirstPageState extends State<FirstPage> {
final FocusNode _nodeText1 = FocusNode();
KeyboardActionsConfig _buildConfig(BuildContext context) {
return KeyboardActionsConfig(
keyboardActionsPlatform: KeyboardActionsPlatform.ALL,
keyboardBarColor: Colors.grey[200],
nextFocus: true,
actions: [
KeyboardActionsItem(
focusNode: _nodeText1,
),
],
);
}
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('FirstPage'),
),
body: KeyboardActions(
config: _buildConfig(context),
child: Container(
child: Column(
children: <Widget>[
TextField(
keyboardType: TextInputType.number, focusNode: _nodeText1),
],
),
),
),
);
}
}

Answer 1

Add This Line on top:-
import 'package:flutter/services.dart';
I hope this solution is useful for you and if you want to use a keyboard done button like this.
You have to add this line on TextField Widget.
keyboardType: TextInputType.numberWithOptions(
decimal: true,
signed: true,
),
And you can also add input for matters for restricted symbols you don't want.