安卓WebView在线预览office文档功能实现

2024-03-31 22:11:58

*## 在线预览office文档
我就直奔主题吧！估计是目前最简单的了吧！
我也搜了很多资料不外乎2种

使用谷歌文档服务（google国内使用不了，各种试就是显示不出来，）
mWebView.loadUrl("http://docs.google.com/gviewembedded=true&url=" + pdfUrl);
就是google的文档服务地址+自己服务器文档地址用webview加载就可以,奇葩的是google他不给你用啊！~~所以不推荐！记住是不推荐！你试了也是出不来~~
使用腾讯的TBS预览文档（腾讯浏览服务）
这个也还好用，首先接入TBS – SDK 其次如果文档再服务器你需要下载文件然后在显示！这个多了一个下载服务器文档这一步（这里你得处理下载的这个文档，预览完你删不？重复下载？刨除这个如果文件过大你得等到花儿红了，还得做异步下载…总之后期处理很麻烦）~~所以我也不推荐！~~ 当然相关资料很多我就不贴了，自己搜索一下一大堆

kkFileView为文件文档在线预览（kkFileView）
这个三方需要后台部署，具体可以问问你的团队后台伙伴
后台部署完成后会给你一个预览地址 http://00.000.00.000:0000/onlinePreview?url= 类似这个
那么接下来就是重点了那么安卓具体是这样做的（涉及到H5交互）

创建一个.html文件至accets目录下（下面是文件内容）

<html>

<script  type="text/javascript">
      function urlChange(url) {
         return encodeURIComponent(url) //encodeURIComponent进行文件url转码返回安卓页面
        }
</script>

</html>

2.安卓xml布局文件

    <WebView
            android:id="@+id/webView"
            android:layout_width="match_parent"
            android:layout_height="0dp"
            app:layout_constraintBottom_toBottomOf="parent"
            android:visibility="visible"
            app:layout_constraintTop_toBottomOf="@id/toolbar" />

kotlin代码（java代码类似）

viewDataBinding.web.loadUrl("file:///android_asset/show.html")//获取accets目录下html文件
  val script：String = "javascript:urlChange('http://000.000.00.0:0000/000.ppt')"//urlChange(url) 这个方法调用本地html种的js方法，url参数是你服务器的文件地址
  viewDataBinding.web.evaluateJavascript(script) { value ->
    	//此方法是获取本地HTML文件return回来的数据 value
    	//携带参数value跳转公共webview类 
    	//最终url 为服务器预览地址 + value
    	arouterBuild(RouterPageConstant.VIDEO_TEST)
                     .withString("value","http://00.000.00.000:0000/onlinePreview?url=${stringReplace(vas)}") //stringReplace这个方法是一个取消双引号的方法
                     .navigation()
  }
//跳转新页面后把value给安卓自带webview就可以了
	
	viewDataBinding.webView.loadUrl(value)

//使用这个方法是有时候回调回来的value不知道怎么滴就多了个双引号  会导致webview加载不出来 一定要注意
  fun stringReplace(str: String): String? { //去掉" "号
        return str.replace("\"", "")
    }

那么这样就可以了最后会发现webview加载文档速度很慢我们这样处理

//1、mainfaests 当前页面增加硬件加速
android:hardwareAccelerated="true"
//2、 代码中硬件加速____设置webview参数后添加
if ( viewDataBinding.webView.isHardwareAccelerated)
	viewDataBinding.webView.setLayerType(View.LAYER_TYPE_HARDWARE,null);
//3、附赠webview 配置参数
 webSettings.apply {
            javaScriptEnabled = true
            javaScriptCanOpenWindowsAutomatically = true
            setSupportZoom(true)
            builtInZoomControls = true
            displayZoomControls = false
            useWideViewPort = true //集WebView是否应该使支持“视窗”HTML meta标记或应该使用视窗。
            loadWithOverviewMode = true //是否使用WebView加载页面,也就是说,镜头拉出宽度适合在屏幕上的内容。
            cacheMode = WebSettings.LOAD_DEFAULT //缓存
            allowFileAccess = true //加载文件
            setAppCacheEnabled(true) // 设置H5的缓存打开
            domStorageEnabled = true
            setAppCacheEnabled(true)
            defaultTextEncodingName = "UTF-8"
            setAppCachePath(applicationContext.cacheDir.absolutePath)
            domStorageEnabled = true
            databaseEnabled = true
        }

这个是全网独有方式！觉得好的话点个赞吧！
期待留言如果适用我后期传demo！

码农公寓

相关文章