滚动视图显示方法及装置与流程

本申请涉及计算机技术领域，尤其涉及一种滚动视图显示方法及装置。

背景技术：

随着终端设备屏幕的越来越大，在一屏范围内可以呈现多个信息展示区，同时随着多点触控技术的出现以及在终端设备上的成功应用，使得用户在同一时刻对所述多个信息展示区分别进行诸如滑动、点击的操作成为可能。

上述信息展示区具体展示的对象可以为滚动视图。滚动视图可以支持左右或上下滑动操作。一个滚动视图中包含至少两个子视图，子视图中可以展现图片及文字信息。若在滚动视图当前显示的子视图上执行向左或向右的滑动操作，则可以轮流播放该滚动视图中包含的子视图。

在针对一个滚动视图执行滑动操作时，每滑动一次就要加载一个子视图，这将引起设备较大的内存消耗，为了减少内存的消耗，采用了视图复用技术，也即将因滑动操作从屏幕移出的子视图保存起来，在再次需要该子视图时，从保存的子视图中直接取出该子视图并使用。

上述视图复用技术在一定程度上减少了内存的消耗。然而，多触控技术使得一屏中可以展示多个滚动视图，并且可以同时对一屏中展示的多个滚动视图进行上下快速滑动，该上下快速滑动以在当前屏幕中展示新的滚动视图，展示的每个滚动视图中所包含的所有子视图均要加载并保存，即使采用上述视图复用技术，在数量如此之多的滚动视图下，设备的内存也很快被消耗殆尽，进而使得滚动视图的显示出现卡顿，直至闪退。

技术实现要素：

本申请实施例提供一种滚动视图显示方法及装置，用以解决现有的滚动视 图显示中存在的内存消耗量大的问题。

一种滚动视图显示方法，包括：

创建滚动视图框架和视图模板，所述视图模板中包含的图片为占位图片；

利用创建的滚动视图框架和视图模板复制出至少一个滚动视图框架和至少一个视图模板；

确定当前屏幕需要显示的至少一张第一非占位图片；

针对每一第一非占位图片，利用该第一非占位图片替换一个视图模板中的占位图片，形成一个第一子视图；

针对形成的每一第一子视图，将该第一子视图添加到复制出的一个滚动视图框架中，形成一个第一滚动视图，其中，一个第一滚动视图中包含一个第一子视图；

在屏幕中显示形成的至少一个第一滚动视图。

一种滚动视图显示装置，包括：

创建单元，用于创建滚动视图框架和视图模板，所述视图模板中包含的图片为占位图片；

复制单元，用于利用创建的滚动视图框架和视图模板复制出至少一个滚动视图框架和至少一个视图模板；

确定单元，确定当前屏幕需要显示的至少一张第一非占位图片；

子视图形成单元，用于针对每一第一非占位图片，利用该第一非占位图片替换一个视图模板中的占位图片，形成一个第一子视图；

滚动视图形成单元，用于针对形成的每一第一子视图，将该第一子视图添加到复制出的一个滚动视图框架中，形成一个第一滚动视图，其中，一个第一滚动视图中包含一个第一子视图；

显示单元，用于在屏幕中显示形成的至少一个第一滚动视图。

在本申请实施例的方案中，事先创建了滚动视图框架和视图模板，该视图模板中包括占位图片，后续利用该视图模板形成第一子视图，减少了内存的占 用，同时，进行滚动视图的显示时，并非立即加载构成当前屏幕显示的各滚动视图的所有子视图，而是根据当前屏幕需要显示的非占位图片，生成包含一个第一子视图的第一滚动视图并显示，从而解决了现有技术在加载滚动视图时存在的内存消耗大的问题，加快了滚动视图的加载及显示速度。

附图说明

图1为本申请实施例一提供的滚动视图显示方法流程图；

图2为本申请实施例一提供的滚动视图示意图；

图3为本申请实施例二提供的滚动视图显示方法流程图；

图4为本申请实施例三提供的滚动视图显示装置的结构示意图。

具体实施方式

本申请实施例提供一种滚动视图显示方法及装置，用以解决现有的滚动视图显示中存在的内存消耗量大的问题。

以下结合说明书附图对本申请的优选实施例进行说明，应当理解，此处所描述的优选实施例仅用于说明和解释本申请，并不用于限定本申请。并且在不冲突的情况下，本申请中的实施例及实施例中的特征可以相互组合。

实施例一

如图1所示，其为本申请实施例一的滚动视图显示方法流程图，包括以下步骤：

步骤101：创建滚动视图框架和视图模板，所述视图模板中包含的图片为占位图片；

其中，滚动视图框架提供自动滚动及缩放功能，能支持子视图的滚动操作。滚动视图框架和视图模板是用来构建滚动视图的。通常，将子视图添加到滚动视图框架，可构成滚动视图。

所述滚动视图框架的尺寸是根据当前屏幕的宽和高以及确定一屏内需要显示的滚动视图的个数来确定的；

所述占位图片是视图模板在没有真实的图片的情况下进行布局时使用的图片，该图片数据量较小。

此外，在滚动视图中包含文字时，所述视图模板中还包括文字框，以及文字大小和样式信息；

步骤102：将所述滚动视图框架和视图模板放入到缓存；

由于处理器可以快速地从缓存中存取数据，上述滚动视图框架和视图模板又是频繁被用来构建显示在屏幕上的滚动视图的，因此，将所述滚动视图框架和视图模板加载到缓存，有利于处理器快速从缓存中取出所述滚动视图框架和视图模板，进而在下述步骤中快速地形成第一滚动视图并显示；

需要说明的是，本步骤102是本申请实施例的优选步骤，目的是为了加快滚动视图的形成速度；

步骤103：利用创建的滚动视图框架和视图模板复制出至少一个滚动视图框架和至少一个视图模板；

这里形成的滚动视图框架以及滚动视图模板的个数可以与一屏内显示的第一滚动视图的个数相同；

复制视图模板的目的是，为了后续利用复制的视图模板生成第一子视图；复制视图模板的目的是，利用复制的滚动视图框架和生成的第一子视图生成第一滚动视图。

若步骤102中，将创建的滚动视图框架和视图模板放入了缓存中，则本步骤103中具体包括：

从缓存查找所述滚动视图框架和视图模板，利用查找到的滚动视图框架复制出至少一个滚动视图框架，以及复制出至少一个视图模板；

步骤104：确定当前屏幕需要显示的至少一张第一非占位图片；

这里确定的第一非占位图片是构成当前屏幕将要显示的第一子视图中的 图片。

这里确定第一非占位图片的目的是，为了形成当前屏幕将要显示的第一子视图。

具体的，可以先确定当前屏幕需要显示的至少一张非占位图片的图片链接，之后根据所述图片链接，获取相应的图片。

通常，一张非占位图片具有一个图片链接，因此，在获知需要显示的非占位图片的图片链接时，就可以从网络中下载该非占位图片。

步骤105：针对确定的每一第一非占位图片，利用该第一非占位图片替换一个视图模板中的占位图片，生成一个第一子视图；

这里将一张非占位图片替换掉一个视图模板的占位图片，就可以得到一个第一子视图。若上述步骤103中复制出的视图模板的个数有4个，步骤104中确定了4张非占位图片，则本步骤105中，可以生成4个第一子视图；

若在步骤101中所述视图模板还包括文字框，以及文字大小和样式信息，则在上述步骤104中，还需要确定与当前屏幕需要显示的至少一张非占位图片对应的文字信息；此时，本步骤105中具体包括：

针对确定的每一张第一非占位图片以及对应的文字信息，利用该第一非占位图片替换所述视图模板中的占位图片，将该对应的文字信息按照所述文字大小和样式信息填充在所述文字框中，生成第一子视图。此时，生成的第一子视图既有第一非占位图片又有文字。

步骤106：针对形成的每一第一子视图，将该第一子视图添加到复制出的一个滚动视图框架中，形成一个第一滚动视图；

这里，若形成的第一子视图的数量为4，复制出的滚动视图框架的数量也为N，则步骤106中可以形成4个第一滚动视图。

步骤107：在屏幕中显示形成的至少一个第一滚动视图。

下面通过举例对上述步骤107中形成的第一滚动视图进行说明：

图2中给出了一屏中包含四个滚动视图时的示意图。其中，虚线表示的各 第二子视图是指可以通过左右滑动操作滑出并显示到屏幕上的子视图。在假设完整的滚动视图A包含第一子视图A1、第二子视图A2、第二子视图A3及第二子视图A4；完整的滚动视图B包含子视图第一B1、第二子视图B2、第二子视图B3及第二子视图B4；完整的滚动视图C包含第一子视图C1、第二子视图C2、第二子视图C3及第二子视图C4，完整的滚动视图D包含子视图第一D1、子视图D2、第二子视图D3及第二子视图D4时，现有技术的视图显示技术将完整的滚动视图A、完整的滚动视图B、完整的滚动视图C和完整的滚动视图D包含的全部子视图都直接利用非占位图片生成及加载出来，但显示在屏幕上的是第一子视图A1、第一子视图B1、第一子视图C1和第一子视图D1，而本申请中生成及加载的第一滚动视图A仅包括第一子视图A1、第一滚动视图B仅包括第一子视图B1、第一滚动视图C仅包括第一子视图C1、第一滚动视图D仅包括第一子视图D1，也即仅加载滚动视图的第一子视图，因为此时还不确定用户是否需要浏览该滚动视图的各第二子视图，因此，不需要加载也不影响用户浏览。

通常用户仅先粗略地浏览的滚动视图的第一子视图，在对第一子视图感兴趣后才会对该第一子视图执行滑动操作，实现继续浏览该滚动视图的各第二子视图，因此，本申请实施例的方案，显示包括第一子视图的第一滚动视图的方案，能较好地解决现有的滚动视图显示中存在的内存消耗量大的问题，使得滚动视图的形成、加载及显示的速度较快，并且不影响用户体验。

较佳的，所述方法还包括：

在所述第一滚动视图滑出屏幕的可视区域时，释放该第一滚动视图占用的内存。

由于在第一滚动视图滑出屏幕的可视区域时，就释放了该第一滚动视图占用的内存，因此实现了内存的回收，最大程度上节约了内存资源。

考虑到用户可能会对当前屏幕显示的第一滚动视图感兴趣，对该第一滚动视图执行滑动操作，以便获得更多的信息，较佳的，所述方法还包括以下步骤：

步骤a：监测用户针对当前显示的第一滚动视图的滑动操作；

这里，可以通过在检测到用户针对某一第一滚动视图的手指触摸事件之后，可以设置一个计时器，若在计时器到达设定值前发生了手指移动事件，则确定用户针对该第一滚动视图进行了滑动操作。

步骤b：在监测到用户针对某一第一滚动视图进行左右滑动时，确定至少一个第二非占位图片；

滑动第一滚动视图中的第一子视图之后，应该切换该第一子视图至第二子视图，这里的第二非占位图片即为用于形成第二子视图的图片。

假设在本步骤b中监测到用户针对第一滚动视图A中的第一子视图进行左右滑动时，则此时确定的第二非占位图片可以为用于构成第二子视图A2的图片a2、构成第二子视图A3的图片a3和用于构成第二子视图A4的图片a4。

步骤c：利用创建的视图模板复制出至少一个视图模板；

这里在用户滑动第一滚动视图时，需要将该第一滚动视图的子视图切换至第二子视图，然而，第一滚动视图中并没有添加第二子视图，因此，这里需要复制视图模板，进而利用复制的视图模板和步骤b中确定的的第二非占位图片，生成第二子视图。

步骤d：针对确定的每一第二非占位图片，使用该第二非占位图片替换视图模板中的占位图片，生成第二子视图；

沿用步骤b中的例子，这里形成的第二子视图即为第二子视图A2、第二子视图A3和第二子视图A4。

步骤e：将生成的各第二子视图添加到第一滚动视图中，形成第二滚动视图；

沿用步骤d中的例子，这里形成的第二滚动视图即为包括子视图A1、子视图A2、子视图A3和子视图A4的完整的滚动视图。

步骤f：显示形成的该第二滚动视图。

上述步骤a至步骤e中，体现的是在用户真正对某一第一滚动视图感兴趣 (用户针对该第一滚动视图进行了左右滑动操作，说明用户对该第一滚动视图感兴趣)时，才加载该第一滚动视图的各第二子视图，以及利用生成的各第二子视图来形成第二滚动视图，相对于现有技术而言，由于仅加载并形成用户感兴趣的第二滚动视图(也即完整的滚动视图)，因此，不影响用户体验的同时，减少了内存的占用，提高了对用户左右滑动手势的响应速度。

上述步骤b中，确定至少一个第二非占位图片，具体包括：

第一步：确定至少一个第二非占位图片的图片链接；

第二步：利用所述图片链接从网络中下载至少一个第二非占位图片。

由于是在用户开始滑动第一滚动视图时，从网络中下载用于构成该第一滚动视图的各第二子视图的第二非占位图片，因此，相对于现有技术的不管不论用户是否开始滑动滚动视图，将至少一个第二非占位图片均从网络中下载下来而言，节约了网络流量和电池电量。

仍沿用图2中所示的滚动视图，一屏中显示4个滚动视图，每个完整的滚动视图均包括4个子视图，在显示一屏滚动视图时就需要从网络中下载16张图片，在上下滑动时会产生N屏滚动视图，就需要从网络中下载16N张图片，这将耗费较多的网络流量和电池电量；而采用本申请实施例的方案，下载构成用户进行了滑动操作的第一滚动视图的各第二子视图的第二非占位图片，也即用户感兴趣的第一滚动视图，而用户通常情况下仅会对屏幕中显示的第一滚动视图中的部分(例如M个第一滚动视图，M通常情况下远小于4N)第一滚动视图产生兴趣并进行左右滑动操作，因此，仅需要下载4M张图片，相比与现有技术的下载16N张图片，耗费的网络流量和电池电量相对较少，提升了用户体验。

此外，在申请实施例的方案中，还可以通过对屏幕进行上下滑动的速度的监控，来对内存消耗和网络流量进行进一步优化，下面通过实施例二的方案进行说明。

实施例二

如图3所示，其为本申请实施例二中的滚动视图显示方法流程图，包括以下步骤：

步骤301：创建滚动视图框架和视图模板，所述视图模板中包含的图片为占位图片；

步骤302：将所述滚动视图框架和视图模板加载到缓存；

步骤303：利用创建的滚动视图框架和视图模板复制出至少一个滚动视图框架和至少一个视图模板；

上述步骤301至步骤303与实施例一中的步骤101至步骤103具体细节相同，这里不再赘述。

步骤304：监测用户针对屏幕进行上下滑动的速度；

步骤305：判断监测到的速度是否大于设定值；若否，则执行步骤306；若是，则执行步骤307；

所述设定值可以通过对用户上下滑动速度及对第一滚动视图的感兴趣与否进行学习得到；

步骤306：确定当前屏幕需要显示的至少一张第一非占位图片；之后执行步骤308；

考虑到用户对屏幕进行上下滑动的速度越小，表明用户对当前屏幕中需要显示的第一滚动视图感兴趣的程度越大，因此，本步骤306中需要对构成当前屏幕需要显示的第一子视图的第一非占位图片进行确定，进而在后续步骤中形成第一滚动视图，满足用户的需求。

步骤307：针对复制出的每一滚动视图框架，将一个视图模板添加到该滚动视图框架中，形成一个第三滚动视图；之后执行步骤309；

考虑到用户对屏幕进行上下滑动的速度越大，表明用户对当前屏幕中显示的第一滚动视图感兴趣的程度越小，因此，本步骤307中并不对构成当前屏幕需要显示的第一子视图的第一非占位图片进行确定，仅是将包含有占位图片的 视图模板添加到滚动视图框架，形成第三滚动视图；由于不进行第一非占位图片的确定，也即不需要从网络中下载相应的图片，因此，节约了网络流量的同时，也减少了内存的消耗，提高了对用户上下滑动手势的响应速度，使得第三滚动视图的显示较为流畅。

步骤308：针对确定的每一第一非占位图片，利用该第一非占位图片替换一个视图模板中的占位图片，生成第一子视图；之后执行步骤310；

步骤309：在屏幕中显示形成的各第三滚动视图。

本步骤309中在屏幕上看到的即为包含占位图片的第三滚动视图；

步骤310：针对复制出的每一滚动视图框架，将一个第一子视图添加到该滚动视图框架，形成第一滚动视图；之后执行步骤311；

步骤311：在屏幕中显示形成的至少一个第一滚动视图。

通俗地说，本申请实施例二的方案也即为：当用户快上下滑动速度较快时，直接利用视图模板和滚动视图框架形成第三滚动视图，并不创建第一子视图和第二子视图；当用户快上下滑动速度较慢时，才利用复制出的视图模板来创建第一子视图，并将该第一子视图添加到滚动视图框架中，形成并显示第一滚动视图。

通过本申请实施例二的方案，对用户针对屏幕进行上下滑动操作时的视图显示进行了优化，根据对上下滑动的速度来确定是否需要进行第一滚动视图的创建，不影响用户对感兴趣的第一滚动视图的浏览的同时节约了网络流量的同时提高了对用户上下滑动手势的响应速度，使得第一滚动视图及第三滚动视图的显示较为流畅，提高了用户体验。

本申请实施方式尤其适合于针对智能终端的多滚动视图显示。其中，智能终端可以包括但是不局限于：功能手机、智能手机、掌上电脑、个人电脑(PC)、车载电脑、平板电脑或个人数字助理(PDA)等等。

实施例三

基于与实施例一及实施例二的同一发明构思，本申请实施例三提供了一种滚动视图显示装置，其结构示意图如图4所示，包括：

创建单元41，用于创建滚动视图框架和视图模板，所述视图模板中包含的图片为占位图片；

复制单元42，用于利用创建的滚动视图框架和视图模板复制出至少一个滚动视图框架和至少一个视图模板；

确定单元43，确定当前屏幕需要显示的至少一张第一非占位图片；

子视图形成单元44，用于针对每一第一非占位图片，利用该第一非占位图片替换一个视图模板中的占位图片，形成一个第一子视图；

滚动视图形成单元45，用于针对形成的每一第一子视图，将该第一子视图添加到复制出的一个滚动视图框架中，形成一个第一滚动视图，其中，一个第一滚动视图中包含一个第一子视图；

显示单元46，用于在屏幕中显示形成的至少一个第一滚动视图。

较佳的，所述装置还包括：

监测单元47，用于监测用户针对当前显示的第一滚动视图中的第一子视图的滑动操作；

所述确定单元43，还用于在监测到用户针对某一第一子视图进行滑动操作时，确定至少一张第二非占位图片；

所述复制单元42，还用于利用创建的视图模板复制出至少一个视图模板；

所述子视图形成单元44，还用于针对确定的每一第二非占位图片，使用该第二非占位图片替换复制出的一个视图模板中的占位图片，生成一个第二子视图；

所述滚动视图形成单元45，还用于将生成的各第二子视图添加到该第一子视图所在的第一滚动视图中，形成第二滚动视图；

所述显示单元46，还用于在屏幕中显示形成的第二滚动视图中的第二子视图。

较佳的，所述装置还包括：

监测单元47，用于监测用户针对屏幕进行上下滑动的速度；

判断单元48，用于判断监测到的速度是否大于设定值；

所述确定单元43，具体用于在监测单元监测到上下滑动的速度不大于设定值时，确定当前屏幕需要显示的至少一张第一非占位图片。

较佳的，所述滚动视图形成单元45，还用于在监测到的速度大于设定值时，针对复制出的每一滚动视图框架，将一个视图模板添加到该滚动视图框架中，形成一个第三滚动视图；

所述显示单元46，还用于在屏幕中显示形成的各第三滚动视图。

较佳的，所述装置还包括：

释放单元49，用于在所述第一滚动视图滑出屏幕的可视区域时，释放该第一滚动视图占用的内存。

通过以上的实施方式的描述，本领域的技术人员可以清楚地了解到本申请实施例可以通过硬件实现，也可以借助软件加必要的通用硬件平台的方式实现。基于这样的理解，本申请实施例的技术方案可以以软件产品的形式体现出来，该软件产品可以存储在一个非易失性存储介质(可以是CD-ROM，U盘，移动硬盘等)中，包括若干指令用以使得一台计算机设备(可以是个人计算机，服务器，或者网络设备等)执行本申请各个实施例所述的方法。

本领域技术人员可以理解附图只是一个优选实施例的示意图，附图中的模块或流程并不一定是实施本申请所必须的。

本领域技术人员可以理解实施例中终端中的模块可以按照实施例描述进行分布于实施例的终端中，也可以进行相应变化位于不同于本实施例的一个或多个终端中。上述实施例的模块可以合并为一个模块，也可以进一步拆分成多个子模块。

上述本申请实施例序号仅仅为了描述，不代表实施例的优劣。

显然，本领域的技术人员可以对本申请进行各种改动和变型而不脱离本申 请的精神和范围。这样，倘若本申请的这些修改和变型属于本申请权利要求及其等同技术的范围之内，则本申请也意图包含这些改动和变型在内。