How to open website in Flutter Application

Open Web page in Application

When you create an app, you think of opening a website inside your app only not in other browsers, this can be done using webview_flutter. You can open your website in the app using a webviewer plugin.

WebView for Flutter

https://pub.dev/packages/webview_flutter


Let's Start

Just follow the simple steps, and then you will be able to achieve your target.


Step 1: Add the dependencies to your pubspec.yaml

dependencies:
webview_flutter: ^1.0.1

Step 2: Install it (You can install packages from the command line)

$ flutter pub get


Step 3: Import package in your Dart file

import 'package:webview_flutter/webview_flutter.dart';




The WebView is relying on Platform Views to embed Android’s webview within the Flutter app. Using the web viewer, we can open the website in the application, in it the URL is initialized to the initial state and the JavaScript channel is enabled in it.

WebView Properties

debuggingEnabled (bool) : Controls whether WebView debugging is enabled.

gestureNavigationEnabled (bool): This property also bool types. It's use for navigations pages backward and forward on horizontal swipe gesture trigger.

initialUrl (String) : Loading page initstate URL

onPageFinished : Invoked when a page finished loading. We can handle loading or some event on the page.

onPageStarted : Invoked when a page starts loading. We can start the loader till the web page loaded.

onWebResourceError : Invoked when a web resource has failed to load. We can handle exceptions according to our needs.

Previous
Next Post »