Question

//这是我的颤动代码

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

class HairtipsPage extends StatefulWidget {
  @override
  _HairtipsPageState createState() => _HairtipsPageState();
}

class _HairtipsPageState extends State<HairtipsPage> {

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

  }

}

我在我的应用程序中使用底部导航并尝试在片段中实现webview。我知道如何在android中实现相同的功能，我也不希望webview应该在浏览器中打开。我希望webview应该加载到应用程序和片段中。

Answer 1

您可以使用Flutter Webview插件。这是插件https://pub.dartlang.org/packages/webview_flutter

的URL

Web视图将使用CircularProgressIndicator加载到应用程序内部。

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

class WebView extends StatefulWidget {
  @override
  _WebViewState createState() => _WebViewState();
}

class _WebViewState extends State<WebView> {

  final Completer<WebViewController> _controller =
      Completer<WebViewController>();

  num _stackToView = 1;

  void _handleLoad(String value) {
    setState(() {
      _stackToView = 0;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
          leading: Builder(builder: (BuildContext context) {
            return IconButton(
              icon: Icon(Icons.volume_up, color: Colors.black,),
              onPressed: () {
                Navigator.pop(context);
              },
            );
          }),
          backgroundColor: Colors.white10,
          elevation: 0,
        ),
        body: IndexedStack(
          index: _stackToView,
          children: [
            Column(
              children: <Widget>[
                Expanded(
                    child: WebView(
                  initialUrl: "https://www.google.co.in/",
                  javascriptMode: JavascriptMode.unrestricted,
                  onPageFinished: _handleLoad,
                  onWebViewCreated: (WebViewController webViewController) {
                    _controller.complete(webViewController);
                  },
                )),
              ],
            ),
            Container(
              child: Center(child: CircularProgressIndicator(),)
            ),
          ],
        ));
  }
}

片段内的Flutter加载WebView

1 个答案: