CN113253881B9 - 控件显示方法及终端设备 - Google Patents

Abstract

本发明实施例提供接收用户输入的第四焦点移动指令，其中，所述第五控件被配置为：当焦点位于所述第五控件时，在所述第五控件中第五图标的一侧显示所述第五控件对应的文本信息；所述第六控件被配置为：当焦点位于所述第五控件时，所述第六控件显示对应的第六图标不显示所述第六控件对应的文本信息；响应与所述第四焦点移动指令，使焦点位于所述第六控件，将所述第六控件对应的文本信息设置为显示状态，并在所述第六控件中第六图标的一侧显示所述第六控件对应的文本信息并将所述第五控件对应的文本信息设置为隐藏状态，且取消显示所述第二预设渲染色，使得所述第五控件显示对应的第五图标不显示所述第五控件对应的文本信息，提高了用户体验。

Description

控件显示方法及终端设备

本申请为2018年6月1日递交到中国专利局的，申请号为 201810558180.3，专利名称为“控件显示方法及装置”的中国专利申请的分案申请。

技术领域

本发明实施例涉及计算机技术领域，尤其涉及一种控件显示方法及终端设备。

背景技术

在终端设备（电视、电脑等设备）显示的用户界面中通常包括导航栏。导航栏通常包括多个控件，每个控件通常显示不同的文本信息。焦点可以位于导航栏的任意一个控件上，且焦点可以在导航栏中相邻的控件上移动。

在现有技术中，通常通过控件中文本的字号和颜色来突出显示焦点所在的控件。具体的，当焦点位于导航栏的第一控件时，第一控件中文本的字号较大，且第一控件中的文本的颜色与其它控件中的文本颜色不同。当焦点从导航栏中的第一控件移动至相邻的第二个控件时，将第一控件中文本的字号恢复为默认字号，字体颜色恢复为默认颜色，同时，增大第二控件中文本的字号，并改变第二控件中文本的颜色。

发明内容

本发明实施例提供一种控件显示方法及终端设备，提高了焦点移动的连续性，进而提高用户体验。

第一方面，本发明实施例提供了一种控件显示方法，其特征在于，包括：

接收用户输入的第四焦点移动指令，其中，所述第四焦点移动指令用于指示将所述焦点从图标栏中的第五控件移动至图标栏中的第六控件，所述第五控件被配置为：当焦点位于所述第五控件时，所述第五控件的渲染色为第二预设渲染色，且在所述第五控件中第五图标的一侧显示所述第五控件对应的文本信息；所述第六控件被配置为：当焦点位于所述第五控件时，所述第六控件显示对应的第六图标不显示所述第六控件对应的文本信息；

响应与所述第四焦点移动指令，使焦点位于所述第六控件，将所述第六控件的渲染色设置为所述第二预设渲染色，将所述第六控件对应的文本信息设置为显示状态，并在所述第六控件中第六图标的一侧显示所述第六控件对应的文本信息并将所述第五控件对应的文本信息设置为隐藏状态，且取消显示所述第二预设渲染色，使得所述第五控件显示对应的第五图标不显示所述第五控件对应的文本信息。

第二方面，本发明实施例提供了一种控件显示方法，其特征在于，所述方法用于控制用户界面中的控件的显示，所述用户界面包括图标栏，所述图标栏至少包括第五控件和第六控件，所述方法包括：

在焦点位于图标栏的第五控件时，接收用户在图标栏输入的第四焦点移动指令，其中，所述第四焦点移动指令用于指示在图标栏的控件之间移动所述焦点，所述第五控件被配置为当焦点位于所述第五控件时，同时显示所述第五控件对应的第五图标和所述第五控件对应的第五文本信息；当焦点不位于所述第五控件时，仅显示所述第五图标不显示所述第五文本信息；

根据所述第五控件和所述第四焦点移动指令，在所述图标栏中确定需要将焦点移动至的第六控件；

将所述第五控件对应的文本信息设置为隐藏状态，使所述第五控件时显示所述第五图标不显示所述第五文本信息；将所述第六控件对应的第六文本信息设置为显示状态，使所述第六控件同时显示所述第六控件对应的第六图标和所述第六文本信息。

第三方面，本发明实施例提供了一种控件显示方法，其特征在于，所述方法用于控制用户界面中的控件的显示，所述用户界面包括图标栏和位于所述图标栏下的导航栏，所述导航栏至少包括相邻设置的第一控件和第二控件，所述图标栏至少包括相邻设置的第五控件和第六控件，所述方法包括：

接收水平移动焦点的指令；

在焦点位于所述第一控件时，响应与水平移动焦点的指令，取消与所述第一控件所占区域重叠设置的自定义控件，且在与所述第一控件所占区域重叠的位置显示自定义控件；

在焦点位于第五控件时，响应与水平移动焦点的指令，将所述第五控件对应的文本信息设置为隐藏状态，使所述第五控件时显示所述第五图标不显示所述第五文本信息；将所述第六控件对应的第六文本信息设置为显示状态，使所述第六控件同时显示所述第六控件对应的第六图标和所述第六文本信息。

第四方面，本发明实施例提供了一种终端设备，包括：处理器，所述处理器与存储器耦合；

所述存储器用于，存储计算机程序；

所述处理器用于，执行所述存储器中存储的计算机程序，以执行上述任一项所述的方法。

本发明实施例提供的控件显示方法及终端设备，接收用户输入的第四焦点移动指令，其中，所述第四焦点移动指令用于指示将所述焦点从图标栏中的第五控件移动至图标栏中的第六控件，所述第五控件被配置为：当焦点位于所述第五控件时，所述第五控件的渲染色为第二预设渲染色，且在所述第五控件中第五图标的一侧显示所述第五控件对应的文本信息；所述第六控件被配置为：当焦点位于所述第五控件时，所述第六控件显示对应的第六图标不显示所述第六控件对应的文本信息；响应与所述第四焦点移动指令，使焦点位于所述第六控件，将所述第六控件的渲染色设置为所述第二预设渲染色，将所述第六控件对应的文本信息设置为显示状态，并在所述第六控件中第六图标的一侧显示所述第六控件对应的文本信息并将所述第五控件对应的文本信息设置为隐藏状态，且取消显示所述第二预设渲染色，使得所述第五控件显示对应的第五图标不显示所述第五控件对应的文本信息，提高了用户体验。

附图说明

为了更清楚地说明本发明实施例或现有技术中的技术方案，下面将对实施例或现有技术描述中所需要使用的附图作一简单地介绍，显而易见地，下面描述中的附图是本发明的一些实施例，对于本领域普通技术人员来讲，在不付出创造性劳动性的前提下，还可以根据这些附图获得其他的附图。

图1为本发明实施例提供的控件显示方法的一种用户界面图；

图2为本发明实施例提供的控件显示方法的流程示意图一；

图3为本发明实施例提供的自定义控件移动过程示意图一；

图4为本发明实施例提供的自定义控件的移动流程图；

图5为本发明实施例提供的自定义控件移动过程示意图二；

图6为本发明实施例提供的控件显示方法的流程示意图二；

图7为本发明实施例提供的控件显示方法的流程示意图三；

图8为本发明实施例提供的焦点移动过程示意图一；

图9为本发明实施例提供的控件显示方式的流程示意图四；

图10为本发明实施例提供的焦点移动过程示意图二；

图11为本发明实施例提供的控件显示装置的结构示意图一；

图12为本发明实施例提供的控件显示装置的结构示意图二。

具体实施方式

为使本发明实施例的目的、技术方案和优点更加清楚，下面将结合本发明实施例中的附图，对本发明实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例是本发明一部分实施例，而不是全部的实施例。基于本发明中的实施例，本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例，都属于本发明保护的范围。

图1为本发明实施例提供的控件显示方法的一种用户界面图。请参见图1，包括搜索图标101、图标栏102、导航栏103-1、导航栏103-2和详情栏104。其中，用户可以通过搜索图标101搜索需要查看的内容。图标栏102中包括多个图标，每个图标对应一个独立的控件。导航栏103中包括多个文本，每一个文本对应一个独立的控件。详情栏104包括多个详细界面信息。

在本申请中，通过自定义控件突出显示导航栏中焦点所在的控件，自定义控件具有第一预设渲染色且内容为空。具体的，当焦点位于导航栏的一个控件时，自定义控件位于该控件所在位置，且定义控件所在图层位于该控件所在图层的下方，这样，不但不影响导航栏中焦点所在控件中的文字显示，还可以突出显示焦点所在的控件。当将焦点从导航栏的第一控件移动至第二控件时，将自定义控件连续的从第一控件所在位置移动至第二控件所在位置，以取消突出显示第一控件，并突出显示第二控件。在焦点从第一控件移动至第二控件的过程中，由自定义控件进行连续的移动，以突出显示焦点所在的控件，避免了第一控件和第二控件的外观发生突变，提高焦点移动的连续性，进而提高用户体验。

需要说明的是，图1只是以示例的形式示意一种用户界面图，并非对用户界面图的限定。当然，在实际应用过程中，本申请所示的技术方案还可以应用于其它用户界面图，本发明实施例对此不作具体限定。

下面，通过具体实施例对本申请所示的技术方案进行详细说明。需要说明的是，下面几个具体实施例可以相互结合，对于相同或相似的内容，在不同的实施例中不再重复说明。

图2为本发明实施例提供的控件显示方法的流程示意图一。请参见图2，该方法可以包括：

S201、在焦点位于导航栏中的第一控件时，接收用户输入的第一焦点移动指令，第一焦点移动指令用于指示在导航栏的控件中移动焦点。

其中，当焦点位于第一控件时，自定义控件所占区域覆盖第一控件所占区域，自定义控件所在图层位于第一控件所在图层的下方，自定义控件具有第一预设渲染色且内容为空。

本发明实施例的执行主体可以为终端设备，也可以为设置在终端设备中的控件显示装置。可选的，控件显示装置可以通过软件实现，也可以通过软件和硬件的结合实现。

可选的，导航栏中包括多个控件，每一个控件中可以显示文本信息，或者，每一个控件中可以显示文本信息和图标。

可选的，用户可以通过遥控设备输入第一焦点移动指令。

例如，当导航栏中的控件横向排列时（如图1中的导航栏103-1所示），用户可以对遥控设备中的“向左”、“向右”按键进行点击操作，以实现输入第一焦点移动指令。当用户对遥控设备中的“向左”按键进行点击操作时，第一焦点移动指令用于指示向左移动焦点。当用户对遥控设备中的“向右”按键进行点击操作时，第一焦点移动指令用于指示向右移动焦点。

例如，当导航栏中的控件横向排列时（如图1中的导航栏103-2所示），用户可以对遥控设备中的“向上”、“向下”按键进行点击操作，以实现输入第一焦点移动指令。当用户对遥控设备中的“向上”按键进行点击操作时，第一焦点移动指令用于指示向上移动焦点。当用户对遥控设备中的“向下”按键进行点击操作时，第一焦点移动指令用于指示向下移动焦点。

可选的，第一焦点移动指令指示焦点移动的次数与用户输入的操作相关，例如，第一焦点移动指令指示焦点移动的次数与用户对按键的按压时长相关，当用户对“向下”按键的按压时长在第一时长范围时，则第一焦点移动指令指示焦点移动的次数为1次，即，第一焦点移动指令指示焦点移动到当前焦点所在控件的下一个控件上。当用户对“向下”按键的按压时长在第二时长范围时，则第一焦点移动指令指示焦点移动的次数为2次，即，第一焦点移动指令指示焦点移动到当前焦点所在控件的下两个控件上。

可选的，自定义控件的形状可以为矩形、圆角矩形、椭圆形等。在实际应用过程中，可以根据实际需要设置定义控件的形状，本发明实施例对此不作具体限定。

可选的，自定义控件的长度可以为固定长度。在该种情况下，自定义控件的长度可以等于导航栏中长度最大的控件的长度，此时，焦点所在控件所占区域位于自定义控件所占区域内、且焦点所在控件所占区域小于或等于自定义控件所占区域。

可选的，自定义控件的长度还可以为可变长度。在该种情况下，自定义控件的长度可以等于导航栏中焦点所在的控件的长度，此时，自定义控件所占区域与焦点所在控件所占区域重合。

可选的，自定义控件具有的第一预设渲染色与用户界面的背景色不同，且与导航栏中的控件中的文本的颜色不同，这样，可以通过自定义控件突出显示焦点所在的控件。为了可以突出显示焦点所在控件、以及控件中的文本，可以增大第一预设渲染色与用户界面的背景色之间的色差、以及增大第一预设渲染色与控件中文本颜色的色差。

可选的，当焦点位于第一控件时，自定义控件所占区域可以与第一控件所占区域重合，或者，第一控件所占区域位于自定义控件所占区域内、且第一控件所占区域小于自定义控件所占区域。

S202、根据第一控件和第一焦点移动指令，确定焦点需要移动至的第二控件。

例如，请参照图1，当第一控件为“频道”对应的控件，第一焦点移动指令用于指示向右移动一次焦点，则第二控件为“影视”。

S203、将焦点从第一控件移动至第二控件，并将自定义控件从第一控件所在位置移动至第二控件所在位置，以使自定义控件占用的区域覆盖第二控件占用的区域，且自定义控件所在图层位于第二控件所在图层的下方。

可选的，将焦点从第一控件移动至第二控件，与将自定义控件从第一控件所在位置移动至第二控件所在位置同时进行。

可选的，将焦点从第一控件移动至第二控件所消耗的时长等于将自定义控件从第一控件所在位置移动至第二控件所在位置所消耗的时长，以使焦点和自定义控件同时移动至第二控件。

在将自定义控件从第一控件所在位置移动至第二控件所在位置之后，第一控件不再突出显示，且第二控件突出显示。

可选的，为了进一步突出显示焦点所在控件，还可以增大焦点所在控件中文本的字体，和/或，加粗焦点所在控件中的文本。

需要说明的是，若焦点所在控件中文本的字体大小和/或颜色发生变化，则当焦点从第一控件移动至第二控件时，则第一控件中文本的字体大小和/或颜色恢复至默认状态，且第二控件中文本的字体大小和/或颜色发生预设改变。

本发明实施例提供的控件显示方法，当焦点位于导航栏中的第一控件时，自定义控件位于第一控件所在位置，以通过第一控件突出显示第一控件。当焦点位于导航栏中的第一控件时，接收用户输入的第一焦点移动指令，根据第一控件和第一焦点移动指令，确定焦点需要移动至的第二控件，将焦点从第一控件移动至第二控件，并将自定义控件从第一控件所在位置移动至第二控件所在位置，以取消突出显示第一控件，并通过自定义控件突出显示第二控件。在焦点从第一控件移动至第二控件的过程中，由自定义控件进行连续的移动，以突出显示焦点所在的控件，避免了第一控件和第二控件的外观发生突变，提高焦点移动的连续性，进而提高用户体验。

在实际应用过程中，自定义控件的长度可以为固定长度，也可以为可变长度，在该两种不同的情况下，自定义控件的移动方式也不同，下面，通过图3-图5所示的实施例，对该两种情况下自定义控件的移动方式进行详细说明。

图3为本发明实施例提供的自定义控件移动过程示意图一。在图3所示的实施例中，自定义控件的长度为固定长度，且自定义控件的长度等于导航栏中最长控件的长度。

请参见图3，包括界面301-界面304，且导航栏如区域A所示（下文简称导航栏A），自定义控件的渲染色为灰色，且自定义控件中的内容为空。再假设导航栏A中最长控件的长度为三个字符所占长度，即，“瀑布流”控件为导航栏中最长控件。

当焦点位于“瀑布流”控件（第一控件）时，请参见界面301，自定义控件所占区域与“瀑布流”控件所占区域重合，自定义控件所在图层位于“瀑布流”控件所在图层的下方，以通过自定义控件突出显示“瀑布流”控件。

当用户对遥控设备中的“向下”按键进行一次点击操作时，触发第一焦点移动指令，第一焦点移动指令用于指示在导航栏的控件中向下移动一次焦点。终端设备根据第一控件（“瀑布流”控件）和第一焦点移动指令（向下移动一次焦点），确定第二控件（需要将焦点移动至的控件）为“专题”控件，则终端设备开始将焦点从“瀑布流”控件向“专题”控件移动，具体过程请参见界面302-界面304。

请参见界面302-界面304，自定义控件从“瀑布流”控件连续移动至“专题”控件。需要说明的是，界面302-界面304只是自定义控件从“瀑布流”控件移动至“专题”控件的个别画面，在实际应用过程中，自定义控件的滑动为一连续过程。

在自定义控件从“瀑布流”控件移动至“专题”控件的同时，焦点从“瀑布流”控件向“专题”控件移动。在焦点移动至“专题”控件时，自定义控件刚好移动至“专题”控件，进而突出显示“专题”控件（如界面304所示）。

在图3所示的实施例中，自定义控件连续的从“瀑布流”控件移动至“专题”控件，避免了“瀑布流”控件和“专题”控件的外观发生突变，提高焦点移动的连续性，进而提高用户体验。

图4为本发明实施例提供的自定义控件的移动流程图。在图4所示的实施例中，自定义控件的长度等于焦点所在控件的长度。请参见图4，该方法可以包括：

S401、获取第一控件的长度和第二控件的长度。

S402、确定焦点从第一控件移动至第二控件所需的移动时长。

可选的，移动时长可以为预设时长。

可选的，焦点的移动速度可以为预设速度，相应的，可以获取第一控件与第二控件之间的距离，并根据第一控件与第二控件之间的距离和预设速度，计算焦点从第一控件移动至第二控件所需的移动时长。

S403、根据第一控件的长度、第二控件的长度和移动时长，确定自定义控件的长度的渐变速率。

可选的，可以获取第一控件的长度和第二控件的长度的差值，根据该差值和移动时长确定自定义控件的长度的渐变速率。

例如，可以将第二控件的长度减去第一控件的长度，得到第一差值，将第一差值除以移动时长，得到渐变速率。

可选的，若第二控件的长度大于第一控件的长度，则渐变速率为正数，即，自定义控件的长度逐渐边长。若第二控件的长度小于第一控件的长度，则渐变速率为负数，即，自定义控件的长度逐渐变短。若第二控件的长度等于第一控件的长度，则渐变速率为零，即，自定义控件的长度不变。

S404、在自定义控件从第一控件所在位置移动至第二控件所在位置的过程中，根据渐变速率调节自定义控件的长度，直至自定义控件移动至第二控件所在位置时，自定义控件所占区域与第二控件所占区域重合。

可选的，根据渐变速率均匀的调节自定义控件的长度，以使自定义控件的长度进行均匀的变化。

在图4所示的实施例中，自定义控件的长度与焦点所在控件的长度相同，即，自定义控件所占区域与焦点所在控件所占区域重合，这样，在通过自定义控件突出显示焦点所在控件时，可以提高焦点所在控件的视觉效果。进一步的，在自定义控件移动的过程中，自定义控件连续的进行移动，且自定义控件的长度进行均匀的变化，避免了第一控件和第二控件的外观发生突变，提高焦点移动的连续性，进而提高用户体验。

下面，结合图5，对图4实施例所示的技术方案进行详细说明。

图5为本发明实施例提供的自定义控件移动过程示意图二。在图5所示的实施例中，自定义控件的长度与焦点所在控件的长度相同。

请参见图5，包括界面501-界面504，且导航栏如区域A所示（下文简称导航栏A），自定义控件的渲染色为灰色，且自定义控件中的内容为空。

当焦点位于“瀑布流”控件（第一控件）时，请参见界面501，自定义控件所占区域与“瀑布流”控件所占区域重合，自定义控件所在图层位于“瀑布流”控件所在图层的下方，以通过自定义控件突出显示“瀑布流”控件。

当用户对遥控设备中的“向下”按键进行一次点击操作时，触发第一焦点移动指令，第一焦点移动指令用于指示在导航栏的控件中向下移动一次焦点。终端设备根据第一控件（“瀑布流”控件）和第一焦点移动指令（向下移动一次焦点），确定第二控件（需要将焦点移动至的控制）为“专题”控件，终端设备确定自定义控件的长度的渐变速率，并开始将焦点从“瀑布流”控件向“专题”控件移动，具体过程请参见界面502-界面504。

请参见界面502-界面504，自定义控件从“瀑布流”控件连续移动至“专题”控件，且自定义控件逐步变小，直至自定义控件移动至“专题”控件所在位置时，自定义控件的长度与“专题”控件的长度相同。需要说明的是，界面502-界面504只是自定义控件从“瀑布流”控件移动至“专题”控件的个别画面，在实际应用过程中，自定义控件的滑动为一连续过程。

在自定义控件从“瀑布流”控件移动至“专题”控件的同时，焦点从“瀑布流”控件向“专题”控件移动。在焦点移动至“专题”控件时，自定义控件刚好移动至“专题”控件，进而突出显示“专题”控件（如界面504所示）。

在图5所示的实施例中，自定义控件连续的从“瀑布流”控件移动至“专题”控件，避免了“瀑布流”控件和“专题”控件的外观发生突变，提高焦点移动的连续性，进而提高用户体验。进一步的，在自定义控件移动至“专题”控件所在位置时，自定义控件的长度与“专题”控件的长度相同，提高了对“专题”控件的显示效果。

在上述任意一个实施例的基础上，焦点还可以在导航栏中的控件和用户界面中的其它控件之间移动，下面，通过图6-图8所示的实施例对该过程进行详细说明。

图6为本发明实施例提供的控件显示方法的流程示意图二。图6所示的过程为对焦点从导航栏中的控件移动至用户界面中的其它控件的过程。请参见图6，该方法可以包括：

S601、在焦点位于导航栏中的第三控件时，接收用户输入的第二焦点移动指令，第二焦点移动指令用于指示将焦点从第三控件移动至用户界面中的其它控件。

其中，当焦点位于第三控件时，自定义控件所占区域覆盖第三控件所占区域，自定义控件所在图层位于第三控件所在图层的下方。

例如，请参见图1，用户界面中的其它控件可以为搜索图标101对应的控件，图标栏102中的控件、以及详情栏104中的控件等。

可选的，用户可以对控制设备中的按键进行操作，以实现输入第二焦点移动指令。

S602、取消显示自定义控件。

可选的，可以将自定义控件的状态设置为隐藏状态，以实现取消显示自定义控件。

在取消显示自定义控件之后，则不再突出显示第三控件。

需要说明的是，在焦点位于第三控件时，若第三控件中文本的字体大小和/或颜色发生变化时，则在取消显示自定义控件时，将第三控件中文本的字体大小和/或颜色恢复至默认状态。

S603、重绘第三控件，以使第三控件中的文本下方具有预设颜色的下划线。

其中，文本下方具有预设颜色的下划线的控件为第三焦点移动指令指示需要将焦点移动至的控件，所述第三焦点移动指令用于指示将焦点从所述导航栏之外的控件移动至所述导航栏中的控件。

在实际应用过程中，在第三控件中的文本下方具有预设颜色的下划线时，不但可以清楚的标注第三控件，而且，当焦点需要从用户界面中除导航栏中的控件外的其它控件移动至导航栏中的控件时，焦点移动至第三控件，这样可以实现快速将焦点移动至第三控件。

可选的，在默认情况下（例如打开用户界面的情况下）导航栏中的第一个控件中的文本下方具有预设颜色的下滑线。

例如，假设用户界面为图1所示的用户界面，在打开图1所示的用户界面时，焦点默认在搜索图标101上，则在“我的”控件中的文本“我的”下方具有预设颜色的下滑线。

需要说明的是，在图1所示的用户界面中，焦点位于“频道”控件上。即，图1所示的用户界面的当前状态并非默认状态。

可选的，预设颜色与用户界面的背景色不同，以实现可以通过预设颜色的下划线突出显示第三控件。

在图6所示的实施例中，在将焦点从导航栏中的第三控件移动至用户界面中的其它控件时，取消显示自定义控件，并在第三控件中的文本下方显示预设颜色的下划线。在第三控件中的文本下方具有预设颜色的下划线时，不但可以清楚的标注第三控件，而且，当焦点需要从用户界面中除导航栏中的控件外的其它控件移动至导航栏中的控件时，焦点移动至第三控件，这样可以实现快速将焦点移动至第三控件。

图7为本发明实施例提供的控件显示方法的流程示意图三。图7所示的过程为对焦点从用户界面中的其它控件移动至导航栏中的控件的过程。请参见图7，该方法可以包括：

S701、在焦点位于用户界面中除导航栏之外的控件时，接收用户输入的第三焦点移动指令。

其中，第三焦点移动指令用于指示将焦点从导航栏之外的控件中移动至导航栏的控件中。

S702、在导航栏中确定第四控件，第四控件中的文本下方具有预设颜色的下划线。

S703、重绘第四控件，以在第四控件中的文本下方取消显示下划线。

S704、在第四控件所在位置显示自定义控件，以使自定义控件占用的区域覆盖第四控件占用的区域，且自定义控件所在图层位于第四控件所在图层的下方。

在图7所示的实施例中，在将焦点从用户界面中的其它控件移动至导航栏中的控件时，可以直接将焦点移动至文本具有预设颜色的下划线的控件。这样，可以实现快速移动焦点。

下面，通过图8所示的实施例，对图6-图7所示的实施例进行详细说明。

图8为本发明实施例提供的焦点移动过程示意图一。请参见图8，包括界面801-界面803，其中，导航栏如区域B所示（下文简称导航栏B）。

当焦点位于导航栏B的“频道”控件时，请参见界面801，自定义控件所占区域与“频道”控件所占区域重合，自定义控件所在图层位于“频道”控件所在图层的下方，以通过自定义控件突出显示“频道”控件。

当用户对遥控设备中的“向上”按键进行一次点击操作时，触发第二焦点移动指令。终端设备根据第二焦点移动指令取消显示自定义控件，并重绘第三控件，以使第三控件中的文本下方具有预设颜色的下划线。具体的，请参见界面802。

当用户需要将焦点移动至导航栏中的控件时，用户可以对遥控设备中的“向下”按键进行一次点击操作，进而触发第三焦点移动指令。终端设备根据第三焦点移动指令在导航栏中确定文本下方具有预设颜色的下划线的控件为“频道”控件。终端设备重绘“频道”控件，以在“频道”控件中的文本下方取消显示下划线，并在“频道”控件所在位置显示自定义控件，以使自定义控件占用的区域覆盖“频道”控件占用的区域，且自定义控件所在图层位于“频道”控件所在图层的下方。具体的，请参见界面803。

在图8所示的实施例中，当焦点位于导航栏中的“频道”控件时，自定义控件所占区域与“频道”控件所占区域重合，以突出显示“频道”控件。当将焦点从“频道”控件移动至其它控件后，取消显示自定义控件，并在“频道”控件中的“频道”下方显示预设颜色的下滑线，通过该预设颜色的下划线标注“频道”控件，当需要将焦点再次移动至导航栏中的控件时，直接将焦点移动至“频道”控件，进而可以实现快速移动焦点。

在上述任意一个实施例的基础上，焦点还可以在图标栏中的控件之间移动，下面，提供图9-图10所示的实施例对该过程进行详细说明。

图9为本发明实施例提供的控件显示方式的流程示意图四。请参见图9，该方法可以包括：

S901、在焦点位于图标栏的第五控件时，接收用户在图标栏输入的第四焦点移动指令。

其中，第四焦点移动指令用于指示在图标栏的控件中移动焦点，当焦点位于第五控件时，第五控件的渲染色为第二预设渲染色，且在第五控件中显示第五控件对应的文本信息。

例如，图标栏可以如图1中的图标栏102所示。

可选的，在图标栏中，可以通过将控件的渲染色设置为第二预设渲染色、以及显示控件中的文本信息来标注焦点所在的控件。

可选的，对于图标栏中的控件，若焦点不在该控件上时，则该控件未填充渲染色、且在该控件中不显示该控件对应的文本信息，即，此时控件中仅显示图标。

S902、根据第五控件和第四焦点移动指令，在图标栏中确定需要将焦点移动至的第六控件。

需要说明的是，S902的过程可以参见S202，此处不再进行赘述。

S903、逐步减小第五控件的长度，直至将第五控件的长度减小至第五控件对应的图标的长度时，将第五控件对应的文本信息设置为隐藏状态，并取消显示第二预设渲染色，使得第五控件显示对应的图标。

可选的，可以获取焦点从第五控件移动至第六控件所需的时长、以及第五控件对应的文本信息的长度，并根据焦点从第五控件移动至第六控件所需的时长、以及第五控件对应的文本信息的长度，确定第五控件的长度的缩小速率，并按照该缩小速率逐步减小第五控件的长度。

S904、将第六控件的渲染色设置为第二预设渲染色，将第六控件对应的文本信息设置为显示状态，并逐步增加第六控件的长度，直至第六控件的长度等于第六控件对应的文本信息和图标对应的长度，使得第六控件显示对应的图标和文本信息。

可选的，可以根据焦点从第五控件移动至第六控件所需的时长、以及第刘控件对应的文本信息的长度，确定第六控件的长度的增大速率，并按照该增大速率逐步增大第六控件的长度。

需要说明的是，S903和S904同时执行，且执行速度相同。即，当第五控件仅显示对应的图标时，第六控件显示对应的图标和文本信息。

可选的，当图标栏中的控件位于用户界面的右侧时，当需要增大控件的长度时，向左侧增大控件的长度。当图标栏中的控件位于用户界面的左侧时，当需要增大控件的长度时，向右侧增大控件的长度。

在图9所示的实施例中，在焦点从第五控件移动至第六控件的过程中，第五控件和第六控件的外观进行逐步的变化，以取消突出显示第五控件，并突出显示第六控件。由于第五控件和第六控件的外观为逐步的变化，避免了第五控件和第六控件的外观发生突变，提高焦点移动的连续性，进而提高用户体验。

下面，通过图10所示实施例对图9所示的实施例进行详细说明。

图10为本发明实施例提供的焦点移动过程示意图二。请参见图10，包括界面1001-界面1004，其中，图标栏如区域C所示（下文简称图标栏C），假设图标栏C中的第一个控件对应的文本信息为“信息”，第二个控件对应的文本信息为“连接手机”。

当焦点不位于图标栏C中的控件时，请参见界面1001，图标栏C中的控件仅显示图标，且图标栏C中的控件未填充渲染色。

当焦点移动至图标栏C中的第一个控件时，请参见界面1002，第一控件的选染色为灰色，且在第一控件中增加显示“信息”文本。

当用户对遥控设备中的“向右”按键进行按压操作时，触发第四焦点移动指令，并确定焦点需要移动至图标栏中的第二个控件。

终端设备确定第一个控件的长度的缩小速率和第二个控件的长度的增大速率，由于第二个控件对应的文本信息的长度是第一个控件对应的文本信息的长度的2倍，因此，第二个控件的长度的增大速率为第一个控件的长度的缩小速率的2倍。

请参见界面1002-界面1004，按照第一个控件的长度的缩小速率逐步减小第一个控件的长度，直至将第一个控件的长度减小至第一个控件对应的图标的长度时，将第一个控件对应的文本信息“信息”设置为隐藏状态，并取消显示第二预设渲染色，使得第一个控件显示对应的图标。同时，按照第二个控件的长度的增大速率逐步增大第二个控件的长度，直至第二个控件的长度等于所述第二个控件对应的文本信息“连接手机”和图标对应的长度，使得第二个控件显示对应的图标和文本信息“连接手机”。

需要说明的是，界面1002-界面1004只是焦点从图标栏第一个控件移动至第二个控件的过程中的个别画面，在实际应用过程中，第一个控件和第二个控件的程度变化为一连续过程。

图11为本发明实施例提供的控件显示装置的结构示意图一。请参见图11，该装置包括接收模块11、确定模块12和移动模块13，其中，

所述接收模块11用于，在焦点位于导航栏中的第一控件时，接收用户输入的第一焦点移动指令，所述第一焦点移动指令用于指示在导航栏的控件中移动所述焦点；当焦点位于所述第一控件时，自定义控件所占区域覆盖所述第一控件所占区域，所述自定义控件所在图层位于所述第一控件所在图层的下方，所述自定义控件具有第一预设渲染色且内容为空；

所述确定模块12用于，根据所述第一控件和所述第一焦点移动指令，确定焦点需要移动至的第二控件；

所述移动模块13用于，将所述焦点从所述第一控件移动至所述第二控件，并将所述自定义控件从所述第一控件所在位置移动至所述第二控件所在位置，以使所述自定义控件占用的区域覆盖所述第二控件占用的区域，且所述自定义控件所在图层位于所述第二控件所在图层的下方。

本发明实施例提供的控件显示装置可以执行上述方法实施例所示的技术方案，其实现原理以及有益效果类似，此处不再进行赘述。

在一种可能的实施方式中，将所述焦点从所述第一控件移动至所述第二控件所消耗的时长等于将所述自定义控件从所述第一控件所在位置移动至所述第二控件所在位置所消耗的时长，以使所述焦点和所述自定义控件同时移动至所述第二控件。

在另一种可能的实施方式中，当焦点位于所述第一控件时，所述自定义控件所占区域与所述第一控件所占区域重合；所述移动模块13具体用于：

获取所述第一控件的长度和所述第二控件的长度；

根据所述第一控件的长度和所述第二控件的长度，将所述自定义控件从所述第一控件所在位置移动至所述第二控件所在位置，以使所述自定义控件所占区域与所述第二控件所占区域重合。

在另一种可能的实施方式中，所述移动模块13具体用于：

确定焦点从所述第一控件移动至所述第二控件所需的移动时长；

根据所述第一控件的长度、所述第二控件的长度和所述移动时长，确定所述自定义控件的长度的渐变速率；

在所述自定义控件从所述第一控件所在位置移动至所述第二控件所在位置的过程中，根据所述渐变速率调节所述自定义控件的长度，直至所述自定义控件移动至所述第二控件所在位置时，所述自定义控件所占区域与所述第二控件所占区域重合。

图12为本发明实施例提供的控件显示装置的结构示意图二。在图11所示实施例的基础上，请参见图12，所述装置还包括显示模块14和重绘模块15，其中，

所述接收模块11还用于，在焦点位于所述导航栏中的第三控件时，接收用户输入的第二焦点移动指令，所述第二焦点移动指令用于指示将焦点从所述第三控件移动至用户界面中的其它控件，当焦点位于所述第三控件时，所述自定义控件所占区域覆盖所述第三控件所占区域，所述自定义控件所在图层位于所述第三控件所在图层的下方；

所述显示模块14用于，取消显示所述自定义控件；

所述重绘模块15用于，重绘所述第三控件，以使所述第三控件中的文本下方具有预设颜色的下划线，其中，文本下方具有预设颜色的下划线的控件为第三焦点移动指令指示需要将焦点移动至的控件，所述第三焦点移动指令用于指示将焦点从所述导航栏之外的控件移动至所述导航栏中的控件。

在另一种可能的实施方式中，所述接收模块11还用于，在焦点位于所述用户界面中除所述导航栏之外的控件时，接收用户输入的所述第三焦点移动指令；

所述确定模块12还用于，在所述导航栏中确定第四控件，所述第四控件中的文本下方具有所述预设颜色的下划线；

所述重绘模块15还用于，重绘所述第四控件，以在所述第四控件中的文本下方取消显示所述下划线；

所述显示模块14还用于，在所述第四控件所在位置显示所述自定义控件，以使所述自定义控件占用的区域覆盖所述第四控件占用的区域，且所述自定义控件所在图层位于所述第四控件所在图层的下方。

在另一种可能的实施方式中，所述接收模块11还用于，在焦点位于图标栏的第五控件时，接收用户在图标栏输入的第四焦点移动指令，所述第四焦点移动指令用于指示在图标栏的控件中移动所述焦点，当焦点位于所述第五控件时，所述第五控件的渲染色为第二预设渲染色，且在所述第五控件中显示所述第五控件对应的文本信息；

所述确定模块12还用于，根据所述第五控件和所述第四焦点移动指令，在所述图标栏中确定需要将焦点移动至的第六控件；

所述显示模块14还用于，逐步减小所述第五控件的长度，直至将所述第五控件的长度减小至所述第五控件对应的图标的长度时，将所述第五控件对应的文本信息设置为隐藏状态，并取消显示所述第二预设渲染色，使得所述第五控件显示对应的图标；

所述显示模块14还用于，将所述第六控件的渲染色设置为所述第二预设渲染色，将所述第六控件对应的文本信息设置为显示状态，并逐步增加所述第六控件的长度，直至所述第六控件的长度等于所述第六控件对应的文本信息和图标对应的长度，使得所述第六控件显示对应的图标和文本信息。

本发明实施例提供的控件显示装置可以执行上述方法实施例所示的技术方案，其实现原理以及有益效果类似，此处不再进行赘述。

本领域普通技术人员可以理解：实现上述各方法实施例的全部或部分步骤可以通过程序指令相关的硬件来完成。前述的程序可以存储于一计算机可读取存储介质中。该程序在执行时，执行包括上述各方法实施例的步骤；而前述的存储介质包括：ROM、RAM、磁碟或者光盘等各种可以存储程序代码的介质。

最后应说明的是：以上各实施例仅用以说明本发明实施例的技术方案，而非对其限制；尽管参照前述各实施例对本发明实施例进行了详细的说明，本领域的普通技术人员应当理解：其依然可以对前述各实施例所记载的技术方案进行修改，或者对其中部分或者全部技术特征进行等同替换；而这些修改或者替换，并不使相应技术方案的本质脱离本发明实施例方案的范围。

Claims (10)

1.一种控件显示方法，其特征在于，包括：

接收用户输入的第四焦点移动指令，其中，所述第四焦点移动指令用于指示将所述焦点从图标栏中的第五控件移动至图标栏中的第六控件，所述第五控件被配置为：当焦点位于所述第五控件时，所述第五控件的渲染色为第二预设渲染色，且在所述第五控件中第五图标的一侧显示所述第五控件对应的文本信息；所述第六控件被配置为：当焦点位于所述第五控件时，所述第六控件显示对应的第六图标不显示所述第六控件对应的文本信息；

响应与所述第四焦点移动指令，使焦点位于所述第六控件，将所述第六控件的渲染色设置为所述第二预设渲染色，将所述第六控件对应的文本信息设置为显示状态，并在所述第六控件中第六图标的一侧显示所述第六控件对应的文本信息并将所述第五控件对应的文本信息设置为隐藏状态，且取消显示所述第二预设渲染色，使得所述第五控件显示对应的第五图标不显示所述第五控件对应的文本信息。

2.根据权利要求1所述的方法，其特征在于，所述用户界面包括还包括导航栏，所述导航栏至少包括第一控件和第二控件，焦点可受控制的在所述第一控件和所述第二控件之间移动，所述方法还包括：

在焦点位于导航栏中的第一控件时，自定义控件所占区域与所述第一控件所占区域重叠；响应与接收到的第一焦点移动指令，根据所述第一控件和所述第一焦点移动指令确定焦点需要移动至的第二控件，并使所述自定义控件占用的区域与所述第二控件占用的区域重叠，其中，所述第一焦点移动指令用于指示在导航栏中的不同控件之间移动所述焦点，所述自定义控件用于表征焦点在所述导航栏中的位置，所述自定义控件在层叠方向上位于导航栏中焦点位置处的控件下方。

3.根据权利要求1所述的方法，其特征在于，

接收输入的将焦点移动到所述图标栏外的控件时，将所述第六控件对应的文本信息设置为隐藏状态，并取消显示所述第二预设渲染色，使得所述第六控件显示对应的第六图标不显示所述第六控件对应的文本信息。

4.根据权利要求1所述的方法，其特征在于，

当焦点位于所述第五控件时，所述第五控件中第五图标和所述第五控件对应的文本信息并列显示；和/或

当焦点位于所述第六控件时，所述第六控件显示对应的第六图标和所述第六控件对应的文本信息并列显示。

5.一种控件显示方法，其特征在于，所述方法用于控制用户界面中的控件的显示，所述用户界面包括图标栏，所述图标栏至少包括第五控件和第六控件，所述方法包括：

在焦点位于图标栏的第五控件时，接收用户在图标栏输入的第四焦点移动指令，其中，所述第四焦点移动指令用于指示在图标栏的控件之间移动所述焦点，所述第五控件被配置为当焦点位于所述第五控件时，同时显示所述第五控件对应的第五图标和所述第五控件对应的第五文本信息；当焦点不位于所述第五控件时，仅显示所述第五图标不显示所述第五文本信息；

根据所述第五控件和所述第四焦点移动指令，在所述图标栏中确定需要将焦点移动至的第六控件；

将所述第五控件对应的文本信息设置为隐藏状态，使所述第五控件时显示所述第五图标不显示所述第五文本信息；将所述第六控件对应的第六文本信息设置为显示状态，使所述第六控件同时显示所述第六控件对应的第六图标和所述第六文本信息。

6.如权利要求5所述的方法，其特征在于，

第五控件在焦点位于所述第五控件时的渲染色与所述第六控件在焦点位于所述第六控件时的渲染色相同。

7.根据权利要求5所述的方法，其特征在于，所述用户界面包括还包括导航栏，所述导航栏至少包括第一控件和第二控件，焦点可受控制的在所述第一控件和所述第二控件之间移动，所述方法还包括：

在焦点位于导航栏中的第一控件时，自定义控件所占区域与所述第一控件所占区域重叠；响应与接收到的第一焦点移动指令，根据所述第一控件和所述第一焦点移动指令确定焦点需要移动至的第二控件，并使所述自定义控件占用的区域与所述第二控件占用的区域重叠，其中，所述第一焦点移动指令用于指示在导航栏中的不同控件之间移动所述焦点，所述自定义控件用于表征焦点在所述导航栏中的位置，所述自定义控件具有第一预设渲染色且内容为空，所述自定义控件在层叠方向上位于导航栏中焦点位置处的控件下方。

8.根据权利要求7所述的方法，其特征在于，所述用户界面还包括位于所述导航栏外的其他控件，所述方法包括：

在焦点位于导航栏中的第一控件时，自定义控件所占区域与所述第一控件所占区域重叠，响应与接收到的第二焦点移动指令，取消在所述第一控件处显示所述自定义控件；重绘所述第一控件，以使所述第一控件中的文本下方设置有下划线，其中，所述第二焦点移动指令用于指示将焦点从所述第一控件移动至所述其他控件。

9.一种控件显示方法，其特征在于，所述方法用于控制用户界面中的控件的显示，所述用户界面包括图标栏和位于所述图标栏下侧的导航栏，所述导航栏至少包括相邻设置的第一控件和第二控件，所述图标栏至少包括相邻设置的第五控件和第六控件，所述方法包括：

接收水平移动焦点的指令；

在焦点位于所述第一控件时，响应与水平移动焦点的指令，取消与所述第一控件所占区域重叠设置的自定义控件，且在与所述第二控件所占区域重叠的位置显示自定义控件；

在焦点位于第五控件时，响应与水平移动焦点的指令，将所述第五控件对应的第五文本信息设置为隐藏状态，使所述第五控件时显示第五图标不显示所述第五文本信息；将所述第六控件对应的第六文本信息设置为显示状态，使所述第六控件同时显示所述第六控件对应的第六图标和所述第六文本信息。

10.一种终端设备，包括：处理器，所述处理器与存储器耦合；

所述存储器用于，存储计算机程序；

所述处理器用于，执行所述存储器中存储的计算机程序，以使得所述终端设备执行权利要求1-9中任一项所述的方法。