界面标签的展现方法和装置与流程

文档序号:16265411发布日期:2018-12-14 21:53阅读:209来源:国知局

本发明涉及界面交互技术领域,尤其涉及一种界面标签的展现方法和装置。



背景技术:

浏览器是用户访问互联网的最常用入口。为了方便用户同时打开多个窗口浏览网页,目前现有的浏览器大多提供了多页面标签页的浏览方式。在用户浏览器中同时打开多个页面标签时,由于浏览器窗口宽度的限制,随着被打开的页面标签的不断增加,每个页面标签标题的长度自动缩小,其可视区域也逐渐变小,变得越来也越难以辨认,使标签管理变得极不方便,操作效率低。



技术实现要素:

本发明旨在至少在一定程度上解决相关技术中的技术问题之一。

为此,本发明的一个目的在于提出一种界面标签的展现方法,该方法可以方便界面标签的管理,提高操作效率。

本发明的另一个目的在于提出一种界面标签的展现装置。

本发明的另一个目的在于提出一种用户设备。

本发明的另一个目的在于提出一种电子设备。

为达到上述目的,本发明实施例提出的界面标签的展现方法,包括:打开多个界面标签;当所述多个界面标签的数量大于预设数值时,对所述多个界面标签进行层叠处理;展现层叠处理后的多个界面标签。

本发明实施例提出的界面标签的展现方法,通过在多个界面标签的数量大于预设数值时,对多个界面标签进行层叠处理,能够方便界面标签的管理,提高操作效率。

为达到上述目的,本发明实施例提出的界面标签的展现装置,包括:打开模块,用于打开多个界面标签;层叠模块,用于在多个界面标签的数量大于预设数值时,对所述多个界面标签进行层叠处理;展现模块,用于展现层叠处理后的多个界面标签。

本发明实施例提出的界面标签的展现装置,通过在多个界面标签的数量大于预设数值时,对多个界面标签进行层叠处理,能够方便界面标签的管理,提高操作效率。

为达到上述目的,本发明实施例提出的用户设备,包括:显示器;处理器;存储器,用于存储浏览器,所述浏览器被所述处理器执行时,打开多个页面标签;当所述多个页面标签的数量大于预设数值时,对所述多个页面标签进行层叠处理;展现层叠处理后的多个页面标签。

本发明实施例提出的用户设备,通过在多个页面标签的数量大于预设数值时,对多个页面标签进行层叠处理,能够方便页面标签的管理,提高操作效率。

为达到上述目的,本发明实施例提出的电子设备,包括:显示器;处理器;存储器,用于存储浏览器,所述浏览器被所述处理器执行时,在所述显示器的至少一部分显示区域显示浏览器窗口,所述浏览器窗口包括标签导航区和页面显示区,所述页面显示区显示与所述标签导航区中的至少一个当前标签对应的页面,所述标签导航区被配置成展现的多个标签数量小于第一预设标签数量时,以第一模式展现所述多个标签;并在展现的多个标签数量大于所述第一预设标签数量时,以与所述第一模式不同的第二模式展现所述多个标签。

本发明实施例提出的电子设备,通过在所述多个界面标签的数量大于预设数值时,对多个界面标签进行层叠处理,能够方便界面标签的管理,提高操作效率。

本发明附加的方面和优点将在下面的描述中部分给出,部分将从下面的描述中变得明显,或通过本发明的实践了解到。

附图说明

本发明上述的和/或附加的方面和优点从下面结合附图对实施例的描述中将变得明显和容易理解,其中:

图1是本发明实施例提出的界面标签的展现方法的流程示意图;

图2是在浏览器中打开多个页面标签的示意图;

图3是在多个界面标签的数量大于预设数值时,对所述多个界面标签进行层叠处理的示意图;

图4是根据本发明另一实施例提出的界面标签的展现方法的流程示意图;

图5是根据本发明另一实施例的将选择的标签恢复到层叠前的状态的示意图;

图6是本发明另一实施例的界面标签的展现装置的结构示意图;

图7是本发明另一实施例的界面标签的展现装置的结构示意图。

具体实施方式

下面详细描述本发明的实施例,所述实施例的示例在附图中示出,其中自始至终相同或类似的标号表示相同或类似的元件或具有相同或类似功能的元件。下面通过参考附图描述的实施例是示例性的,仅用于解释本发明,而不能理解为对本发明的限制。相反,本发明的实施例包括落入所附加权利要求书的精神和内涵范围内的所有变化、修改和等同物。

下面参考附图描述根据本发明实施例的界面标签的展现方法和装置。

图1是本发明一实施例提出的界面标签的展现方法的流程示意图,该方法包括:

S101:打开多个界面标签。

其中,界面标签包括但不限于:浏览器中打开的页面的标签,即时通信软件中的聊天窗口标签,桌面或者网盘中的文件或文件夹标签等。

例如,如图2所示,可以在浏览器中打开多个页面标签。

S102:当多个界面标签的数量大于预设数值时,对所述多个界面标签进行层叠处理。

具体地,以浏览器中的页面为例,浏览器的显示宽度有限,当浏览器中打开的页面标签达到预设数量时,例如5个或者6个,浏览器的标签导航区基本已经无法容纳该数量的完整的页面标签,此时,可对应多个页面标签的当前处理的一个非最左侧的标签,如图3中所示的分类3标签,采用预设的函数,将当前处理的一个标签层叠到当前处理的标签的相邻的左侧标签上。

优选地,本实施例可以通过CSS(Cascading Style Sheets,层叠样式表)来实现。所述预设的函数可以是margin-left函数。例如用margin-left:-16px实现界面标签层叠16个像素。具体的叠加像素数可以根据显示框的总剩余宽度界面标签的个数来确定。

S103:展现层叠处理后的多个界面标签。

具体地,可展现如图3所示的层叠后的多个界面标签。可根据界面标签栏的宽度进行不同程度的层叠,标签越多,标签的层叠程度越高,除当前页面的标签之外的每个标签的显示面积越小。

本实施例通过在多个界面标签的数量大于预设数值时,对多个界面标签进行层叠处理,能够方便界面标签的管理,提高操作效率。

图4是根据本发明另一实施例提出的界面标签的展现方法的流程示意图,该方法包括:

S201:打开多个界面标签。

其中,界面标签包括但不限于:浏览器中打开的页面的标签,即时通信软件中的聊天窗口标签,桌面或者网盘中的文件或文件夹标签等。

例如,如图2所示,可以在浏览器中打开多个页面标签。

S202:当多个界面标签的数量大于预设数值时,对所述多个界面标签进行层叠处理。

具体地,可对应多个界面标签的当前处理的一个非最左侧的标签,如图3中所示的分类3标签,采用预设的函数,将当前处理的一个标签层叠到当前处理的标签的相邻的左侧标签上。

优选地,本方法可以通过CSS(Cascading Style Sheets,层叠样式表)来实现。所述预设的函数可以是margin-left函数。例如用margin-left:-16px实现界面标签层叠16个像素。具体的叠加像素数可以根据显示框的总剩余宽度界面标签的个数来确定。

S203:展现层叠处理后的多个界面标签。

例如图3所示,可根据界面标签栏的宽度进行不同程度的层叠,标签越多,标签的层叠程度越高,除当前页面的界面标签之外的每个界面标签的显示面积越小。

S204:接收对所述多个界面标签中一个标签的选择指令。

在本申请的一个具体实施例中,当一个界面标签被鼠标指针选定或鼠标指针移动到该标签上时,确认接收对该界面标签的选择指令。

S205:将所述选择的标签恢复到层叠前的状态,对所述选择的标签之外的第一部分标签再次进行层叠处理,以及,对所述选择的标签之外的第二部分标签保持不变。

其中,第一部分是所述选择的标签的右侧的标签,第二部分标签是所述选择的标签的左侧的标签。如图5所示,可以在鼠标移动到一个界面标签上时保持该界面标签左侧的标签大小不变,将该标签右侧的标签向右挤压,使该部分界面标签的层叠程度更高。

具体地,可采用margin-right函数实现,将所述选择的标签恢复到层叠前的状态。

S206:展现恢复到层叠前的状态的所述选择的标签,再次进行层叠处理的标签,以及保持不变的标签。

如图5所示,当前页面即分类3的标签为完全展示的,选择的页面即分类4的标签也是完全展示的。在所述选择的标签的显示宽度增大的同时,其右侧被挤压的标签的显示面积会相应的减小,而当光标移开当前选择的标签时,该标签会恢复到层叠处理后的状态,其右侧标签也恢复到再次层叠前的状态。

具体过程可以通过margin-right和margin-left函数进行实现,在此不在赘述。

类似的,本方法还可以用javascript语言实现。

本实施例通过在多个界面标签的数量大于预设数值时,对多个界面标签进行层叠处理,能够方便界面标签的管理,提高操作效率;另外,在界面标签被选择时将其恢复到层叠前的状态,并向右挤压其右侧的界面标签,能够随时查看非当前页面的界面标签,更加易于浏览和管理。

为了实现上述实施例,本发明还提出一种界面标签的展现装置。

图6是本发明另一实施例的界面标签的展现装置的结构示意图。如图6所示,该界面标签的展现装置包括:打开模块100、层叠模块200和展现模块300。

具体地,打开模块100用于打开多个界面标签。其中,界面标签包括但不限于:浏览器中打开的页面的标签,即时通信软件中的聊天窗口标签,桌面或者网盘中的文件或文件夹标签等。例如,如图2所示,打开模块100可以在浏览器中打开多个页面标签,也可以在其他程序中打开多个界面标签。

层叠模块200用于在多个界面标签的数量大于预设数值时,对所述多个界面标签进行层叠处理。更具体地,以浏览器中的页面为例,浏览器的显示宽度有限,当浏览器中打开的页面标签达到预设数量时,例如5个或者6个,浏览器的标签导航区基本已经无法容纳该数量的完整的页面标签,此时,层叠模块200可对应多个页面标签的当前处理的一个非最左侧的标签,如图3中所示的分类3标签,采用预设的函数,将当前处理的一个标签层叠到当前处理的标签的相邻的左侧标签上。

优选地,本实施例可以通过CSS(Cascading Style Sheets,层叠样式表)来实现。所述预设的函数可以是margin-left函数。例如用margin-left:-16px实现界面标签层叠16个像素。具体的叠加像素数可以根据显示框的总剩余宽度界面标签的个数来确定。

展现模块300用于展现层叠处理后的多个界面标签。展现模块300可展现如图3所示的层叠后的多个界面标签。

本实施例通过在多个界面标签的数量大于预设数值时,对多个界面标签进行层叠处理,能够方便界面标签的管理,提高操作效率。

图7是本发明另一实施例的界面标签的展现装置的结构示意图。如图7所示,该界面标签的展现装置包括:打开模块100、层叠模块200、展现模块300、接收模块400和恢复模块500。

具体地,接收模块400用于接收对所述多个界面标签中一个标签的选择指令。在本申请的一个具体实施例中,当一个界面标签被鼠标指针选定或鼠标指针移动到该标签上时,确认接收对该界面标签的选择指令。

恢复模块500用于将所述选择的标签恢复到层叠前的状态,对所述选择的标签之外的第一部分标签再次进行层叠处理,以及,对所述选择的标签之外的第二部分标签保持不变。其中,第一部分是所述选择的标签的右侧的标签,第二部分标签是所述选择的标签的左侧的标签。如图5所示,可以在鼠标移动到一个界面标签上时保持该界面标签左侧的标签大小不变,将该标签右侧的标签向右挤压,使该部分标签的层叠程度更高。更具体地,恢复模块500可采用margin-right函数实现,将所述选择的标签恢复到层叠前的状态。

所述展现模块300还用于展现恢复到层叠前的状态的所述选择的标签,再次进行层叠处理的标签,以及保持不变的标签。

层叠模块200还用于对应所述多个界面标签的当前处理的一个非最左侧的标签,采用预设的函数,将所述当前处理的一个标签层叠到所述当前处理的标签的相邻的左侧标签上。

恢复模块500还用于采用margin-right函数,将所述选择的标签恢复到层叠前的状态。如图5所示,当前页面即分类3的标签为完全展示的,选择的页面即分类4的标签也是完全展示的。在所述选择的标签的显示宽度增大的同时,其右侧被挤压的标签的显示面积会相应的减小,而当光标移开当前选择的标签时,该标签会恢复到层叠处理后的状态,其右侧标签也恢复到再次层叠前的状态。

具体过程可以通过margin-right和margin-left函数进行实现,在此不在赘述。

类似的,本方法还可以用javascript语言实现。

本实施例通过在多个界面标签的数量大于预设数值时,对多个界面标签进行层叠处理,能够方便界面标签的管理,提高操作效率;另外,在界面标签被选择时将其恢复到层叠前的状态,并向右挤压其右侧的界面标签,能够随时查看非当前页面的界面标签,更加易于浏览和管理。

为了实现上述实施例,本发明还提出一种用户设备。该用户设备包括:显示器;处理器;存储器,用于存储浏览器,所述浏览器被所述处理器执行时,打开多个页面标签;当多个页面标签的数量大于预设数值时,对所述多个页面标签进行层叠处理;展现层叠处理后的多个页面标签。

本实施例的用户设备能够方便页面标签的管理,提高操作效率。

为了实现上述实施例,本发明还提出一种电子设备。该电子设备包括:显示器;处理器;存储器,用于存储浏览器,所述浏览器被所述处理器执行时,在所述显示器的至少一部分显示区域显示浏览器窗口,所述浏览器窗口包括标签导航区和页面显示区,所述页面显示区显示与所述标签导航区中的至少一个当前标签对应的页面,所述标签导航区被配置成展现的多个标签数量小于第一预设标签数量时,以第一模式展现所述多个标签;并在展现的多个标签数量大于所述第一预设标签数量时,以与所述第一模式不同的第二模式展现所述多个标签。

可选的,在所述第一模式下,所述多个标签均匀占据所述标签导航区的宽度。

可选的,在所述第二模式下,所述多个标签中的当前标签与其他标签具有不同的展示宽度,例如当前标签或鼠标停留的标签的展示宽度为完整标签的宽度,其他标签为层叠后的宽度。并且,在所述多个标签的数量发生变化时,所述当前标签维持固定的宽度值,例如即时通信软件中的对话窗口中弹出一个新的对话标签,在离开当前所在的对话页面前,当前标签的宽度保持不变。

本发明实施例提出的电子设备,通过在多个界面标签的数量大于预设数值时,对多个界面标签进行层叠处理,能够方便界面标签的管理,提高操作效率。

需要说明的是,在本发明的描述中,术语“第一”、“第二”等仅用于描述目的,而不能理解为指示或暗示相对重要性。此外,在本发明的描述中,除非另有说明,“多个”的含义是两个或两个以上。

流程图中或在此以其他方式描述的任何过程或方法描述可以被理解为,表示包括一个或更多个用于实现特定逻辑功能或过程的步骤的可执行指令的代码的模块、片段或部分,并且本发明的优选实施方式的范围包括另外的实现,其中可以不按所示出或讨论的顺序,包括根据所涉及的功能按基本同时的方式或按相反的顺序,来执行功能,这应被本发明的实施例所属技术领域的技术人员所理解。

应当理解,本发明的各部分可以用硬件、软件、固件或它们的组合来实现。在上述实施方式中,多个步骤或方法可以用存储在存储器中且由合适的指令执行系统执行的软件或固件来实现。例如,如果用硬件来实现,和在另一实施方式中一样,可用本领域公知的下列技术中的任一项或他们的组合来实现:具有用于对数据信号实现逻辑功能的逻辑门电路的离散逻辑电路,具有合适的组合逻辑门电路的专用集成电路,可编程门阵列(PGA),现场可编程门阵列(FPGA)等。

本技术领域的普通技术人员可以理解实现上述实施例方法携带的全部或部分步骤是可以通过程序来指令相关的硬件完成,所述的程序可以存储于一种计算机可读存储介质中,该程序在执行时,包括方法实施例的步骤之一或其组合。

此外,在本发明各个实施例中的各功能单元可以集成在一个处理模块中,也可以是各个单元单独物理存在,也可以两个或两个以上单元集成在一个模块中。上述集成的模块既可以采用硬件的形式实现,也可以采用软件功能模块的形式实现。所述集成的模块如果以软件功能模块的形式实现并作为独立的产品销售或使用时,也可以存储在一个计算机可读取存储介质中。

上述提到的存储介质可以是只读存储器,磁盘或光盘等。

在本说明书的描述中,参考术语“一个实施例”、“一些实施例”、“示例”、“具体示例”、或“一些示例”等的描述意指结合该实施例或示例描述的具体特征、结构、材料或者特点包含于本发明的至少一个实施例或示例中。在本说明书中,对上述术语的示意性表述不一定指的是相同的实施例或示例。而且,描述的具体特征、结构、材料或者特点可以在任何的一个或多个实施例或示例中以合适的方式结合。

尽管上面已经示出和描述了本发明的实施例,可以理解的是,上述实施例是示例性的,不能理解为对本发明的限制,本领域的普通技术人员在本发明的范围内可以对上述实施例进行变化、修改、替换和变型。

当前第1页1 2 3 
网友询问留言 已有0条留言
  • 还没有人留言评论。精彩留言会获得点赞!
1