技术领域
[0001] 本
发明涉及移动端应用开发领域，具体涉及一种桥接原生列表视图的方法、存储介质、设备及系统。
背景技术
[0002] ReactNative是Facebook公司于2015年4月开源的跨平台移动应用开发
框架，是先前开源的JS(Javascript)框架React在原生移动应用平台的衍生产物，目前支持iOS和安卓两大平台，ReactNative致
力于提高多平台开发的开发效率。
[0003] 但是在使用ReactNative进行
软件开发，得到的移动端应用程序在使用的过程中，ReactNative提供的UI(User Interface，
用户界面)控件中的列表视图在处理多行数据时，存在内存占用高、页面刷新延迟高等问题。
发明内容
[0004] 针对
现有技术中存在的
缺陷，本发明的目的在于提供一种桥接原生列表视图的方法，能够有效避免使用ReactNative中提供的UI控件的列表视图存在的内存占用高、页面刷新延迟高问题。
[0005] 为达到以上目的，本发明采取的技术方案是，包括：
[0006] JS端按照设定数量创建一组视图，并将创建的一组视图发送至Native层；
[0007] Native层将接收的视图按照序号索引放至列表组件RecycleView中；
[0008] Native层监听RecycleView中的上下滑动事件，计算出RecycleView显示的首行和尾行的序号索引；
[0009] 将计算出的首行和尾行的序号索引通过ReactNative桥接
接口发送至JS端。
[0010] 在上述技术方案的
基础上，所述JS端按照设定数量创建一组视图，具体步骤为：JS端基于屏幕高度创建多个适配于屏幕高度的视图，且视图的个数为设定数量。
[0011] 在上述技术方案的基础上，所述JS端通过ReactNative桥接接口将创建的一组视图发送至Native层。
[0012] 在上述技术方案的基础上，所述Native层中还创建有数组，Native层将接收的视图存储至创建的数组中，然后再将视图按照序号索引放至列表组件RecycleView中。
[0013] 在上述技术方案的基础上，当将计算出的首行和尾行的序号索引通过ReactNative桥接接口发送至JS端，JS端接收了首行和尾行的序号索引后，JS端按照设定数量再次创建一组视图，然后将创建的一组视图发送至Native层。
[0014] 本发明还提供一种存储介质，其上存储有
计算机程序，所述计算机程序被处理器执行时实现以下步骤：
[0015] JS端按照设定数量创建一组视图，并将创建的一组视图发送至Native层；
[0016] Native层将接收的视图按照序号索引放至列表组件RecycleView中；
[0017] Native层监听RecycleView中的上下滑动事件，计算出RecycleView显示的首行和尾行的序号索引；
[0018] 将计算出的首行和尾行的序号索引通过ReactNative桥接接口发送至JS端。
[0020] 创建单元，其用于驱使JS端按照设定数量创建一组视图，并将创建的一组视图发送至Native层；
[0021] 存储单元，其用于将Native层接收的视图按照序号索引放至列表组件RecycleView中；
[0022] 监听单元，其用于在Native层监听RecycleView中的上下滑动事件，计算出RecycleView显示的首行和尾行的序号索引；
[0023] 传输单元，其用于将计算出的首行和尾行的序号索引通过ReactNative桥接接口发送至JS端。
[0024] 本发明还提供一种桥接原生列表视图的系统，包括：
[0025] 创建模
块，其用于驱使JS端按照设定数量创建一组视图，并将创建的一组视图发送至Native层；
[0026] 存储模块，其用于将Native层接收的视图按照序号索引放至列表组件RecycleView中；
[0027] 监听模块，其用于在Native层监听RecycleView中的上下滑动事件，计算出RecycleView显示的首行和尾行的序号索引；
[0028] 传输模块，其用于将计算出的首行和尾行的序号索引通过ReactNative桥接接口发送至JS端。
[0029] 在上述技术方案的基础上，所述创建模块驱使JS端按照设定数量创建一组视图，具体过程为：JS端基于屏幕高度创建多个适配于屏幕高度的视图，且视图的个数为设定数量。
[0030] 在上述技术方案的基础上，所述创建模块还用于在Native层中数组，Native层接收的视图存储至创建的数组中，然后再将视图按照序号索引放至列表组件RecycleView中。
[0031] 与现有技术相比，本发明的优点在于：在JS端按照设定数量创建视图并发送至Native层，Native层将接收视图按照序号索引放至列表组件RecycleView中，Native层监听到上下滑动事件时，将计算出的首行和尾行的序号索引通过ReactNative桥接接口发送至JS端，完成对于ReactNative中视图的桥接操作，通过桥接到RecycleView中方式，有效避免直接使用ReactNative中提供的UI控件的列表视图存在的内存占用高、页面刷新延迟高等问题。
附图说明
[0032] 图1为本发明
实施例中一种桥接原生列表视图的方法的
流程图；
[0033] 图2为本发明实施例中一种电子设备的结构示意图。
具体实施方式
[0034] 以下结合附图及实施例对本发明作进一步详细说明。本领域内的技术人员应明白，本发明的实施例可提供为方法、系统、或计算机程序产品。因此，本发明可采用完全
硬件实施例、完全软件实施例、或结合软件和硬件方面的实施例的形式。而且，本发明可采用在一个或多个其中包含有计算机可用程序代码的计算机可用存储介质(包括但不限于磁盘
存储器、CD-ROM、光学存储器等)上实施的计算机程序产品的形式。
[0035] 参见图1所示，本发明实施例提供一种桥接原生列表视图的方法，用于在ReactNative上桥接原生的列表视图。本发明实施例的桥接原生列表视图的方法，具体包括以下步骤：
[0036] S1：JS端按照设定数量创建一组视图，并将创建的一组视图发送至Native层，即在JS端创建设定数量的视图，组成一组视图，然后将该组视图发送至Native层。在Android平台中，分4层，分别为java应用程序、java框架、本地框架和java运行环境，Native层指的是本地框架。JS端按照设定数量创建一组视图，具体的为：JS端基于屏幕高度创建多个适配于屏幕高度的视图，且视图的个数为设定数量。本发明实施例中的屏幕为用于显示视图的智能移动设备的屏幕。JS端通过ReactNative桥接接口将创建的一组视图发送至Native层。
[0037] S2：Native层将接收的视图按照序号索引放至列表组件RecycleView中。RecycleView为Android平台的原生列表组件。
[0038] 在一种实施方式中，Native层中还创建有数组，Native层将接收的视图存储至创建的数组中，即Native层接收视图并以此存入数组中，然后再将视图按照序号索引放至列表组件RecycleView中。
[0039] S3：Native层监听RecycleView中的上下滑动事件，计算出RecycleView显示的首行和尾行的序号索引。Native层对RecycleView中的上下滑动事件进行监听，即当用户在屏幕上进行上下滑动操作时，此时被Native层监测，此时计算出RecycleView显示的首行和尾行的序号索引。
[0040] S4：将计算出的首行和尾行的序号索引通过ReactNative桥接接口发送至JS端，自此完成对于ReactNative中视图的桥接操作。当将计算出的首行和尾行的序号索引通过ReactNative桥接接口发送至JS端，JS端接收了首行和尾行的序号索引后，JS端按照设定数量再次创建一组视图，然后将创建的一组视图发送至Native层，以此进行循环。
[0041] 本发明实施例的桥接原生列表视图的方法，在JS端按照设定数量创建视图并发送至Native层，Native层将接收视图按照序号索引放至列表组件RecycleView中，Native层监听到上下滑动事件时，将计算出的首行和尾行的序号索引通过ReactNative桥接接口发送至JS端，完成对于ReactNative中视图的桥接操作，通过桥接到RecycleView中方式，有效避免直接使用ReactNative中提供的UI控件的列表视图存在的内存占用高、页面刷新延迟高等问题。
[0042] 本发明实施例还提供一种存储介质，其上存储有计算机程序，计算机程序被处理器执行时实现以下步骤：
[0043] JS端按照设定数量创建一组视图，并将创建的一组视图发送至Native层；
[0044] Native层将接收视图按照序号索引放至列表组件RecycleView中；
[0045] Native层监听RecycleView中的上下滑动事件，计算出RecycleView显示的首行和尾行的序号索引；
[0046] 将计算出的首行和尾行的序号索引通过ReactNative桥接接口发送至JS端。
[0047] JS端按照设定数量创建一组视图，具体步骤为：JS端基于屏幕高度创建多个适配于屏幕高度的视图，且视图的个数为设定数量。JS端通过ReactNative桥接接口将创建的一组视图发送至Native层。Native层中还创建有数组，Native层将接收的视图存储至创建的数组中，然后再将视图按照序号索引放至列表组件RecycleView中。
[0048] 参见图2所示，本发明实施例还提供一种电子设备，其包括创建单元、存储单元、监听单元和传输单元。
[0049] 创建单元用于驱使JS端按照设定数量创建一组视图，并将创建的一组视图发送至Native层；存储单元用于将Native层接收的视图按照序号索引放至列表组件RecycleView中；监听单元用于在Native层监听RecycleView中的上下滑动事件，计算出RecycleView显示的首行和尾行的序号索引；传输单元用于将计算出的首行和尾行的序号索引通过ReactNative桥接接口发送至JS端。
[0050] JS端按照设定数量创建一组视图，具体步骤为：JS端基于屏幕高度创建多个适配于屏幕高度的视图，且视图的个数为设定数量。JS端通过ReactNative桥接接口将创建的一组视图发送至Native层。Native层中还创建有数组，Native层将接收的视图存储至创建的数组中，然后再将视图按照序号索引放至列表组件RecycleView中。
[0051] 本发明还提供一种桥接原生列表视图的系统，包括创建模块、存储模块、监听模块和传输模块。
[0052] 创建模块用于驱使JS端按照设定数量创建一组视图，并将创建的一组视图发送至Native层；存储模块用于将Native层接收的视图按照序号索引放至列表组件RecycleView中；监听模块用于在Native层监听RecycleView中的上下滑动事件，计算出RecycleView显示的首行和尾行的序号索引；传输模块用于将计算出的首行和尾行的序号索引通过ReactNative桥接接口发送至JS端。
[0053] 创建模块驱使JS端按照设定数量创建一组视图，具体过程为：JS端基于屏幕高度创建多个适配于屏幕高度的视图，且视图的个数为设定数量。
[0054] 创建模块还用于在Native层中数组，Native层接收的视图存储至创建的数组中，然后再将视图按照序号索引放至列表组件RecycleView中。
[0055] 本发明实施例的桥接原生列表视图的系统，在JS端按照设定数量创建视图并发送至Native层，Native层将接收视图按照序号索引放至列表组件RecycleView中，Native层监听到上下滑动事件时，将计算出的首行和尾行的序号索引通过ReactNative桥接接口发送至JS端，完成对于ReactNative中视图的桥接操作，通过桥接到RecycleView中方式，有效避免直接使用ReactNative中提供的UI控件的列表视图存在的内存占用高、页面刷新延迟高等问题。
[0056] 本发明不局限于上述实施方式，对于本技术领域的普通技术人员来说，在不脱离本发明原理的前提下，还可以做出若干改进和润饰，这些改进和润饰也视为本发明的保护范围之内。本
说明书中未作详细描述的内容属于本领域专业技术人员公知的现有技术。
