页面渐变效果的实现方法及装置制造方法及图纸

本申请提供一种页面渐变效果的实现方法及装置。所述方法包括：接收目标交互页面的第一输入；响应于所述第一输入，确定所述目标交互页面的滑动距离；在所述滑动距离大于距离阈值的情况下，对所述目标交互页面施加渐变效果。本申请实施例提供的页面渐变效果的实现方法及装置，可以实现交互页面的动态化，从而可以满足用户的需求，提高了用户的留存率。提高了用户的留存率。提高了用户的留存率。

【技术实现步骤摘要】
页面渐变效果的实现方法及装置


[0001]本申请涉及图像处理
，具体涉及一种页面渐变效果的实现方法及装置。

技术介绍

[0002]现有电子设备的交互页面大多采用了Flutter页面方案。但在该方案中，页面基本都是静态的。随着业务场景不断迭代，以及用户对产品体验的极致追求，传统页面的静止效果已不能满足消费者的需求，导致用户留存率不高。
[0003]因此，将交互页面动态化，对于提高用户留存率具有十分重要的意义。

技术实现思路

[0004]本申请实施例提供一种页面渐变效果的实现方法及装置，用以解决页面的静止效果不能满足消费者的需求，导致用户留存率不高的技术问题。
[0005]第一方面，本申请实施例提供一种页面渐变效果的实现方法，包括：
[0006]接收目标交互页面的第一输入；
[0007]响应于所述第一输入，确定所述目标交互页面的滑动距离；
[0008]在所述滑动距离大于距离阈值的情况下，对所述目标交互页面施加渐变效果。
[0009]在一个实施例中，所述对所述目标交互页面施加渐变效果，包括：
[0010]根据所述滑动距离确定渐变程度参数；
[0011]根据所述渐变程度参数确定对所述目标交互页面施加渐变效果的渐变程度。
[0012]在一个实施例中，所述滑动距离与所述渐变程度参数线性相关，并且所述渐变程度参数与所述渐变程度线性相关。
[0013]在一个实施例中，本申请实施例提供的页面渐变效果的实现方法，还包括：
[0014]在所述滑动距离小于或等于距离阈值的情况下，使所述目标交互页面保持当前的显示效果。
[0015]在一个实施例中，本申请实施例提供的页面渐变效果的实现方法，还包括：
[0016]在所述滑动距离小于或等于距离阈值的情况下，在所述目标交互页面显示提示信息；所述提示信息用于提示继续滑动所述目标交互页面。
[0017]在一个实施例中，所述渐变效果包括以下至少一项：
[0018]毛玻璃显示效果；
[0019]颜色渐变效果；
[0020]亮度渐变效果；
[0021]对比度渐变效果。
[0022]第二方面，本申请实施例提供一种页面渐变效果的实现装置，包括：
[0023]滑动接收模块，用于接收目标交互页面的第一输入；
[0024]距离确定模块，用于响应于所述第一输入，确定所述目标交互页面的滑动距离；
[0025]渐变实现模块，用于在所述滑动距离大于距离阈值的情况下，对所述目标交互页
面施加渐变效果。
[0026]在一个实施例中，所述渐变实现模块具体用于：
[0027]根据所述滑动距离确定渐变程度参数；
[0028]根据所述渐变程度参数确定对所述目标交互页面施加渐变效果的渐变程度。
[0029]第三方面，本申请实施例提供一种电子设备，包括处理器和存储有计算机程序的存储器，所述处理器执行所述程序时实现第一方面所述的页面渐变效果的实现方法的步骤。
[0030]第四方面，本申请实施例提供一种处理器可读存储介质，所述处理器可读存储介质存储有计算机程序，所述计算机程序用于使处理器执行第一方面所述的页面渐变效果的实现方法的步骤。
[0031]本申请实施例提供的页面渐变效果的实现方法及装置，通过判断用户滑动目标交互页面的滑动距离与距离阈值的大小来确定是否对目标交互页面施加渐变效果，可以实现交互页面的动态化，从而可以满足用户的需求，提高了用户的留存率。
附图说明
[0032]为了更清楚地说明本申请或现有技术中的技术方案，下面将对实施例或现有技术描述中所需要使用的附图作一简单地介绍，显而易见地，下面描述中的附图是本申请的一些实施例，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据这些附图获得其他的附图。
[0033]图1是本申请实施例提供的页面渐变效果的实现方法的流程示意图；
[0034]图2是应用本申请实施例提供的页面渐变效果的实现方法的交互示意图；
[0035]图3是本申请实施例提供的页面渐变效果的实现装置的结构示意图；
[0036]图4是本申请实施例提供的电子设备的结构示意图。
具体实施方式
[0037]为使本申请的目的、技术方案和优点更加清楚，下面将结合本申请实施例中的附图，对本申请实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例是本申请一部分实施例，而不是全部的实施例。基于本申请中的实施例，本领域普通技术人员在没有作出创造性劳动前提下所获得的所有其他实施例，都属于本申请保护的范围。
[0038]图1是本申请实施例提供的页面渐变效果的实现方法的流程示意图。参照图1，本申请实施例提供一种页面渐变效果的实现方法，可以包括：
[0039]步骤110、接收目标交互页面的第一输入；
[0040]步骤120、响应于第一输入，确定目标交互页面的滑动距离；
[0041]步骤130、在滑动距离大于距离阈值的情况下，对目标交互页面施加渐变效果。
[0042]需要说明的是，本申请实施例提供的页面渐变效果的实现方法的执行主体可以是计算机设备，例如手机、平板电脑、笔记本电脑、掌上电脑、车载电子设备、可穿戴设备、超级移动个人计算机(ultra
‑
mobile personal computer，UMPC)、上网本或者个人数字助理(personal digital assistant，PDA)等。
[0043]下面以手机执行本申请实施例提供的页面渐变效果的实现方法为例，详细说明本
申请的技术方案。
[0044]在步骤110中，当用户滑动目标交互页面时，手机可以接收到该第一输入。
[0045]其中，目标交互页面可以是例如手机显示屏的背景页面、操作页面、信息显示页面等能够实现人机交互的页面。可选地，目标交互页面可以具体为Flutter页面。
[0046]在步骤120中，当手机接收到用户的第一输入后，会响应于该第一输入来确定用户滑动目标交互页面的滑动距离。
[0047]在步骤130中，手机会将滑动距离与距离阈值进行比较，并根据比较结果确定是否对目标交互页面施加渐变效果。
[0048]其中，距离阈值的具体大小可以为例如50px、100px等。本申请实施例对此不做具体限定。
[0049]当滑动距离大于距离阈值时，手机会对目标交互页面施加渐变效果。
[0050]例如，当距离阈值为100px时，若滑动距离大于100px，例如，当滑动距离为110px、200px时，手机会判定滑动距离大于距离阈值，则此时手机会对目标交互页面施加渐变效果。
[0051]其中，渐变效果可以包括以下至少一项：毛玻璃显示效果、颜色渐变效果、亮度渐变效果、对比度渐变效果。
[0052]本申请实施例提供的页面渐变效果的实现方法，通过判断用户滑动目标交互页面的滑本文档来自技高网...

【技术保护点】

【技术特征摘要】
1.一种页面渐变效果的实现方法，其特征在于，包括：接收目标交互页面的第一输入；响应于所述第一输入，确定所述目标交互页面的滑动距离；在所述滑动距离大于距离阈值的情况下，对所述目标交互页面施加渐变效果。2.根据权利要求1所述的页面渐变效果的实现方法，其特征在于，所述对所述目标交互页面施加渐变效果，包括：根据所述滑动距离确定渐变程度参数；根据所述渐变程度参数确定对所述目标交互页面施加渐变效果的渐变程度。3.根据权利要求2所述的页面渐变效果的实现方法，其特征在于，所述滑动距离与所述渐变程度参数线性相关，并且所述渐变程度参数与所述渐变程度线性相关。4.根据权利要求1所述的页面渐变效果的实现方法，其特征在于，还包括：在所述滑动距离小于或等于距离阈值的情况下，使所述目标交互页面保持当前的显示效果。5.根据权利要求1所述的页面渐变效果的实现方法，其特征在于，还包括：在所述滑动距离小于或等于距离阈值的情况下，在所述目标交互页面显示提示信息；所述提示信息用于提示继续滑动所述目标交互页面。6.根据权利要求1至...

【专利技术属性】
技术研发人员：周全金，
申请(专利权)人：海尔智家股份有限公司，
类型：发明
国别省市：