Thanks to visit codestin.com
Credit goes to github.com

Skip to content

Commit 0ce4ccc

Browse files
author
wz
committed
[feat]: 添加webview展示
1 parent 3970187 commit 0ce4ccc

7 files changed

Lines changed: 268 additions & 46 deletions

File tree

‎.gitignore‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -44,3 +44,9 @@ app.*.map.json
4444
/android/app/debug
4545
/android/app/profile
4646
/android/app/release
47+
ios/Flutter/Debug.xcconfig
48+
ios/Flutter/Release.xcconfig
49+
ios/Runner.xcodeproj/project.pbxproj
50+
ios/build/Pods.build/Release-iphonesimulator/Flutter.build/dgph
51+
ios/build/Pods.build/Release-iphonesimulator/Pods-Runner.build/dgph
52+
ios/build/Pods.build/Release-iphonesimulator/flutter_webview_plugin.build/dgph

‎lib/pages/home_page.dart‎

Lines changed: 52 additions & 46 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@ import 'dart:ffi';
44
import 'package:flutter/material.dart';
55
import 'package:flutter_demo/dao/home_dao.dart';
66
import 'package:flutter_demo/model/home_model.dart';
7+
import 'package:flutter_demo/widget/local_nav.dart';
78
import 'package:flutter_swiper/flutter_swiper.dart';
89

910
class HomePage extends StatefulWidget {
@@ -25,6 +26,7 @@ class _HomePageState extends State {
2526
double _appbarOp = 0.0;
2627

2728
var _homejson = '';
29+
var _localNavList = null;
2830

2931
_onScroll(offset) {
3032
double alpha = offset / APPBAR_SCROLL_OFFSET;
@@ -42,7 +44,6 @@ class _HomePageState extends State {
4244
@override
4345
void initState() {
4446
super.initState();
45-
4647
_loadHomeJson();
4748
}
4849

@@ -51,6 +52,7 @@ class _HomePageState extends State {
5152
HomeModel model = await HomeDao.fetch();
5253
setState(() {
5354
_homejson = json.encode(model);
55+
_localNavList = model.localNavList;
5456
});
5557
} catch (e) {
5658
setState(() {
@@ -62,51 +64,55 @@ class _HomePageState extends State {
6264
@override
6365
Widget build(BuildContext context) {
6466
return Scaffold(
67+
backgroundColor: const Color(0xfff2f2f2),
6568
body: Stack(
66-
children: [
67-
MediaQuery.removePadding(
68-
removeTop: true,
69-
context: context,
70-
child: NotificationListener(
71-
onNotification: (noti) {
72-
if (noti is ScrollUpdateNotification && noti.depth == 0) {
73-
print(noti.metrics.pixels);
74-
_onScroll(noti.metrics.pixels);
75-
}
76-
return true;
77-
},
78-
child: ListView(
79-
children: [
80-
Container(
81-
height: 160,
82-
child: Swiper(
83-
itemCount: _imageUrl.length,
84-
autoplay: true,
85-
itemBuilder: (BuildContext ctx, int idx) {
86-
return Image.network(_imageUrl[idx],
87-
fit: BoxFit.fill);
88-
},
89-
pagination:
90-
SwiperPagination(alignment: Alignment.bottomCenter),
91-
),
92-
),
93-
Container(
94-
child: Text(_homejson),
95-
height: 1000,
96-
)
97-
],
98-
))),
99-
Opacity(
100-
opacity: _appbarOp,
101-
child: Container(
102-
height: 80,
103-
decoration: BoxDecoration(color: Colors.white),
104-
child: Center(
105-
child: Padding(
106-
padding: EdgeInsets.only(top: 20), child: Text('Home')),
107-
),
108-
)),
109-
],
110-
));
69+
children: [
70+
MediaQuery.removePadding(
71+
removeTop: true,
72+
context: context,
73+
child: NotificationListener(
74+
onNotification: (noti) {
75+
if (noti is ScrollUpdateNotification && noti.depth == 0) {
76+
print(noti.metrics.pixels);
77+
_onScroll(noti.metrics.pixels);
78+
}
79+
return true;
80+
},
81+
child: ListView(
82+
children: [
83+
Container(
84+
height: 160,
85+
child: Swiper(
86+
itemCount: _imageUrl.length,
87+
autoplay: true,
88+
itemBuilder: (BuildContext ctx, int idx) {
89+
return Image.network(_imageUrl[idx],
90+
fit: BoxFit.fill);
91+
},
92+
pagination: SwiperPagination(
93+
alignment: Alignment.bottomCenter),
94+
),
95+
),
96+
Padding(
97+
child: LocalNav(localNavList: _localNavList),
98+
padding: const EdgeInsets.fromLTRB(7, 4, 7, 4)),
99+
Container(
100+
child: Text(_homejson),
101+
height: 1000,
102+
)
103+
],
104+
))),
105+
Opacity(
106+
opacity: _appbarOp,
107+
child: Container(
108+
height: 80,
109+
decoration: BoxDecoration(color: Colors.white),
110+
child: Center(
111+
child: Padding(
112+
padding: EdgeInsets.only(top: 20), child: Text('Home')),
113+
),
114+
)),
115+
],
116+
));
111117
}
112118
}

‎lib/widget/grid_nav.dart‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
import 'package:flutter/material.dart';
2+
3+
class GridNav extends StatelessWidget {
4+
@override
5+
Widget build(BuildContext context) {
6+
return Text('data');
7+
}
8+
}

‎lib/widget/local_nav.dart‎

Lines changed: 57 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,57 @@
1+
import 'package:flutter/material.dart';
2+
import 'package:flutter_demo/model/common_model.dart';
3+
import 'package:flutter_demo/widget/webview.dart';
4+
5+
// ignore: must_be_immutable
6+
class LocalNav extends StatelessWidget {
7+
final List<CommonModel> localNavList;
8+
9+
const LocalNav({Key? key, required this.localNavList}) : super(key: key);
10+
11+
// LocalNav({Key? key}) : super(key: key);
12+
13+
@override
14+
Widget build(BuildContext context) {
15+
return Container(
16+
height: 64,
17+
decoration: const BoxDecoration(
18+
color: Colors.white,
19+
borderRadius: BorderRadius.all(Radius.circular(6)),
20+
),
21+
child: Padding(padding: const EdgeInsets.all(7), child: _items(context)),
22+
);
23+
}
24+
25+
Widget? _items(BuildContext ctx) {
26+
if (localNavList == null) return null;
27+
List<Widget> items = [];
28+
29+
localNavList.forEach((model) => items.add(_item(ctx, model)));
30+
31+
return Row(
32+
mainAxisAlignment: MainAxisAlignment.spaceAround,
33+
children: items,
34+
);
35+
}
36+
37+
Widget _item(BuildContext ctx, CommonModel model) {
38+
return GestureDetector(
39+
onTap: () {
40+
Navigator.push(ctx, MaterialPageRoute(builder: (BuildContext ctx) {
41+
return WebView(
42+
url: model.url,
43+
statusBarColor: model.statusBarColor,
44+
title: model.title,
45+
hideAppBar: model.hideAppBar,
46+
backForbid: false);
47+
}));
48+
},
49+
child: Column(
50+
children: [
51+
Image.network(model.icon, height: 32, width: 32),
52+
Text(model.title, style: const TextStyle(fontSize: 12))
53+
],
54+
),
55+
);
56+
}
57+
}

‎lib/widget/webview.dart‎

Lines changed: 137 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,137 @@
1+
import 'dart:async';
2+
3+
import 'package:flutter/material.dart';
4+
import 'package:flutter_webview_plugin/flutter_webview_plugin.dart';
5+
6+
const Catch_Urls = ['m.ctrip.com/', 'm.ctrip.com/html5/', 'm.ctrip.com/html5'];
7+
8+
class WebView extends StatefulWidget {
9+
final String url;
10+
final String? statusBarColor;
11+
final String title;
12+
final bool hideAppBar;
13+
final bool backForbid;
14+
15+
const WebView(
16+
{Key? key,
17+
required this.url,
18+
this.statusBarColor = 'ffffff',
19+
required this.title,
20+
required this.hideAppBar,
21+
required this.backForbid})
22+
: super(key: key);
23+
24+
@override
25+
State<StatefulWidget> createState() {
26+
return _WebViewState();
27+
}
28+
}
29+
30+
class _WebViewState extends State<WebView> {
31+
final webviewReference = FlutterWebviewPlugin();
32+
late StreamSubscription<String> _onUrlChange;
33+
late StreamSubscription<WebViewStateChanged> _onStateChange;
34+
late StreamSubscription<WebViewHttpError> _onHttpError;
35+
36+
bool _is2Main(String url) {
37+
bool c = false;
38+
for (final value in Catch_Urls) {
39+
if (url.endsWith(value)) {
40+
c = true;
41+
break;
42+
}
43+
}
44+
return c;
45+
}
46+
47+
@override
48+
void initState() {
49+
super.initState();
50+
51+
webviewReference.close();
52+
_onUrlChange = webviewReference.onUrlChanged.listen((event) {});
53+
_onStateChange = webviewReference.onStateChanged.listen((event) {
54+
switch (event.type) {
55+
case WebViewState.startLoad:
56+
if (_is2Main(event.url)) {
57+
if (widget.backForbid) {
58+
webviewReference.launch(widget.url);
59+
} else {
60+
Navigator.pop(context);
61+
}
62+
}
63+
break;
64+
default:
65+
break;
66+
}
67+
});
68+
69+
_onHttpError = webviewReference.onHttpError.listen((event) {
70+
print(event);
71+
});
72+
}
73+
74+
@override
75+
void dispose() {
76+
super.dispose();
77+
_onStateChange.cancel();
78+
_onHttpError.cancel();
79+
_onUrlChange.cancel();
80+
webviewReference.dispose();
81+
}
82+
83+
@override
84+
Widget build(BuildContext context) {
85+
String statusBarColorStr = widget.statusBarColor ?? 'ffffff';
86+
Color backButtonColor;
87+
if (statusBarColorStr == 'ffffff') {
88+
backButtonColor = Colors.black;
89+
} else {
90+
backButtonColor = Colors.white;
91+
}
92+
93+
return Scaffold(
94+
body: Column(
95+
children: [
96+
_appBar(
97+
Color(int.parse('0xff' + statusBarColorStr)), backButtonColor),
98+
Expanded(
99+
child: WebviewScaffold(
100+
url: widget.url,
101+
withZoom: true,
102+
withLocalStorage: true,
103+
hidden: true,
104+
initialChild: Container(
105+
color: Colors.white,
106+
child: const Center(child: Text('waiting')),
107+
)))
108+
],
109+
),
110+
);
111+
}
112+
113+
Widget _appBar(Color backgroundColor, Color backButtonColor) {
114+
if (widget.hideAppBar) {
115+
return Container(
116+
color: backgroundColor,
117+
height: 30,
118+
);
119+
}
120+
121+
return FractionallySizedBox(
122+
child: Stack(
123+
children: [
124+
GestureDetector(
125+
child: Container(
126+
margin: const EdgeInsets.only(left: 10),
127+
child: Icon(Icons.close, color: backButtonColor, size: 26),
128+
),
129+
),
130+
Positioned(
131+
child: Center(
132+
child: Text(widget.title,
133+
style: TextStyle(color: backButtonColor, fontSize: 20))))
134+
],
135+
));
136+
}
137+
}

‎pubspec.lock‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -88,6 +88,13 @@ packages:
8888
description: flutter
8989
source: sdk
9090
version: "0.0.0"
91+
flutter_webview_plugin:
92+
dependency: "direct main"
93+
description:
94+
name: flutter_webview_plugin
95+
url: "https://pub.dartlang.org"
96+
source: hosted
97+
version: "0.3.11"
9198
http:
9299
dependency: "direct main"
93100
description:

‎pubspec.yaml‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -36,6 +36,7 @@ dependencies:
3636
cupertino_icons: ^1.0.2
3737
flutter_swiper: ^1.1.4
3838
http: ^0.12.0+1
39+
flutter_webview_plugin: ^0.3.0+2
3940

4041
dev_dependencies:
4142
flutter_test:

0 commit comments

Comments
 (0)