android 记一次富文本加载之路

madthumb 发布于2019-06-25 12:25 / 1946人阅读

摘要：一段简单的代码程序猿原生加载富文本原生的直接加载如果是有方法，但是这种加载方式，图片无法在显示。以上的两种方式按自己的需求来进行使用的，试用于后台接口直接返回数据给移动端进行加载的。

文章链接：https://mp.weixin.qq.com/s/69TRkmFL1aNuSqfw4ULMJw

项目中经常涉及到富文本的加载，后台管理端编辑器生成的一段html 代码要渲染到移动端上面，一种方法是前端做成html页面，放到服务器上，移动端这边直接webView 加载url即可，还有一种后台接口直接返回这段html富文本的，String类型的，移动端直接加载的；具体的需求按实际情况而定，webview直接加载url的就不说了，这里主要说说关于直接加载html的。

一段简单的html代码

private String txt = "
" +
            "程序猿TX
" +
            "
" +
            "
";

原生webView 加载富文本

原生的webView 直接加载

webView.loadDataWithBaseURL(null,txt,"text/html","UTF-8",null);

如果是textView 有setText(Html.fromHtml(txt))方法，但是这种加载方式，图片无法在textView显示。
如果非要使用textView 加载...

第三方库加载富文本

这里我使用的是RichText 第三方库

implementation ("com.zzhoujay.richtext:richtext:3.0.7"){
        exclude group: "com.android.support"
}

同时排除了support包的冲突，使用上

RichText.initCacheDir(this);

RichText.from(txt).into(tv);

更多的方法可以去github上查看，这种方式图片是可以加载的，但是css的样式是没法呈现的。

以上的两种方式按自己的需求来进行使用的，试用于后台接口直接返回数据给移动端进行加载的。

加载html文件

一般的webView直接加载url体验上没那么流畅，相对的加载html文件会好点。后台依旧返回html数据给移动端，前端负责写html 文件模板，android将html文件放在assets 文件夹下面，通过webView.loadUrl("file:///android_asset/**.html")加载，至于数据，就是移动端与前端的交互了，之前推荐过一个三方库 [android与js的交互之jsbridge使用
](https://www.manjiexiang.cn/bl...，通过这种方式将数据传递给前端，同时可以监听到js的方法调用。
这种方式更加适用于一个页面模板可以反复使用的，后台返回不同的数据进行加载。一个场景就是 viewpager里面的每个fragment页面结构相同，如果使用url加载，每个fragment里的webview去加载一个url，这种在体验上就不是很优雅，而使用html文件加载的方式，后台可以返回list 数据给移动端，对应的去用webview加载本地文件，把各项的数据传给前端展示，加载渲染的速度上会快点。当然如果原生的可以直接渲染页面的，优先原生的。
如果是那种单页面，只是浏览功能的，类似于 "关于我们" 那种页面可以直接用url加载的。

这篇文章主要介绍的是关于html 加载的，目前我们使用的是第三种方式的，不同的需求场景得根据各个项目来定的，关于第三种加载 html 文件的，后续再写一篇文章介绍移动端与前端交互的，而且我们加载的富文本内容相对的也不一样。

欢迎关注我的个人博客：https://www.manjiexiang.cn/

更多精彩欢迎关注微信号：春风十里不如认识你
一起学习，一起进步，欢迎上车，有问题随时联系，一起解决！！！

服务器托管私有云记一次在阿里云搭建服务器记一次阿里云服务器集体中毒 android学习之路 android架构师之路

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/14502.html

android 记一次富文本加载之路

摘要：一段简单的代码程序猿原生加载富文本原生的直接加载如果是有方法，但是这种加载方式，图片无法在显示。以上的两种方式按自己的需求来进行使用的，试用于后台接口直接返回数据给移动端进行加载的。文章链接：https://mp.weixin.qq.com/s/69TRkmFL1aNuSqfw4ULMJw 项目中经常涉及到富文本的加载，后台管理端编辑器生成的一段html 代码要渲染到移动端上面，一...

siberiawolf 2019-08-02 11:50 评论0 收藏0
原生Js交互之DSBridge

摘要：传值给原生通过方法传值，简单模拟了点击事件来传递。第一个参数是约定注册的名称，与原生接受处方法名一致第二个参数是要传递的值第三个参数是接受原生返回的回调。文章链接：https://mp.weixin.qq.com/s/Iqd0dKM-ZW4UwkIgSTnvYg 在上一篇文章「android 记一次富文本加载之路」中介绍了关于android加载富文本的方法，其中提到的加载html...

piapia 2019-06-25 12:26 评论0 收藏0
原生Js交互之DSBridge

摘要：传值给原生通过方法传值，简单模拟了点击事件来传递。第一个参数是约定注册的名称，与原生接受处方法名一致第二个参数是要传递的值第三个参数是接受原生返回的回调。文章链接：https://mp.weixin.qq.com/s/Iqd0dKM-ZW4UwkIgSTnvYg 在上一篇文章「android 记一次富文本加载之路」中介绍了关于android加载富文本的方法，其中提到的加载html...

chunquedong 2019-08-02 11:53 评论0 收藏0
原生Js交互之DSBridge

摘要：传值给原生通过方法传值，简单模拟了点击事件来传递。第一个参数是约定注册的名称，与原生接受处方法名一致第二个参数是要传递的值第三个参数是接受原生返回的回调。文章链接：https://mp.weixin.qq.com/s/Iqd0dKM-ZW4UwkIgSTnvYg 在上一篇文章「android 记一次富文本加载之路」中介绍了关于android加载富文本的方法，其中提到的加载html...

jemygraw 2019-08-23 12:44 评论0 收藏0
记一次 android 线上 oom 问题

摘要：问题分析随着回滚版本的放量，主端崩溃逐渐回归正常，进一步坐实了新版本存在问题。内容非常多但都是重复的，看起来进程没有启动，导致连接端一直在进行重连。背景公司的主打产品是一款跨平台的 App，我的部门负责为它提供底层的 sdk 用于数据传输，我负责的是 Adnroid 端的 sdk 开发。sdk 并不直接加载在 App 主进程，而是隔离在一个多带带进程中，然后两个进程通过 tcp 连接进行通信...

番茄西红柿 2021-11-29 10:50 评论0 收藏2637