由于在國內flutter應該還不是很廣泛了您觉，我在找這三種打開方式的時候費了九牛二虎之力了吉懊，各種百度各種谷歌，然后github鼻疮，也只能找到某一類型的打開方式怯伊，所以耗費了好長時間了，所以寫這篇文章的目的是幫助一寫有需要的人節(jié)省一點時間了判沟，有的時候感覺時間耗費在這些問題上感覺不值上了耿芹，從iOS轉到flutter開發(fā)，用的android studio開發(fā)了挪哄，估計是剛用吧吧秕，感覺遇到的問題千奇百怪了，比起Xcode不好用中燥，咱也不趕說了寇甸，畢竟咱才用了一段時間.
1：在pubspec.yaml添加依賴庫
dependencies:
webview_flutter: ^0.3.8
flutter_html: ^0.9.6
2:ios中在ios/Runner/Info.plist中添加
<key>io.flutter.embedded_views_preview</key>
<string>YES</string>*
3:android中需要添加網(wǎng)絡權限（圖1，沒有則添加）
<uses-permission android:name="android.permission.INTERNET" />
圖1
如果上面步驟完成
1:打開本地HTML
import 'package:flutter/material.dart';
import 'package:webview_flutter/webview_flutter.dart';
import 'package:flutter/services.dart';
import 'dart:convert';
class LocalWebViewController extends StatelessWidget {
WebViewController _webViewController;
String filePath = "data/user_protocol.html";
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text("本地html"),
),
body: Container(
child: WebView(
initialUrl: "",
javascriptMode: JavascriptMode.unrestricted,
onWebViewCreated: ((WebViewController vc){
_webViewController = vc;
_loadlocalData();
}),
),
),
);
}
_loadlocalData() async {
String fileHtmlContents = await rootBundle.loadString(filePath);
_webViewController.loadUrl(Uri.dataFromString(fileHtmlContents,
mimeType: 'text/html', encoding: Encoding.getByName('utf-8'))
.toString());
}
}
2:打開URL連接
import 'package:flutter/material.dart';
import 'package:webview_flutter/webview_flutter.dart';
import 'package:flutter/services.dart';
import 'package:flutter/cupertino.dart';
class URLWebViewController extends StatelessWidget {
CupertinoActivityIndicator _indicator;
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text("web url"),
),
body: Container(
child: WebView(
initialUrl: "https://juejin.im/user/5bd66f1ce51d457a7e4fa484",
javascriptMode: JavascriptMode.unrestricted,
onPageFinished: (url){
print(url);
},
onWebViewCreated: (vc){
},
),
),
);
}
}
3:打開HTML
import 'package:flutter/material.dart';
import 'package:flutter_html/flutter_html.dart';
import 'package:dio/dio.dart';
class HTMLWebViewController extends StatefulWidget {
@override
_HTMLWebViewControllerState createState() => _HTMLWebViewControllerState();
}
class _HTMLWebViewControllerState extends State<HTMLWebViewController> {
String content;
@override
void initState() {
// TODO: implement initState
super.initState();
_loadData();
}
@override
Widget build(BuildContext context) {
if(content == null) {
return Scaffold(
appBar: AppBar(
title: Text("加載HTML"),
),
body: Container(),
);
}
return Scaffold(
appBar: AppBar(
title: Text("加載HTML"),
),
body: SingleChildScrollView(
scrollDirection: Axis.vertical,
reverse: false,
padding: EdgeInsets.all(0),
child: Html(data: content),
),
);
}
_loadData() async {
Map<String, dynamic> params = {"id": "2202"};
String url = "http://47.110.124.138:8081/stock/api/newsdetail/";
Response response;
response = await Dio().get(url, queryParameters: params);
setState(() {
content = response.data["data"]["content"];
});
}
}
在運行的安卓環(huán)境時候遇到一個錯誤
NDK is missing a "platforms" directory.
解決辦法：谷歌了一下說是沒有安裝什么ndk(mac 環(huán)境下)
1:找到如圖畫黑色小圈的地方點擊
image
按照如圖步驟執(zhí)行疗涉，等待安裝成功就可以了
image
