封装flutter webview页面-Toy模板网

这篇具有很好参考价值的文章主要介绍了封装flutter webview页面。希望对大家有所帮助。如果存在错误或未考虑完全的地方，请大家不吝赐教，您也可以点击"举报违法"按钮提交疑问。

例如在flutter里面跳转百度页面

需要安装webview_flutter

封装flutter webview页面,flutter,flutter

webview_page.dart



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



class MyWebView extends StatefulWidget {


  const MyWebView({super.key, required this.webViewUrl,  this.webViewTitle =''});
 final String webViewUrl;
 final String webViewTitle;
  @override
  // ignore: library_private_types_in_public_api
  _MyWebViewState createState() => _MyWebViewState();
}

class _MyWebViewState extends State<MyWebView> {



  @override
  Widget build(BuildContext context) {
     WebViewController controller = WebViewController()
  ..setJavaScriptMode(JavaScriptMode.unrestricted)
  ..setBackgroundColor(const Color(0x00000000))
  ..setNavigationDelegate(
    NavigationDelegate(
      onProgress: (int progress) {
        // Update loading bar.
      },
      onPageStarted: (String url) {},
      onPageFinished: (String url) {},
      onWebResourceError: (WebResourceError error) {},
    ),
  )
  ..loadRequest(Uri.parse(widget.webViewUrl));
    return MaterialApp(
      title: 'Material App',
      home: Scaffold(
          appBar: AppBar(
            leading: GestureDetector(child: Icon(Icons.arrow_back),onTap: (){Navigator.pop(context);},),
            title:  Text(widget.webViewTitle),
            centerTitle: true,
            backgroundColor: const Color(0xFF206CFF),
          ),
          body: WebViewWidget(controller: controller)
          ),
    );
  }
}

使用文章来源地址https://www.toymoban.com/news/detail-769264.html

 Navigator.push(
    context,
    MaterialPageRoute(
      builder: (context) => MyWebView(webViewUrl: 'https://www.baidu.com/', webViewTitle: '百度一下你就知道'),
    ),
  );

到了这里，关于封装flutter webview页面的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！