fluttercommunity / fluttercommunity/flutter_webview_plugin

How to open multiple webview pages using bottom navigation

Offen
#449 7 Kommentare 7 Reaktionen 0 zugewiesene Personen Auf GitHub ansehen
Vorherrschende Sprache
Java
Sterne
1.5k
Forks
938
PR-Merge-Kennzahlen
Keine gemergten PRs in 30 T.

Beschreibung

```dart
import 'package:flutter/material.dart';
import 'package:flutter_webview_plugin/flutter_webview_plugin.dart';
import 'package:insight_bank/generated/i18n.dart';
import 'package:insight_bank/navigation/router.dart';
import 'package:insight_bank/util/layouts.dart';
import 'package:insight_bank/util/logger.dart';
import 'package:insight_bank/util/utils.dart';
import 'package:insight_bank/widgets/presentation/common/common_widgets.dart';

class WebViewPage extends StatefulWidget {
final String url;
final String title;
final bool hasAppBar;
final bool hasScrollBar;
final Widget bottomNavigationBar;

const WebViewPage(
this.url, {
this.title,
this.hasAppBar = true,
this.hasScrollBar = true,
this.bottomNavigationBar,
Key key,
}) : super(key: key);

@override
_WebViewPageState createState() => new _WebViewPageState();
}

class _WebViewPageState extends State {
final Logger _logger = Logger.tag('Webview');

String _title;
final _webViewPlugin = FlutterWebviewPlugin();

@override
void initState() {
super.initState();
_title = widget.title;
Logger.tagD('.... url: ${widget.url}');
_webViewPlugin.onStateChanged.listen((state) async {
if (state.type == WebViewState.startLoad) {
_logger.d('web page [${widget.url}] loading...');
}
if (state.type == WebViewState.finishLoad) {
String script = 'window.document.title';
final title = await _webViewPlugin.evalJavascript(script);
if (_title != title) {
_logger.d('web page title updated to $title');
setState(() {
_title = title;
});
}
}
});
_webViewPlugin.onDestroy.listen((_) {
if (Navigator.canPop(context)) {
Navigator.of(context).pop();
}
});
}

@override
Widget build(BuildContext context) {
_title = _title ?? S.of(context).hintLoading;

final appBar = widget.hasAppBar
? AppBar(
backgroundColor: L.scaffoldBackgroundColor,
title: TextWidget.title(_title),
leading: IconButton(
icon: Icon(Icons.arrow_back),
color: L.black,
onPressed: () => Router.pageBack(context),
),
)
: PreferHeightWidget(
height: L.s(L.statusBarHeightInPixel),
color: L.primaryColor,
);

return MaterialApp(
theme: Theme.of(context),
home: WebviewScaffold(
key: ObjectKey(widget.url),
appBar: appBar,
url: widget.url,
scrollBar: widget.hasScrollBar,
hidden: true,
withJavascript: true,
bottomNavigationBar: widget.bottomNavigationBar,
resizeToAvoidBottomInset: true,
initialChild: Container(
color: L.primaryColor,
child: Center(
child: CircularProgressIndicator(valueColor: AlwaysStoppedAnimation(L.white)),
),
),
),
);
}
}
```

I have a HomePage widget which contains a BottomNavigationBar, and there are 3 tabs in it.
The first page is a normal flutter page, and the 2nd and 3rd pages are webview pages with different urls. But when I tap on 2nd page at first, 2nd web page will be load and 3rd will NOT, vice versa.

The logs shows that the 3rd page's initState was called, but there is no actual page loading.

Beitragsleitfaden

Für dieses Repository ist kein Beitragsleitfaden indexiert

Bewertung

Dieses Issue wurde noch nicht bewertet.

Neue Issues direkt in Ihr Postfach

Eine kurze Übersicht über anfängerfreundliche GitHub-Issues.