1

I am trying to use web views in flutter. I have followed this medium article which depicts how we can create a simple application using Flutter embed webview.

https://medium.com/@ekosuprastyo15/webview-in-flutter-example-a11a24eb617f

I am able to create app successfully but right now that app is opening on button click as shown in the above article.

What I want - Now I want to create an application that loads a URL in webview on load (i.e. user won't have to click on any button or link to open that URL).

What we have tried so far?

We have tried flutter url_launcher plugin and flutter_webview_plugin plugin.

1

3 Answers 3

2

Add this lib Flutter WebView

import 'package:webview_flutter/webview_flutter.dart';

return Scaffold(
      appBar: AppBar(
        title: const Text('Flutter WebView example'),
      ),
      body: const WebView(
        initialUrl: 'https://flutter.io',
        javascriptMode: JavascriptMode.unrestricted,
      ),
    );
Sign up to request clarification or add additional context in comments.

7 Comments

How can we add scrolling options with this plugin?
Webview is auto scrollable. just wrap it within container with screen height.
Thank you som much @Deepak Ror. One more thing, I want to ask how can we quickly change the app title and app icon?
To change title of app, just change in main.dart. file. And when you want to change app icon than just replace icon in android directory of your project. yourProject/Android/app/src/main/res/mipmap folder
or just change icon in App Manifest file. android:icon="@mipmap/ic_launcher" or android:icon="@drawable/logo"
|
0

if you want to directly open website that you want without pressing any button you should give initial Url. but you should nagivate.push from other pages to here. it is like that;

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

class WebViewExample extends StatefulWidget {

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

class WebViewExampleState extends State<WebViewExample> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text("webview"),
      ),
      body: WebView(
        initialUrl: "https://www.google.com/",
        javascriptMode: JavascriptMode.unrestricted,
      ),
    );
  }
}

Comments

0

You can use this after update of webview widget is not there

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

class Shop extends StatefulWidget {
  const Shop({super.key});

  @override
  State<Shop> createState() => _ShopState();
 }

class _ShopState extends State<Shop> {
  late final WebViewController _controller;
   @override
   void initState() {
    _controller = WebViewController()
     ..loadRequest(
       Uri.parse('https://url'),
        );
     super.initState();
     }

   @override
  Widget build(BuildContext context) {
    return Scaffold(
    
    body: SafeArea(child: WebViewWidget(controller: _controller))
    
    );
 }
}

1 Comment

Remember that Stack Overflow isn't just intended to solve the immediate problem, but also to help future readers find solutions to similar problems, which requires understanding the underlying code. This is especially important for members of our community who are beginners, and not familiar with the syntax. Given that, can you edit your answer to include an explanation of what you're doing and why you believe it is the best approach?

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.