界面元素的滑动控制方法、界面显示方法及装置制造方法及图纸

本申请实施例提供一种界面元素的滑动控制方法、界面显示方法及装置。界面元素的滑动控制方法包括：显示一界面，界面包含可滑动的第一界面元素；响应于对第一界面元素的滑动操作，在界面上，与滑动操作关联地显示动效。本申请实施例通过增加滑动操作的趣味性，提高用户对滑动操作的新鲜感，以增加用户执行滑动操作的次数，提高界面元素的曝光率。

【技术实现步骤摘要】
界面元素的滑动控制方法、界面显示方法及装置
本申请涉及互联网
，尤其涉及一种界面元素的滑动控制方法、界面显示方法及装置。
技术介绍
随着互联网技术的发展，基于互联网的应用越来越多。而互联网应用与触屏终端的结合，使得互联网应用从早期的键盘操作时代、控件操作时代进入滑动操作时代。在大多互联网应用中，都需要在界面元素之间进行切换。基于滑动操作，用户只需轻轻滑动，即可完成界面元素之间的切换，这不仅可以提高屏幕利用率，而且有利于提高切换效率和用户使用体验度。
技术实现思路
为了进一步改善滑动技术，本申请专利技术人跟踪研究了大量支持滑动操作的应用。基于对大量支持滑动操作的应用的跟踪研究，首先发现：这些应用在滑动实现上比较类似，一般是：将多个待显示的界面元素排队，默认状态下界面上显示排在最前面的界面元素；当用户执行滑动操作时，当前显示的界面元素滑出界面，后面相邻的界面元素滑入界面。另外，为了发现滑动技术的改善空间，本申请专利技术人还从不同维度对滑动操作的效果进行了分析。其中，一个维度是默认状态下显示的界面元素的用户流量或转化率；另一个维度是需要用户滑动才能显示的界面元素的用户流量或转化率；再一维度是用户发生的滑动次数；又一维度是用户使用体验度。进一步，综合这些维度的分析结果，发现：非必要滑动操作的次数在逐渐减少，导致后面需要滑动才能显示的界面元素的曝光率呈下降趋势；而且用户对滑动操作的体验度越来越差。其中，导致上述问题的原因可能有多种，但本申请专利技术人对导致上述问题的原因进行了剖析，认定：在滑动操作出现初期，用户的新鲜感较强，这种新鲜感体现为用户频繁地进行滑动操作，后面界面元素的曝光率较高，用户对滑动操作的体验度较好；当滑动操作进入成熟期以后，即几乎所有应用都支持滑动操作时，用户对滑动操作的新鲜感逐渐消失，出现滑动疲态，这滑动疲态主要体现为用户一般只执行必要的滑动操作，非必要滑动操作的次数逐渐减少，导致后面需要滑动才能显示的界面元素的曝光率呈下降趋势。针对上述认定的原因，本申请专利技术人提出：通过增加滑动操作的趣味性，重新提高用户对滑动操作的新鲜感，降低滑动操作的枯燥感，以增加滑动操作的次数，提高界面元素的曝光率。基于上述分析，本申请实施例提供一种界面元素的滑动控制方法，包括：显示一界面，所述界面包含可滑动的第一界面元素；响应于对所述第一界面元素的滑动操作，在所述界面上，与所述滑动操作关联地显示动效。在一可选实施方式中，所述动效的显示步骤，包括：在所述第一界面元素的周边，与所述滑动操作关联地显示所述动效。在一可选实施方式中，所述动效的显示步骤，包括以下至少一种：在所述第一界面元素所在区域的相邻区域，与所述滑动操作关联地显示所述动效；在所述第一界面元素的内边界，与所述滑动操作关联地显示所述动效；在所述第一界面元素的外边界，与所述滑动操作关联地显示所述动效；以及在所述第一界面元素与其相邻界面元素的交界，与所述滑动操作关联地显示所述动效。在一可选实施方式中，所述动效的显示步骤，还包括：响应于对所述第一界面元素的滑动操作，沿滑动方向移动所述第一界面元素；以及接续于所述第一界面元素，将第二界面元素移入所述界面。在一可选实施方式中，所述动效的显示步骤，还包括：响应于对所述第一界面元素的滑动操作，在所述界面上，以与所述滑动操作的速度成比例变化的可视化属性，显示所述动效。在一可选实施方式中，所述动效为波动动效，其中，所述可视化属性包括：幅度、频率、颜色、持续时间中的至少一种。在一可选实施方式中，所述动效的显示步骤，还包括：在所述第一界面元素的边界上，周期性地绘制所述波动动效的轮廓曲线，或者水平偏移量不同的多条轮廓曲线，以形成所述波动动效。在一可选实施方式中，所述轮廓曲线的绘制步骤，包括：根据水平偏移初始值和所述轮廓曲线对应的周期数，结合所述滑动操作的速度，确定所述轮廓曲线的水平偏移量；根据垂直幅度初始值和所述轮廓曲线对应的周期数，结合所述波动动效的持续时间，确定所述轮廓曲线的垂直幅度值；根据所述轮廓曲线的水平偏移量和垂直幅度值，在所述第一界面元素的边界上绘制所述轮廓曲线。在一可选实施方式中，所述轮廓曲线的绘制步骤，还包括：根据所述轮廓曲线的水平偏移量和垂直幅度值，确定所述轮廓曲线在所述第一界面元素的边界上的像素点；连接所述像素点，以形成所述轮廓曲线；闭合所述轮廓曲线；填充所述闭合后的轮廓曲线。在一可选实施方式中，所述轮廓曲线为正弦曲线/余弦曲线；其中，所述轮廓曲线的水平偏移量的确定步骤，包括：offsetX＝offsetX0+(i-1)*speed_hua；所述轮廓曲线的垂直幅度值的确定步骤，包括：A＝A0*(1-(i-1)/(60*duration_hua))；其中，offsetX表示所述轮廓曲线的水平偏移量；offsetX0表示所述水平偏移初始值；speed_hua表示所述滑动操作的速度；i表示所述轮廓曲线对应的周期数；A表示所述轮廓曲线的垂直幅度值；A0表示所述垂直幅度初始值；duration_hua表示所述波动动效的持续时间。在一可选实施方式中，所述波动动效为水波纹动效、心电图动效、弹簧动效或振荡衰减动效。相应地，本申请实施例还提供一种界面显示方法，包括：显示一界面的入口；响应于对所述入口的点击操作，在所述界面上，显示动效以及与所述动效同步动作的界面元素。在一可选实施方式中，所述动效以及所述界面元素的显示步骤，包括：在所述界面的边界、顶部区域、底部区域或中间区域，显示所述动效以及所述界面元素。在一可选实施方式中，所述动效和/或所述界面元素的显示步骤，还包括：在所述界面上，以预设规律变化的可视化属性，显示所述动效和/或所述界面元素。在一可选实施方式中，所述动效为波动动效；其中，所述可视化属性包括：幅度、频率、颜色、持续时间中的至少一种。在一可选实施方式中，所述动效以及所述界面元素的显示步骤，还包括：在所述界面上，周期性地绘制所述波动动效的轮廓曲线，或者水平偏移量不同的多条轮廓曲线，以形成所述波动动效；以及在绘制所述轮廓曲线的过程中，根据所述界面元素与所述波动动效之间的相对位置，动态调整所述界面元素的位置。在一可选实施方式中，所述轮廓曲线的绘制步骤，包括：根据水平偏移初始值和所述轮廓曲线对应的周期数，结合预设水平偏移步长，确定所述轮廓曲线的水平偏移量；根据所述轮廓曲线的水平偏移量和预设的垂直幅度值，在所述界面上绘制所述轮廓曲线。在一可选实施方式中，所述轮廓曲线的绘制步骤，还包括：根据所述轮廓曲线的水平偏移量和预设的垂直幅度值，确定所述轮廓曲线在所述界面上的像素点；连接所述像素点，以形成所述轮廓曲线；闭合所述轮廓曲线；填充所述闭合后的轮廓曲线。在一可选实施方式中，所述波动动效为水波纹动效、心电图动效、弹簧动效或振荡衰减动效。在一可选实施方式中，所述界面为用户详情界面；所述界面元素为用户头像图标。本申请又一实施例提供一种界面元素的滑动控制装置，包括：界面显示单元，用于显示一界面，所述界面包含可滑动的第一界面元素；动效显示单元，用于响应于对所述第一界面元素的滑动操作，在所述界面上，与所述滑动操作关联地显示动效。在一可选实施方式中，动效显示单元具体用于：在所述第一界面元素的周边，与所述滑动操作关联地显示所述动效。在一可选实施方式中，本文档来自技高网...

【技术保护点】
一种界面元素的滑动控制方法，其特征在于，包括：显示一界面，所述界面包含可滑动的第一界面元素；响应于对所述第一界面元素的滑动操作，在所述界面上，与所述滑动操作关联地显示动效。

【技术特征摘要】
1.一种界面元素的滑动控制方法，其特征在于，包括：显示一界面，所述界面包含可滑动的第一界面元素；响应于对所述第一界面元素的滑动操作，在所述界面上，与所述滑动操作关联地显示动效。2.根据权利要求1所述的方法，其特征在于，所述动效的显示步骤，包括：在所述第一界面元素的周边，与所述滑动操作关联地显示所述动效。3.根据权利要求1或2所述的方法，其特征在于，所述动效的显示步骤，还包括：响应于对所述第一界面元素的滑动操作，在所述界面上，以与所述滑动操作的速度成比例变化的可视化属性，显示所述动效。4.根据权利要求3所述的方法，其特征在于，所述动效为波动动效，其中，所述可视化属性包括：幅度、频率、颜色、持续时间中的至少一种。5.根据权利要求4所述的方法，其特征在于，所述动效的显示步骤，还包括：在所述第一界面元素的边界上，周期性地绘制所述波动动效的轮廓曲线，或者水平偏移量不同的多条轮廓曲线，以形成所述波动动效。6.根据权利要求5所述的方法，其特征在于，所述轮廓曲线的绘制步骤，包...

【专利技术属性】
技术研发人员：雷岗，谢柯俊，张国忠，
申请(专利权)人：北京小度信息科技有限公司，
类型：发明
国别省市：北京,11