Flutter中如何加載并預(yù)覽本地的html文件的方法
更新時間：2019年11月24日 09:41:23 作者：任重道遠(yuǎn)
這篇文章主要介紹了Flutter中如何加載并預(yù)覽本地的html文件的方法，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧
直接進(jìn)入主題，大概步驟如下
在 assets 創(chuàng)建需要訪問 html 文件，如下
這里創(chuàng)建一個files文件夾，專門來放這些靜態(tài) html 文件.
在 pubspec.yaml 中配置訪問位置
assets: - assets/images/ - assets/files/
在 pubspec.yaml 添加 webview_flutter 插件依賴
webview_flutter: ^0.3.15+1 // 具體版本請查看官網(wǎng)
進(jìn)入實(shí)際的代碼操作
import 'dart:convert';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:webview_flutter/webview_flutter.dart';
class AgreementPage extends StatefulWidget {
@override
_AgreementPageState createState() => _AgreementPageState();
}
class _AgreementPageState extends State<AgreementPage> {
WebViewController _webViewController;
String filePath = 'assets/files/agreement.html';
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: Text('享你來服務(wù)條款')),
body: WebView(
initialUrl: '',
javascriptMode: JavascriptMode.unrestricted,
onWebViewCreated: (WebViewController webViewController) {
_webViewController = webViewController;
_loadHtmlFromAssets();
},
)
);
}
_loadHtmlFromAssets() async {
String fileHtmlContents = await rootBundle.loadString(filePath);
_webViewController.loadUrl(Uri.dataFromString(fileHtmlContents,
mimeType: 'text/html', encoding: Encoding.getByName('utf-8'))
.toString());
}
}
最終預(yù)覽的效果如下
以上就是本文的全部內(nèi)容，希望對大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。
相關(guān)文章
android 監(jiān)聽網(wǎng)絡(luò)狀態(tài)的變化及實(shí)戰(zhàn)的示例代碼
本篇文章主要介紹了android 監(jiān)聽網(wǎng)絡(luò)狀態(tài)的變化及實(shí)戰(zhàn)的示例代碼，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-01-01
ShareSDK造成App崩潰的一個BUG原因分析以及Fix方法
這篇文章主要介紹了ShareSDK造成App崩潰的一個BUG原因分析以及Fix方法,使用的是Cocos2d-x專用ShareSDK組件,需要的朋友可以參考下2014-04-04
Flutter基本組件Basics?Widget學(xué)習(xí)
本文詳細(xì)講解了Flutter基本組件Basics?Widget，文中通過示例代碼介紹的非常詳細(xì)。對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值，需要的朋友可以參考下2021-12-12
定義時不取名字的函數(shù)，我們稱之為匿名函數(shù)，匿名函數(shù)通常整體傳遞給其他函數(shù)或者從其他函數(shù)返回，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2022-08-08
這篇文章主要介紹了Android bindservice失敗解決方法的相關(guān)資料,希望通過本文能幫助大家解決這樣的問題，需要的朋友可以參考下2017-08-08
這篇文章主要介紹了Android劉海屏、水滴屏全面屏適配小結(jié)，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-06-06
Android中解決EditText放到popupWindow中，原有復(fù)制、粘貼、全選、選擇功能失效問題
這篇文章主要介紹了Android中解決EditText放到popupWindow中，原有復(fù)制、粘貼、全選、選擇功能失效問題 的相關(guān)資料,需要的朋友可以參考下2016-04-04
Android把svg圖片轉(zhuǎn)為jpg保存到相冊圖庫
這篇文章主要為大家詳細(xì)介紹了Android把svg圖片轉(zhuǎn)為jpg保存到相冊圖庫，具有一定的參考價值，感興趣的小伙伴們可以參考一下2017-05-05
Android中的aar主要是針對于Android Library而言的,可以簡單的理解為是對Android Library的打包,這個包的格式為.aar,下面這篇文章主要給大家介紹了關(guān)于Android開發(fā)之AAR文件的生成與使用步驟的相關(guān)資料,需要的朋友可以參考下2022-07-07
Android屬性動畫實(shí)現(xiàn)圖片從左到右逐漸消失
這篇文章主要介紹了Android屬性動畫實(shí)現(xiàn)圖片從左到右逐漸消失，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下2019-11-11