0

A part of my app includes accessing a webpage and displaying it in a webview. As this app is likely to be used for barcode scanning, I want to prevent the keyboard from popping when the user clicks on a text field IN THE WEBVIEW.

I would also like some guidance as to how I can create a button that is always persistent in my app across all the webviews, which on pressed will pop up the keyboard. If this button is not pressed, the keyboard should not pop even if any textfield in any webview is clicked.

Thanks in advance!

Here is the code of the class that implements the webpage:

import 'package:flutter_webview_plugin/flutter_webview_plugin.dart';

class WebViewWebPage extends StatelessWidget {
  final String url;

  WebViewWebPage({this.url});

  @override
  Widget build(BuildContext context) {
    return WebviewScaffold(
      url: url,
      hidden: false,
      appBar: AppBar(title: Text("Open Web Page URL in webview")),
    );
  }
}
  • Look at this [link](https://stackoverflow.com/questions/44991968/how-can-i-dismiss-the-on-screen-keyboard/44991969#44991969). Obvious and simple. – Saeiddjawadi Jul 17 '19 at 09:30
  • Thanks. I added 'SystemChannels.textInput.invokeMethod('TextInput.hide')' just before return WebviewScaffold and it worked. However, I want to add a button in my appbar which will allow the keyboard to be shown by using TextInput.show, but the statement mentioned above still prevents the keyboard from being shown. How do I solve this? – Sarang Rastogi Jul 17 '19 at 10:49

1 Answers1

0

For the persistent button try https://api.flutter.dev/flutter/material/FloatingActionButton-class.html

Widget build(BuildContext context) {
  return Scaffold(
    appBar: AppBar(
      title: Text('Floating Action Button Sample'),
    ),
    body: Center(
      child: Text('Press the button below!')
    ),
    floatingActionButton: FloatingActionButton(
      onPressed: () {
        // Add your onPressed code here!
      },
      child: Icon(Icons.thumb_up),
      backgroundColor: Colors.pink,
    ),
  );
}

You can change the icon to a keyboard https://api.flutter.dev/flutter/material/Icons/keyboard-constant.html

F-1
  • 2,887
  • 20
  • 28