How To Add Webview In Flutter Convert Website Into App

Welcome To ITSolutionsGuides,

Lets learn How To Add Webview In Flutter Convert Website Into App with the it solutions guides tutorial. Using the flutter webview package we can setup any website into any app using the flutter webview package. Flutter is fun thus we can convert any website into the mobile applications and install in our mobile phones. So lets see How To Add Webview In Flutter Convert Website Into mobile application.
Learn to integrate webview in Flutter for transforming websites into apps. Effortlessly convert your web content into a native mobile experience with it solutionsguides.

Lets create the new flutter project using the following command,
flutter new itsolutionsguides

after installing the project Lets install the Flutter Webview package in our project using the following command,
flutter pub add webview_flutter
after installing the package we need to register the package in the pubspec.yaml file in the dependecies section
Note: Indentation are very important in this file.

pubspec.yaml

dependencies:
  flutter:
    sdk: flutter

  webview_flutter: ^3.0.0
  flutter_launcher_icons: ^0.13.1

In order to use the Flutter Webview we need to import the webview package,

main.dart

import 'package:webview_flutter/webview_flutter.dart';

Lets setup the flutter webview in our app.

main.dart

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

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: Scaffold(
        appBar: AppBar(
          backgroundColor: Color(0xff000000),
          flexibleSpace: FlexibleSpaceBar(
            centerTitle: true,
            title: Text('Welcome to ITSolutionsGuides'),            
          ),
        ),
        body: WebView(
          initialUrl: 'https://www.itsolutionsguides.com',
          javascriptMode: JavascriptMode.unrestricted,
        ),
      ),
    );
  }
}

Recent Posts