CODEWITHSUNDEEP
flutter
Vishali
Vishali

Reputation: 1397

Flutter open webview inside the Dialog

//Here is my flutter code for webview

  @override
  Widget build(BuildContext context) {
   return Scaffold(
    body: Center(
    child : WebviewScaffold(
      url: "https://www.facebook.com/",
      // appBar: new AppBar(
      //   // title: new Text('Hairtips'),
      // ),
      withZoom: true,
      withLocalStorage: true,    
     )
   ),
 );

  }

I am implementing webview in my flutter app.I have three textview in my fragment.when i tap the textview i want to open webview inside the dialog.I know how to implement this in android.please suggest me some solution to fix this issue

Upvotes: 3

Views: 7615

Answers (2)

sudopilya
sudopilya

Reputation: 21

check this output You can add padding to WebViewScaffold by wrapping it in Container.

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


class WebViewDialogDemo extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
   return Container(
     padding:EdgeInsets.Symmetric(
       horizontal:20,
       vertical:40
     ),
     child: WebviewScaffold(
      url: "https://instagram.com/mahi7781",       
      withZoom: true,
      withLocalStorage: true,
      initialChild: Container(
          color: Colors.redAccent,
          child: const Center(
            child: Text("Loading...."),
        ),
      ),
    ));
  }
}

Upvotes: 2

Sivaraj Velayutham
Sivaraj Velayutham

Reputation: 187

you can use "https://pub.dartlang.org/packages/url_launcher" package to launch the URL. But it will not open with in your app. It will open the default platform browser.

You can try with "https://pub.dartlang.org/packages/flutter_webview_plugin" package as well. It should open the web view with in your app dialog. But, I have not tried it. Let me know if it works..

=== updated ===

I used the flutter_web_view plugin and ran the below code.. It works fine.

I followed the exact steps provided in "https://pub.dartlang.org/packages/flutter_webview_plugin#-readme-tab-"

Hope this helps.

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

/// call this widget in MaterialApp - home.
class WebViewDialogDemo extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return WebviewScaffold(
      url: "https://google.com",
      appBar: AppBar(
        title: Text("WebView Demo"),
        centerTitle: true,
      ),
      withZoom: true,
      withLocalStorage: true,
      initialChild: Container(
        color: Colors.redAccent,
        child: const Center(
          child: Text("Loading...."),
        ),
      ),
    );
  }
}

enter image description here

Upvotes: -2

Related Questions