[发明专利]导航点过渡动画显示方法和电子设备

说明书

本申请公开了一种导航点过渡动画显示方法和电子设备，涉及终端领域，用于在页面切换过程中显示导航点之间的过渡动画。导航点过渡动画显示方法包括：在显示屏上显示第一页面、第一导航点和第二导航点，第一导航点指示正在显示第一页面，第二导航点用于指示显示第二页面；响应于在显示屏上的滑动操作，显示从第一页面向第二页面切换，并显示从第一导航点至第二导航点的过渡动画。

技术领域

本申请涉及终端领域，尤其涉及一种导航点过渡动画显示方法和电子设备。

背景技术

手机、平板等电子设备在显示页面时通常在下方显示对应的导航点，当用户切换页面时，导航点会联动变化，例如，现有技术中通常通过加粗当前页面对应的导航点来进行联动，这种显示方式只能体现页面切换结果，用户体验不好。

发明内容

本申请实施例提供一种导航点过渡动画显示方法和电子设备，用于在页面切换过程中显示导航点之间的过渡动画。

为达到上述目的，本申请的实施例采用如下技术方案：

第一方面，提供了一种导航点过渡动画显示方法，应用于包括显示屏的电子设备，该方法包括：在显示屏上显示第一页面、第一导航点和第二导航点，第一导航点指示正在显示第一页面，第二导航点用于指示显示第二页面；响应于在显示屏上的滑动操作，显示从第一页面向第二页面切换，并显示从第一导航点至第二导航点的过渡动画；其中，过渡动画包括第一滑动端点、第二滑动端点以及位于第一滑动端点与第二滑动端点之间的连接区域，显示从第一导航点至第二导航点的过渡动画，包括：获取从第一页面向第二页面切换的滑动距离；根据滑动距离和页面宽度确定滑动比例；根据滑动比例、第一导航点的坐标以及第二导航点的坐标确定第一滑动端点的坐标和第二滑动端点的坐标；第一滑动端点的起始坐标和第二滑动端点的起始坐标为第一导航点的坐标；绘制第一滑动端点、第二滑动端点以及连接区域。

本申请实施例提供的导航点过渡动画显示方法，在页面切换过程中显示导航点之间的过渡动画，呈现出导航点平滑拉伸效果，且拉伸方向与手指滑动方向相同，从而提升用户的操作体验。

在一种可能的实施方式中，根据滑动比例、第一导航点的坐标以及第二导航点的坐标确定第一滑动端点的坐标和第二滑动端点的坐标，包括：当检测到手指的滑动操作并且未抬起时，确定第一滑动端点的坐标等于第一导航点的坐标，以及，控制第二滑动端点的坐标使得第二滑动端点和第一滑动端点之间距离随着滑动比例变化；当检测到手指抬起时，如果滑动比例小于阈值，则控制第二滑动端点向第一导航点滑动；当检测到手指抬起时，如果滑动比例大于或等于阈值，则控制第一滑动端点和第二滑动端点向第二导航点滑动。该实施方式使得导航点呈现出平滑拉伸效果。

在一种可能的实施方式中，在第一滑动端点和第二滑动端点向第二导航点滑动过程中，还包括：在第二滑动端点的坐标与第二导航点的坐标相同之前，控制第一滑动端点和第二滑动端点采用相同速度向第二导航点滑动；当第二滑动端点的坐标与第二导航点的坐标相同时，控制第一滑动端点加速向第二导航点滑动，实现快速切换导航点效果。

在一种可能的实施方式中，第二滑动端点和第一滑动端点之间距离为滑动比例的单调递增函数。也就是说，随着手指滑动距离越来越大，滑动比例也越来越大，第二滑动端点和第一滑动端点之间距离也越来越大，由于第一滑动端点保持不动，即第二滑动端点逐渐远离第一导航点，并逐渐接近第二导航点。

在一种可能的实施方式中，第一滑动端点、第二滑动端点以及连接区域的填充颜色由分层参数来定义。第一滑动端点、第二滑动端点和连接区域填充的颜色可以根据不同的主题来定制，通过分层参数可以实现同一标识在不同主题下自动对应不同的填充颜色，降低编程复杂度。

第二方面，提供了一种电子设备，包括显示屏和处理器，处理器用于执行如第一方面及其任一实施方式所述的方法，以在显示屏上显示导航点过渡动画。