上面webview 下边评论

2018-10-16 11:50:49

近日接到一个需求，需要在一个页面上方用webview显示网页的内容，下半部分用原生实现一个评论列表。

初步想法有两个：

1、Header模式：用RecyclerView显示原生的评论列表，把WebView作为RecyclerView的第0项。

ViewGroup.LayoutParams lp =newViewGroup.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT,ViewGroup.LayoutParams.WRAP_CONTENT);

WebView web =newWebView(parent.getContext());

web.setLayoutParams(lp);

需要把WebView撑开，保证WebView的内容完全展示。

2、ScrollView模式：最外层用NestedScrollView容器，内层放一个LinearLayout,从上到下依次是WebView和RecyclerView;

布局上没有什么大的问题，就是滚动会觉得有点卡，没有关系，设置一下就好了。

LinearLayoutManager layoutManager =newLinearLayoutManager(this);

layoutManager.setSmoothScrollbarEnabled(true);

layoutManager.setAutoMeasureEnabled(true);

recyclerView.setLayoutManager(layoutManager);

recyclerView.setHasFixedSize(true);

recyclerView.setNestedScrollingEnabled(false);

recyclerView.setLayoutManager(layoutManager);

Pros and Cons：

总的来说，优缺点非常明显，在评论列表条数特别多（实验时用了500条）的时候:

页面初始化结束时：Header模式申请的内存为25.77m；ScrollView模式申请的内存为37.87m

列表滚动到底时：Header模式申请的内存为28.09m; ScrollView模式申请的内存为40.63m

gc后：Header模式申请的内存为25.05m; ScrollView模式申请的内存为27.77m

Example: https://github.com/bobbySpace/WebviewAndList

  • 精彩推荐

  • 2020-04-03 19:10:56

    nodejs与javascript中的aes加密

    aes加密简单来说，在密码学中又称Rijndael加密法，是美国联邦政府采用的一种区块加密标准。这个标准用来替代原先的DES，已经被多方分析且广为全世界所使用。高级加密标准已然成为对称密钥加密中最流行的算法之一。

  • 2020-04-03 19:13:05

    Express-session的使用

    当浏览器访问服务器并发送第一次请求时，服务器端会创建一个 session 对象，生成一个类似于 key,value 的键值对，然后将 key(cookie)返回到浏览器(客户)端，浏览器下次再访问时，携带 key(cookie)， 找到对应的 session(value)。 客户的信息都保存在 session 中

  • 2020-04-08 22:46:28

    Element的操作方法

    Element 是一个通用性非常强的基类，所有 Document 对象下的对象都继承自它。这个接口描述了所有相同种类的元素所普遍具有的方法和属性。一些接口继承自 Element 并且增加了一些额外功能的接口描述了具体的行为。例如， HTMLElement 接口是所有 HTML 元素的基本接口，而 SVGElement 接口是所有 SVG 元素的基础。大多数功能是在这个类的更深层级（hierarchy）的接口中被进一步制定的。

  • 2020-04-12 17:42:43

    Node.js设置CORS跨域请求中多域名白名单的方法

    在Node.js中，res的响应头Header中的 Access-Control-Allow-Origin 属性不能匹配除 (*) 以外的正则表达式的，域名之间不能也用逗号分隔。也就是说， Access-Control-Allow-Origin 的属性值只允许设置为单个确定域名字符串或者 (*)。

  • 2020-04-14 09:40:59

    CSS3实现文字描边的2种方法

    首先想到去看CSS3有没有什么属性可以实现，后来被我找到了text-stroke 　 　　该属性是一个复合属性，可以设置文字宽度和文字描边颜色 　 　　 该属性使用很简单：text-stroke:1px #f00;（1px是文字宽度，#ff是文字描边颜色）

  • 2020-04-14 09:42:47

    用 TypeScript 编写 npm 模块

    自从开始使用 Node.js 已经一年多，写的代码越多，越是觉得自己提高的越慢。想来应该有没有将单一功能的代码封装在一个独立模块，而导致代码稍微多一点就维护困难的原因。