WebView In Flutter

Android WebView in Flutter

Android WebView is used to display web pages in Android. Web pages can be loaded from a single application or URL. It is used to display online content in Android activity. Android WebView uses the WebKit engine to display web pages.


In manifest you just write this code -:




In pubspec.yaml you have to add this code -:




In main.dart file you just copy this code and run this program -:

import 'package:flutter/material.dart';
import 'package:webview_flutter/webview_flutter.dart';

void main() => runApp(MaterialApp(
  title: 'Flutter Browser',
  theme: ThemeData(
    primarySwatch: Colors.deepOrange,
  ),
  home: MyHomePage(),
));

class MyHomePage extends StatefulWidget {

  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {

  WebViewController _webViewController;
  TextEditingController _teController = new TextEditingController();
  bool showLoading = false;

  void updateLoading(bool ls) {
    this.setState((){
      showLoading = ls;
    });
  }

  @override
  Widget build(BuildContext context) {

    return Scaffold(
      resizeToAvoidBottomInset: false,
      body: SafeArea(
        child: Container(
          height: MediaQuery.of(context).size.height,
          width: MediaQuery.of(context).size.width,
          child: Column(
            mainAxisAlignment: MainAxisAlignment.spaceEvenly,
            children: <Widget>[
              Flexible(
                flex: 1,
                child: Container(
                  color: Colors.deepOrange,
                  child: Padding(
                    padding: const EdgeInsets.all(4.0),
                    child: Row(
                      mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                      children: <Widget>[
                        Flexible(
                            flex: 2,
                            child: Text("http://",style: TextStyle(color: Colors.white,fontSize: 20),)),
                        Flexible(
                          flex: 4,
                          child: TextField(
                            autocorrect: false,
                            style: TextStyle(color: Colors.white,fontSize: 20),
                            decoration: InputDecoration(
                                enabledBorder: UnderlineInputBorder(
                                  borderSide: BorderSide(
                                      style: BorderStyle.solid,
                                      color: Colors.white,
                                      width: 2
                                  ),
                                ),
                                focusedBorder: UnderlineInputBorder(
                                  borderSide: BorderSide(
                                      style: BorderStyle.solid,
                                      color: Colors.white,
                                      width: 2
                                  ),
                                )
                            ),
                            controller: _teController,
                          ),
                        ),
                        Flexible(
                          flex: 1,
                          child: Center(
                            child: IconButton(icon: Icon(Icons.arrow_forward,color: Colors.white,),       onPressed: (){
                              String finalURL = _teController.text;
                              if(!finalURL.startsWith("https://")){
                                finalURL = "https://"+finalURL;
                              }
                              if(_webViewController != null){
                                updateLoading(true);
                                _webViewController.loadUrl(finalURL).then((onValue){

                                }).catchError((e){
                                  updateLoading(false);
                                });
                              }
                            }),
                          ),
                        )
                      ],
                    ),
                  ),
                ),
              ),
              Flexible(
                  flex: 9,
                  child: Stack(
                    children: <Widget>[
                      WebView(
                        initialUrl: 'http://google.com',
                        onPageFinished: (data){
                          updateLoading(false);
                        },
                        javascriptMode: JavascriptMode.unrestricted,
                        onWebViewCreated: (webViewController){
                          _webViewController = webViewController;
                        },
                      ),
                      (showLoading)?Center(child: CircularProgressIndicator(),):Center()
                    ],
                  )
              ),
            ],
          ),
        ),
      ),
    );
  }
}


output of this code





You just download this code from Github


Happy Coding enjoy Flutter with code with android JJ



Post a Comment

1 Comments

  1. Sit again, chill out and play for your subsequent win whereas wanting over the primary casino motion. Our new casino map lets you find your favourite games and know if they are occupied or free for play. Please join or signal into your My Club Serrano account to use your hotel provides and reductions. Note that the content on this web site should not be thought-about betting recommendation. This website is free so that you can} use but we may receive commission from the businesses we characteristic on 점보카지노 this site.

    ReplyDelete