CN106775227B - 一种页面切换的方法及*** - Google Patents

一种页面切换的方法及*** Download PDF

Info

Publication number
CN106775227B
CN106775227B CN201611107989.1A CN201611107989A CN106775227B CN 106775227 B CN106775227 B CN 106775227B CN 201611107989 A CN201611107989 A CN 201611107989A CN 106775227 B CN106775227 B CN 106775227B
Authority
CN
China
Prior art keywords
value
convex
abscissa value
page
abscissa
Prior art date
Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
Active
Application number
CN201611107989.1A
Other languages
English (en)
Other versions
CN106775227A (zh
Inventor
刘德建
陈鹏
曾少彬
方振华
郭玉湖
Current Assignee (The listed assignees may be inaccurate. Google has not performed a legal analysis and makes no representation or warranty as to the accuracy of the list.)
Fujian Tianquan Educational Technology Ltd
Original Assignee
Fujian Tianquan Educational Technology Ltd
Priority date (The priority date is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the date listed.)
Filing date
Publication date
Application filed by Fujian Tianquan Educational Technology Ltd filed Critical Fujian Tianquan Educational Technology Ltd
Priority to CN201611107989.1A priority Critical patent/CN106775227B/zh
Publication of CN106775227A publication Critical patent/CN106775227A/zh
Application granted granted Critical
Publication of CN106775227B publication Critical patent/CN106775227B/zh
Active legal-status Critical Current
Anticipated expiration legal-status Critical

Links

Classifications

    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00—Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
    • G06F3/01—Input arrangements or combined input and output arrangements for interaction between user and computer
    • G06F3/048—Interaction techniques based on graphical user interfaces [GUI]
    • G06F3/0481—Interaction techniques based on graphical user interfaces [GUI] based on specific properties of the displayed interaction object or a metaphor-based environment, e.g. interaction with desktop elements like windows or icons, or assisted by a cursor's changing behaviour or appearance
    • G06F3/04812—Interaction techniques based on cursor appearance or behaviour, e.g. being affected by the presence of displayed objects
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F2203/00—Indexing scheme relating to G06F3/00 - G06F3/048
    • G06F2203/048—Indexing scheme relating to G06F3/048
    • G06F2203/04801—Cursor retrieval aid, i.e. visual aspect modification, blinking, colour changes, enlargement or other visual cues, for helping user do find the cursor in graphical user interfaces

Landscapes

  • Engineering & Computer Science (AREA)
  • General Engineering & Computer Science (AREA)
  • Theoretical Computer Science (AREA)
  • Human Computer Interaction (AREA)
  • Physics & Mathematics (AREA)
  • General Physics & Mathematics (AREA)
  • User Interface Of Digital Computer (AREA)

Abstract

本发明涉及页面展示领域，尤其涉及一种页面切换的方法及***。本发明通过获取当前页面指示标签的中心点的横坐标值，得到第一横坐标值；获取目标页面指示标签的中心点的横坐标值，得到第二横坐标值；绘制凸形图最高点对应的横坐标值从所述第一横坐标值变换到所述第二横坐标值的过程中与页面的实时滑动距离对应的凸形图。实现突出当前页面的指示标签，提高了指示器的显著性和易用性。

Description

一种页面切换的方法及***
技术领域
本发明涉及页面展示领域，尤其涉及一种页面切换的方法及***。
背景技术
目前Android众多app中，ViewPager控件的使用无处不在，然而其页面指示器(TabPageIndicator)却比较单调。比较常见的是开源的第三方控件ViewPagerIndicator和2015年Google大会上发布的Android Support Design库中的TabLayout控件。因为可以达到ViewPagerIndicator的效果，并且是官方发布的，能够兼容2.2及以上版本，TabLayout的使用与日俱增。然而这两个控件形式单一，仅仅可以使用一条线(或者说矩形)通过不同的颜色来达到指示的目的，其指示效果不明显。
发明内容
本发明所要解决的技术问题是：提供一种页面切换的方法及***，提高页面指示器的显著性。
为了解决上述技术问题，本发明采用的技术方案为：
本发明提供一种页面切换的方法，包括：
S1、获取当前页面指示标签的中心点的横坐标值，得到第一横坐标值；
S2、获取目标页面指示标签的中心点的横坐标值，得到第二横坐标值；
S3、绘制凸形图最高点对应的横坐标值从所述第一横坐标值变换到所述第二横坐标值的过程中与页面的实时滑动距离对应的凸形图。
本发明还提供一种页面切换的***，包括：
第一获取模块，用于获取当前页面指示标签的中心点的横坐标值，得到第一横坐标值；
第二获取模块，用于获取目标页面指示标签的中心点的横坐标值，得到第二横坐标值；
绘制模块，用于绘制凸形图最高点对应的横坐标值从所述第一横坐标值变换到所述第二横坐标值的过程中与页面的实时滑动距离对应的凸形图。
本发明的有益效果在于：通过实时绘制凸形图，所述凸形图的突起部分指向当前页面对应的指示标签，突出当前页面的指示标签，满足用户的个性化需求，提高了指示器的显著性和易用性。
附图说明
图1为本发明一种页面切换的方法的具体实施方式的流程框图；
图2为本发明一种页面切换的***的具体实施方式的结构框图；
图3为锯齿形指示器的效果图；
图4为波形指示器的效果图；
标号说明：
1、第一获取模块；2、第二获取模块；3、绘制模块。
具体实施方式
为详细说明本发明的技术内容、所实现目的及效果，以下结合实施方式并配合附图予以说明。
本发明最关键的构思在于：通过实时绘制凸形图，突出当前页面的指示标签，提高了指示器的显著性和易用性。
请参照图1至图4，
如图1所示，本发明提供一种页面切换的方法，包括：
S1、获取当前页面指示标签的中心点的横坐标值，得到第一横坐标值；
S2、获取目标页面指示标签的中心点的横坐标值，得到第二横坐标值；
S3、绘制凸形图最高点对应的横坐标值从所述第一横坐标值变换到所述第二横坐标值的过程中与页面的实时滑动距离对应的凸形图。
进一步地，所述S3具体为：
S31、设置凸形图的宽度值和凸形图的最大高度值；
S32、根据所述凸形图的宽度值、所述凸形图的最大高度值、所述滑动距离和所述第二横坐标值计算得到凸形图的纵坐标值集合，具体为：
根据计算得到凸形图的纵坐标值集合；其中，mGussionHeightOffset为所述滑动距离，Hmax为所述凸形图的最大高度值，μ为所述第二横坐标值，w为所述凸形图的宽度值，x为从所述第一横坐标值至所述第二横坐标值的区间内的横坐标值；
S33、根据所述纵坐标值集合绘制凸形图。
由上述描述可知，本发明提供的计算凸形图的纵坐标值集合的计算公式中需实时获取的参数只有当前计算的凸形图的纵坐标值对应的横坐标值，计算过程简单，可有效防止页面滑动过程中凸形图显示的卡顿现象。
进一步地，还包括：
设置获取凸形图的纵坐标值的个数。
由上述描述可知，设置获取纵坐标值的个数不同，绘制出的凸形图不同。
进一步地，所述S2具体为：
获取页面的滑动方向；
根据所述滑动方向和当前页面指示标签，得到目标页面指示标签；
计算所述目标页面指示标签的中心点的横坐标值，得到第二横坐标值。
由上述描述可知，根据页面的滑动方向获取目标页面的指示标签，使得所述页面切换的方法同时支持向左滑动屏幕将显示页面切换至当前页面的左侧页面，向右滑动屏幕将显示页面切换至当前页面的右侧页面。
进一步地，还包括：
设置凸形图的颜色为页面指示器的颜色的反色。
由上述描述可知，凸形图的颜色为页面指示器的颜色的反色可进一步突出指向当前页面的指示标签。
如图2所示，本发明还提供一种页面切换的***，包括：
第一获取模块1，用于获取当前页面指示标签的中心点的横坐标值，得到第一横坐标值；
第二获取模块2，用于获取目标页面指示标签的中心点的横坐标值，得到第二横坐标值；
绘制模块3，用于绘制凸形图最高点对应的横坐标值从所述第一横坐标值变换到所述第二横坐标值的过程中与页面的实时滑动距离对应的凸形图。
进一步地，所述绘制模块包括：
设置单元，用于设置凸形图的宽度值和凸形图的最大高度值；
第一计算单元，用于根据所述凸形图的宽度值、所述凸形图的最大高度值、所述滑动距离和所述第二横坐标值计算得到凸形图的纵坐标值集合，具体为：
根据计算得到凸形图的纵坐标值集合；其中，mGussionHeightOffset为所述滑动距离，Hmax为所述凸形图的最大高度值，μ为所述第二横坐标值，w为所述凸形图的宽度值，x为从所述第一横坐标值至所述第二横坐标值的区间内的横坐标值；
绘制单元，用于根据所述纵坐标值集合绘制凸形图。
进一步地，还包括：
第一设置模块，用于设置获取凸形图的纵坐标值的个数。
进一步地，所述第二获取模块包括：
第一获取单元，用于获取页面的滑动方向；
第二获取单元，用于根据所述滑动方向和当前页面指示标签，得到目标页面指示标签；
第二计算单元，用于计算所述目标页面指示标签的中心点的横坐标值，得到第二横坐标值。
进一步地，还包括：
第二设置模块，用于设置凸形图的颜色为页面指示器的颜色的反色。
由上述描述可知，通过所述页面切换的***，可实现突出当前页面的指示标签的功能，提高了指示器的显著性和易用性。
本发明的实施例为：
Android Support Design库中的TabLayout控件是官方发布的，使用简单，具有指示器的作用，但是该控件的样式单一，只能通过矩形来制作指示器，其指示效果不明显。以TabLayout为基础制作带有凸形图的指示器的方法步骤如下所述：
S1、获取当前页面指示标签的中心点的横坐标值，得到第一横坐标值；
其中，分别获取页面指示标签的左边界和右边界在指示器中的坐标值mIndicatorLeft和mIndicatorRight，根据(mIndicatorRight+mIndicatorLeft)/2计算得到页面指示标签的中心点的横坐标。
S2、获取页面的滑动方向；根据所述滑动方向和当前页面指示标签，得到目标页面指示标签；计算所述目标页面指示标签的中心点的横坐标值，得到第二横坐标值；
S3、绘制凸形图最高点对应的横坐标值从所述第一横坐标值变换到所述第二横坐标值的过程中与页面的实时滑动距离对应的凸形图，具体为：
S31、设置凸形图的宽度值和凸形图的最大高度值；
其中，从Android design support库里面提取出TabLayout类的实现，将类名修改为RippleTabLayout，并在其中增加设置凸形图的宽度以及凸形图的最大高度值的接口。
提取RippleTabLayout类中TabStrip类的实现，修改其类名为SlidingTabStrip，增加一个用于记录凸形图横坐标变化的偏移量mGussionHeightOffset，初始化为0，其取值范围为[0,1]。
重写RippleTabLayout中其他所有design support库中相关的类。使用自己定义的同样功能的类代替之，这样我们不需要导入design support库，就能够直接使用RippleTabLayout达到显示凸形图的特效。
S32、设置获取凸形图的纵坐标值的个数；
S33、根据所述凸形图的宽度值、所述凸形图的最大高度值、所述滑动距离和所述第二横坐标值计算得到凸形图的纵坐标值集合，具体为：
根据计算得到凸形图的纵坐标值集合；其中，mGussionHeightOffset为所述滑动距离，Hmax为所述凸形图的最大高度值，μ为所述第二横坐标值，w为所述凸形图的宽度值，x为从所述第一横坐标值至所述第二横坐标值的区间内的横坐标值；
S34、根据所述纵坐标值集合绘制凸形图；
其中，创建Path对象，Path对象获取特定个数的凸形图的点对应的横坐标值和纵坐标值，调用画布函数，绘制Path对象中的每一个点。其中，Path对象中凸形图的点的个数与步骤S32中设置获取凸形图的纵坐标值的个数相同。Path对象中点的个数不同，其绘制出的凸形图不同，本发明所述的凸形图为对称凸形。如，Path对象中点的个数为3个时，包括凸形图的最高点的坐标和两个最低点的坐标，绘制出的凸形图为锯齿形，效果图如图3所示。Path对象中点的个数为20个时，绘制出的凸形图为波形，效果图如图4所示。
S4、设置凸形图的颜色为页面指示器的颜色的反色。
例如，设置页面指示器的颜色为浅蓝色，则将凸形图设置为浅蓝色的反色深红色，从而突出凸形图，进一步提高指示器指示当前页面标签的显著性。
综上所述，本发明提供的一种页面切换的方法，通过实时绘制凸形图，所述凸形图的突起部分指向当前页面对应的指示标签，突出当前页面的指示标签，满足用户的个性化需求，提高了指示器的显著性和易用性。进一步地，可有效防止页面滑动过程中凸形图显示的卡顿现象。进一步地，设置获取纵坐标值的个数不同，绘制出的凸形图不同。进一步地，根据页面的滑动方向获取目标页面的指示标签，使得所述页面切换的方法同时支持向左滑动屏幕将显示页面切换至当前页面的左侧页面，向右滑动屏幕将显示页面切换至当前页面的右侧页面。进一步地，凸形图的颜色为页面指示器的颜色的反色可进一步突出指向当前页面的指示标签。本发明还提供一种页面切换的***，可实现突出当前页面的指示标签的功能，提高了指示器的显著性和易用性。
以上所述仅为本发明的实施例，并非因此限制本发明的专利范围，凡是利用本发明说明书及附图内容所作的等同变换，或直接或间接运用在相关的技术领域，均同理包括在本发明的专利保护范围内。

Claims (10)

1.一种页面切换的方法，其特征在于，包括：
S1、获取当前页面指示标签的中心点的横坐标值，得到第一横坐标值；
S2、获取目标页面指示标签的中心点的横坐标值，得到第二横坐标值；
S3、绘制最高点对应的横坐标值从所述第一横坐标值变换到所述第二横坐标值的过程中与页面的实时滑动距离对应的凸形图。
2.根据权利要求1所述的页面切换的方法，其特征在于，所述S3具体为：
S31、设置凸形图的宽度值和凸形图的最大高度值；
S32、根据所述凸形图的宽度值、所述凸形图的最大高度值、所述滑动距离和所述第二横坐标值计算得到凸形图的纵坐标值集合，具体为：
根据计算得到凸形图的纵坐标值集合；其中，mGussionHeightOffset为所述滑动距离，Hmax为所述凸形图的最大高度值，μ为所述第二横坐标值，w为所述凸形图的宽度值，x为从所述第一横坐标值至所述第二横坐标值的区间内的横坐标值；
S33、根据所述纵坐标值集合绘制凸形图。
3.根据权利要求2所述的页面切换的方法，其特征在于，还包括：
设置获取凸形图的纵坐标值的个数。
4.根据权利要求1所述的页面切换的方法，其特征在于，所述S2具体为：
获取页面的滑动方向；
根据所述滑动方向和当前页面指示标签，得到目标页面指示标签；
计算所述目标页面指示标签的中心点的横坐标值，得到第二横坐标值。
5.根据权利要求1所述的页面切换的方法，其特征在于，还包括：
设置凸形图的颜色为页面指示器的颜色的反色。
6.一种页面切换的***，其特征在于，包括：
第一获取模块，用于获取当前页面指示标签的中心点的横坐标值，得到第一横坐标值；
第二获取模块，用于获取目标页面指示标签的中心点的横坐标值，得到第二横坐标值；
绘制模块，用于绘制最高点对应的横坐标值从所述第一横坐标值变换到所述第二横坐标值的过程中与页面的实时滑动距离对应的凸形图。
7.根据权利要求6所述的页面切换的***，其特征在于，所述绘制模块包括：
设置单元，用于设置凸形图的宽度值和凸形图的最大高度值；
第一计算单元，用于根据所述凸形图的宽度值、所述凸形图的最大高度值、所述滑动距离和所述第二横坐标值计算得到凸形图的纵坐标值集合，具体为：
根据计算得到凸形图的纵坐标值集合；其中，mGussionHeightOffset为所述滑动距离，Hmax为所述凸形图的最大高度值，μ为所述第二横坐标值，w为所述凸形图的宽度值，x为从所述第一横坐标值至所述第二横坐标值的区间内的横坐标值；
绘制单元，用于根据所述纵坐标值集合绘制凸形图。
8.根据权利要求7所述的页面切换的***，其特征在于，还包括：
第一设置模块，用于设置获取凸形图的纵坐标值的个数。
9.根据权利要求6所述的页面切换的***，其特征在于，所述第二获取模块包括：
第一获取单元，用于获取页面的滑动方向；
第二获取单元，用于根据所述滑动方向和当前页面指示标签，得到目标页面指示标签；
第二计算单元，用于计算所述目标页面指示标签的中心点的横坐标值，得到第二横坐标值。
10.根据权利要求6所述的页面切换的***，其特征在于，还包括：
第二设置模块，用于设置凸形图的颜色为页面指示器的颜色的反色。
CN201611107989.1A 2016-12-06 2016-12-06 一种页面切换的方法及*** Active CN106775227B (zh)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN201611107989.1A CN106775227B (zh) 2016-12-06 2016-12-06 一种页面切换的方法及***

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN201611107989.1A CN106775227B (zh) 2016-12-06 2016-12-06 一种页面切换的方法及***

Publications (2)

Publication Number Publication Date
CN106775227A CN106775227A (zh) 2017-05-31
CN106775227B true CN106775227B (zh) 2019-08-06

Family

ID=58874354

Family Applications (1)

Application Number Title Priority Date Filing Date
CN201611107989.1A Active CN106775227B (zh) 2016-12-06 2016-12-06 一种页面切换的方法及***

Country Status (1)

Country Link
CN (1) CN106775227B (zh)

Families Citing this family (2)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN109254823B (zh) * 2018-09-21 2022-02-22 武汉华中时讯科技有限责任公司 一种切换多级嵌套的分页视图元素的方法、存储器及终端
CN109739593B (zh) * 2018-11-21 2022-06-10 惠州Tcl移动通信有限公司 多网页切换浏览方法、移动终端及计算机可读存储介质

Citations (7)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN103500057A (zh) * 2013-10-08 2014-01-08 百度在线网络技术（北京）有限公司 移动终端及其操控方法和装置
JP2015005045A (ja) * 2013-06-19 2015-01-08 コニカミノルタ株式会社 電子表示端末、電子表示端末用プログラム、電子表示端末用プログラムが記録された記録媒体、および表示方法
CN104932790A (zh) * 2015-06-26 2015-09-23 联想(北京)有限公司 一种信息处理方法及电子设备
CN105068734A (zh) * 2015-08-20 2015-11-18 广东欧珀移动通信有限公司 一种终端的滑动控制方法及装置
EP2953018A1 (en) * 2010-03-02 2015-12-09 Sony Mobile Communications AB Mobile terminal and input device
CN105426538A (zh) * 2015-12-21 2016-03-23 北京奇虎科技有限公司 页面切换方法及装置
CN105589650A (zh) * 2014-11-14 2016-05-18 阿里巴巴集团控股有限公司 一种页面导航方法和装置

Patent Citations (7)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
EP2953018A1 (en) * 2010-03-02 2015-12-09 Sony Mobile Communications AB Mobile terminal and input device
JP2015005045A (ja) * 2013-06-19 2015-01-08 コニカミノルタ株式会社 電子表示端末、電子表示端末用プログラム、電子表示端末用プログラムが記録された記録媒体、および表示方法
CN103500057A (zh) * 2013-10-08 2014-01-08 百度在线网络技术（北京）有限公司 移动终端及其操控方法和装置
CN105589650A (zh) * 2014-11-14 2016-05-18 阿里巴巴集团控股有限公司 一种页面导航方法和装置
CN104932790A (zh) * 2015-06-26 2015-09-23 联想(北京)有限公司 一种信息处理方法及电子设备
CN105068734A (zh) * 2015-08-20 2015-11-18 广东欧珀移动通信有限公司 一种终端的滑动控制方法及装置
CN105426538A (zh) * 2015-12-21 2016-03-23 北京奇虎科技有限公司 页面切换方法及装置

Also Published As

Publication number Publication date
CN106775227A (zh) 2017-05-31

Similar Documents

Publication Publication Date Title
KR102107887B1 (ko) 합성 화상을 생성하는 방법 및 장치
US10599914B2 (en) Method and apparatus for human face image processing
WO2015188749A1 (en) 3d model rendering method and apparatus and terminal device
CN106775227B (zh) 一种页面切换的方法及***
EP3144899A1 (en) Apparatus and method for adjusting brightness of image
CN103777852A (zh) 一种获取图像的方法、装置
CN105869579B (zh) 背光亮度调整方法、装置及显示终端
CN106201172B (zh) 一种触屏终端的画布显示方法及装置
CN111414114A (zh) 一种显示调整方法、装置、电子设备及存储介质
CN105929954B (zh) 一种控制光标的方法及装置、显示设备
CN110246204B (zh) 波形绘制方法、装置、计算机设备及可读存储介质
CN110049306A (zh) 一种立体显示装置以及使用方法
CN105988566A (zh) 一种信息处理方法及电子设备
Ahn et al. Real-time adjustment of contrast saliency for improved information visibility in mobile augmented reality
CN110335194A (zh) 一种人脸变老图像处理方法
CN107133347B (zh) 可视化分析图表的展示方法及装置、可读存储介质、终端
JP2020014075A (ja) 画像投影システム、画像投影方法、及びプログラム
CN109934058A (zh) 人脸图像处理方法、装置、电子设备、存储介质及程序
CN110286759A (zh) 基于视线跟踪的终端自适应放大显示方法、***及终端
CN107608670A (zh) 一种报表ui元素自适应展示的方法及***
CN105183492A (zh) 个性化对话框的形成方法及形成装置
CN108597439B (zh) 基于微间距led显示屏的虚拟现实图像显示方法及终端
CN208433199U (zh) 一种传感触发与大屏互动的装置
CN107479821B (zh) 一种界面绘制方法及装置
CN107154072A (zh) 无人机监控设备的图像处理方法及装置

Legal Events

Date Code Title Description
PB01 Publication
PB01 Publication
SE01 Entry into force of request for substantive examination
SE01 Entry into force of request for substantive examination
GR01 Patent grant
GR01 Patent grant