一种显示方法、装置、电子设备及存储介质与流程

1.本技术实施例涉及界面交互技术领域，尤其涉及一种显示方法、装置、电子设备及存储介质。


背景技术：

2.目前基于移动终端开发的智能家居产品的控制应用软件，在模式选择的实际应用中，用不同的气泡来代表不同的模式，而气泡又是无规律地随意飘动，气泡可能会在当前显示区域中消失，从而导致用户无法精准定位到想要选择的模式，影响了用户的交互体验。因此，亟需对智能家居产品的控制应用软件的交互界面进行优化和提升。


技术实现要素：

3.本技术实施例提供了一种显示方法、装置、电子设备及存储介质，以方便用户精准定位到想要选择的模式，可以提升用户使用智能家居的控制应用软件的交互体验感。
4.第一方面，本技术实施例提供了一种显示方法，该方法包括：
5.根据针对多个模式的选择操作确定目标模式，其中，所述图标交互界面包括依据所述多个模式的数量划分的多个可活动子区域，一个模式对应一个可活动子区域，一个模式对应一个图标，所述可活动子区域用于展示对应模式的图标；
6.从所述图标交互界面中确定出包含所述目标模式对应的目标可活动子区域或包含所述目标模式对应的目标图标的第一交互界面；
7.在所述显示屏显示所述第一交互界面以及以预设方式突出显示所述目标图标。
8.第二方面，本技术实施例提供了一种显示装置，该装置包括：
9.模式确定模块，用于根据针对多个模式的选择操作确定目标模式，其中，所述图标交互界面包括依据所述多个模式的数量划分的多个可活动子区域，一个模式对应一个可活动子区域，一个模式对应一个图标，所述可活动子区域用于展示对应模式的图标；
10.界面确定模块，用于从所述图标交互界面中确定出包含所述目标模式对应的目标可活动子区域或包含所述目标模式对应的目标图标的第一交互界面；
11.界面显示模块，用于在所述显示屏显示所述第一交互界面以及以预设方式突出显示所述目标图标。
12.第三方面，本技术实施例提供了一种电子设备，该电子设备包括：
13.一个或多个处理器；
14.存储装置，用于存储一个或多个程序；
15.当所述一个或多个程序被所述一个或多个处理器执行，使得所述一个或多个处理器实现本技术任意实施例所述的显示方法。
16.第四方面，本技术实施例提供了一种计算机可读存储介质，其上存储有计算机程序，该计算机程序被处理器执行时实现本技术任意实施例所述的显示方法。
17.本技术实施例提供了一种显示方法、装置、电子设备及存储介质，该方法包括：根
据针对多个模式的选择操作确定目标模式，其中，图标交互界面包括依据多个模式的数量划分的多个可活动子区域，一个模式对应一个可活动子区域，一个模式对应一个图标，可活动子区域用于展示对应模式的图标；从图标交互界面中确定出包含目标模式对应的目标可活动子区域或包含目标模式对应的目标图标的第一交互界面；在显示屏显示第一交互界面以及以预设方式突出显示目标图标。本技术通过为每个目标模式划分对应的可活动子区域，以使目标图标在对应的可活动子区域中飘动，在确定了目标模式时将包含目标模式对应的目标可活动子区域或包含目标模式对应的目标图标的第一交互界面在显示在显示屏中，方便用户精准定位到想要选择的模式；此外，还通过在显示屏中突出显示目标图标，可以提升用户使用智能家居的控制应用软件的交互体验感。
18.应当理解，本部分所描述的内容并非旨在标识本技术的实施例的关键或重要特征，也不用于限制本技术的范围。本技术的其他特征将通过以下的说明书而变得容易理解。
附图说明
19.附图用于更好地理解本方案，不构成对本技术的限定。其中：
20.图1为本技术实施例提供的一种显示方法的第一流程示意图；
21.图2a-2d为本技术实施例提供的显示场景的示意图；
22.图3a-3b为本技术实施例提供的虚拟操作键的示意图；
23.图4a-4g为本技术实施例提供的界面交互的示意图；
24.图5为本技术实施例提供的一种显示方法的第二流程示意图；
25.图6a-6c为本技术实施例提供的另一种显示场景的示意图；
26.图7为本技术实施例提供的一种显示方法的第三流程示意图；
27.图8a-8b为本技术实施例提供的另一种界面交互的示意图；
28.图9为本技术实施例提供的一种显示装置的结构示意图；
29.图10是用来实现本技术实施例的一种显示方法的电子设备的框图。
具体实施方式
30.为使本技术实施例的目的、技术方案和优点更加清楚，下面将结合本技术实施例中的附图，对本技术实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例是本技术一部分实施例，而不是全部的实施例。基于本技术中的实施例，本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例，都属于本技术保护的范围。
31.需要说明的是，本发明的说明书和权利要求书及上述附图中的术语“第一”、“第二”等是用于区别类似的对象，而不必用于描述特定的顺序或先后次序。应该理解这样使用的数据在适当情况下可以互换，以便这里描述的本发明的实施例能够以除了在这里图示或描述的那些以外的顺序实施。此外，术语“包括”和“具有”以及他们的任何变形，意图在于覆盖不排他的包含，例如，包含了一系列步骤或单元的过程、方法、系统、产品或设备不必限于清楚地列出的那些步骤或单元，而是可包括没有清楚地列出的或对于这些过程、方法、产品或设备固有的其它步骤或单元。
32.在介绍本技术的实施例之前，先对本技术的应用场景进行简单介绍。本技术的可以应用在智能家居的控制设备中，如用于控制具有多个灯效模式的灯的控制设备。在控制
设备的交互界面中可以选择待展示的灯效模式，并在交互界面中以预设方式展示灯效模式的图标，以告知用户当前选择的是哪种模式。这只是本技术的一种应用场景，还可以应用在其他类型的场景中。
33.图1为本技术实施例提供的一种显示方法的第一流程示意图，本实施例可适用于在显示屏中对目标模式的目标图标进行显示的情况。本实施例提供的一种显示方法可以由本技术实施例提供的显示装置来执行，该装置可以通过软件和/或硬件的方式实现，并集成在执行本方法的电子设备中。本技术中的显示方法应用在电子设备中，电子设备包括显示屏，显示屏可用于显示部分或者全部图标交互界面。
34.参见图1，本实施例的方法包括但不限于如下步骤：
35.s110、根据针对多个模式的选择操作确定目标模式。
36.其中，图标交互界面用于展示多个模式的图标，图标交互界面包括依据多个模式的数量划分的多个可活动子区域，一个模式对应一个可活动子区域，一个模式对应一个图标，每个可活动子区域用于展示该可活动子区域所对应模式的图标。
37.可选的，模式的图标可以是气泡，可以随意地或有规律地在对应可活动子区域中飘动。可活动子区域的形状可以是规则图形，比如可以是矩形，也可以是不规则图形；不同可活动子区域的大小或者形状可以相同也可以不同，本技术实施例对此不做限定。
38.关于本技术的显示场景取决于图标交互界面与显示屏之间的大小关系。可选的，在一种可能的实现方式中，本技术的显示场景可以是：如图2a所示，附图标记21为图标交互界面，附图标记22为显示屏，图标交互界面的宽度大于显示屏的宽度，图标交互界面的长度小于显示屏的长度，在显示屏中图标交互界面可以左右移动；还可以是：如图2b所示，附图标记21为图标交互界面，附图标记22为显示屏，图标交互界面的宽度大于显示屏的宽度，图标交互界面的长度等于显示屏的长度，在显示屏中图标交互界面可以左右移动。
39.可选的，在另一种可能的实现方式中，本技术的显示场景可以是：如图2c所示，附图标记21为图标交互界面，附图标记22为显示屏，图标交互界面的宽度等于显示屏的宽度，图标交互界面的长度大于显示屏的长度，在显示屏中图标交互界面可以上下移动；还可以是：如图2d所示，附图标记21为图标交互界面，附图标记22为显示屏，图标交互界面的宽度大于显示屏的宽度，图标交互界面的长度大于显示屏的长度，在显示屏中图标交互界面可以上下移动还可以左右移动。
40.可选的，显示屏还可以用于显示虚拟键选择键界面，虚拟键选择键界面包括用于从多个模式中选择目标模式的虚拟操作键。针对步骤s110，在一种可能的实施例中，根据针对多个模式的选择操作确定目标模式，包括：接收针对虚拟操作键的选择操作，从多个模式中确定出目标模式。
41.在该实施例中，虚拟操作键可以包括切换按键(如左右切换按键或上下切换按键)，或者滑动/点击选择键(一长轴上包含多个模块的选择键，可以滑动选择也可以点击选择)等。切换按键方便用户对多个模式进行选择操作。虚拟操作键中还包括确定按键，确定按键用于当用户通过切换按键切换至某一个模式时，再通过该确定按键确认该模式作为目标模式。虚拟操作键还可以是：一个模式对应一个虚拟按键。可选的，在虚拟操作键上，各个模式有其对应的文字或图案。如图3a所示为虚拟操作键的示意图，图中是通过左右切换按键对多个模式进行选择操作。
42.可选的，显示屏中还可以包含其他功能的虚拟操作键，比如应用在灯光模式的场景中，如图3b所示，还可以包括灯光开关键、灯光模式列表键、灯光计时键和灯光音乐键，还可以包括灯光亮度选择条和闪烁速度选择条。
43.在该实施例中，用户可以对虚拟操作键进行选择操作，从而从多个模式中选择出目标模式；电子设备接收用户针对虚拟操作键的选择操作，从多个模式中确定出目标模式，进而在虚拟操作键上显示目标模式对应的文字或图案。
44.可选的，虚拟键选择键界面中关于多个模式的顺序是基于多个模式的排序先后情况确定，比如模式1到模式8是从前往后的映射到可活动子区域，是有一定的排列顺序的，相应的，虚拟操作键中的多个模式也按照该顺序排列。
45.针对步骤s110，在另一种可能的实施例中，根据针对多个模式的选择操作确定目标模式，包括：接收针对图标交互界面中多个模式的图标的选择操作，从多个模式中确定出目标模式。
46.在该实施例中，对于显示屏显示部分图标交互界面的情况，对图标交互界面中多个模式的图标的选择操作存在三种情况。第一种：当目标模式的图标在显示屏的当前交互界面中，用户可以通过一些特定的触发操作选择目标模式的图标，例如：直接点击图标或者长按图标；第二种：当目标模式的图标不在显示屏的当前交互界面，表明目标模式的图标处于隐藏区域(即显示屏之外的区域)，用户可以通过拖拽操作将隐藏区域呈现在显示屏的当前交互界面中，进而在当前交互界面中点击目标模式的图标，完成对多个模式的图标的选择操作。此处，在通过拖拽操作将隐藏区域呈现在显示屏的当前交互界面的过程中，基于拖拽方向假如图标交互界面的边界线越过显示屏的边界线，即显示屏中有部分区域没有显示图标交互界面，那么显示屏中对应部分区域会出现黑屏。为了避免黑屏，可以是对黑屏区域渲染为背景色，还可以是在拖拽操作中当图标交互界面的边界线与显示屏的边界线对齐时不再执行拖拽操作。第三种：当目标模式的图标的一部分在显示屏的当前交互界面中，用户仍然可以通过一些特定的触发操作选择目标模式的图标，无需进行拖拽操作以使目标模式的图标全部显示在显示屏的当前交互界面中，这样设置的好处在于，可以节省模式选择操作的步骤。电子设备接收用户针对图标交互界面中多个模式的图标的选择操作，从多个模式中确定出目标模式。
47.可选的，图标交互界面中包含的图标可以被拖动，图标交互界面也可以被拖拽，便于用户从多个模式中确定出目标模式。
48.针对上述各个可能的实施例，可选的，可活动子区域的划分过程可以是：根据多个模式的数量和图标交互界面的尺寸，确定每个模式对应的可活动子区域的尺寸；基于每个模式对应可活动子区域的尺寸对图标交互界面进行区域划分，得到与多个模式数量相等的多个可活动子区域。这样设置好处在于，可以限定每个图标的活动范围，图标只能在其对应的可活动子区域中随意地或有规律地飘动，便于用户快速确定、查看各个模式对应的图标，也便于快速切换模式。
49.在本技术实施例中，每个模式对应的可活动子区域的尺寸可以通过如下确定方式得到：可选的，根据多个模式的数量对图标交互界面的尺寸进行平均等分，得到每个模式对应的可活动子区域的尺寸，也就是，相邻可活动子区域之间不存在交集区域，且多个可活动子区域占满了整个图标交互界面；优选的，可以在根据多个模式的数量对图标交互界面的
尺寸进行平均等分得到每个模式对应的可活动子区域的尺寸的基础上，将可活动子区域的尺寸进行稍稍扩大一些，如扩大预设尺寸，得到新的可活动子区域的尺寸。也就是，多个可活动子区域中相邻可活动子区域之间存在交集区域，多个可活动子区域是否占满整个图标交互界面取决于交集区域的大小，多个可活动子区域可以占满整个图标交互界面，也可以不占满整个图标交互界面。
50.可选的，可活动子区域可以以可视化方式展示，即用户可以在图标交互界面察觉出可活动子区域的划分区域、尺寸和形状中的至少一项；优选的，可活动子区域可以以隐性(即不可视)方式划分，在图标交互界面中不显示可活动子区域的范围，这样不被用户察觉，但各个图标又存在一定隐性的活动范围。
51.可选的，为每个模式分配对应的可活动子区域的过程可以是：获取多个模式的排序先后情况和多个可活动子区域的排序先后情况；根据多个模式的排序先后情况和多个可活动子区域的排序先后情况，按照先后顺序依次为每个模式分配对应的可活动子区域。
52.s120、从图标交互界面中确定出包含目标模式对应的目标可活动子区域或包含目标模式对应的目标图标的第一交互界面。
53.在本技术实施例中，经上述步骤s110接收用户针对图标交互界面中多个模式的选择操作，从多个模式中确定出目标模式之后，再从图标交互界面中的多个可活动子区域中找到目标模式对应的目标可活动子区域，或者从图标交互界面中找到目标模式对应的目标图标；最后，将包含目标可活动子区域的交互界面作为第一交互界面或者将包含目标图标的交互界面作为第一交互界面。
54.s130、在显示屏显示第一交互界面以及以预设方式突出显示目标图标。
55.在本技术实施例中，经上述步骤s120确定出包含目标模式对应的目标可活动子区域或包含目标模式对应的目标图标的第一交互界面之后，再在显示屏中显示第一交互界面以及以预设方式突出显示目标图标。
56.具体的，以预设方式突出显示目标图标，包括：将目标图标从第一尺寸调整至第二尺寸以突出显示目标图标，第一尺寸为多个模式中未被选中模式的图标尺寸，第二尺寸为多个模式中被选中模式的图标尺寸，第二尺寸大于第一尺寸。
57.在本技术实施例中，当用户从多个模式中确定出目标模式时，对第一尺寸的目标图标进行切割，得到多个碎片图标，以展现出第一尺寸的目标图标爆炸的动画效果，之后再以第二尺寸的目标图标展示目标模式。结合图4a-4d所示，在图4a-4b中当前显示的是模式1(如图中的xxxx1)，与未被选中模式的图标相比，模式1的图标尺寸较大；其中，图4a是通过点击模式2(如图中的xxxx2)的图标选择目标模式；图4b是通过在虚拟操作键中点击切换按键选择模式2(如图中的xxxx2)；在图4c中，将模式1切换为模式2(如图中的xxxx2)，模式2的图标采用爆炸动画效果进行突出显示；在图4d中，在采用爆炸动画效果进行显示之后，再将模式2的图标尺寸进行放大突出显示。
58.另外，图4e中的相机标识的作用是修改模式的图标，假如点击该相机标识便可以显示出模式选择列表。例如，如图4f中，在slow fade模式下，通过点击相机标识修改slow fade的模式图标的情况下，会跳转出包含take photo、choose photo、default photo、cancel的虚拟选择按键，以引导用户通过多个场景选择目标图片或者取消修改模式图标。
59.可以理解的是，除了通过爆炸动画效果以及改变图标尺寸来突出显示目标图标之
外，还可以采用其他的动画效果显示目标图标，例如，改变目标图标的形状，用于与其他未被选中模式的图标进行区分，如未被选中模式的图标是圆形，被选中模式的图标可以是矩形。
60.可选的，本技术不限定模式对应图标的形状和图案，用户可以根据个人喜好对图标的图案可以更换，方便用户更好地区分不同的模式。可选的，假如图标的形状是圆形，在用户选定待更换图案(待更换图案的形状非圆形)的过程中，会帮助用户自动裁剪为圆形图片以适配图标形状。如图4g所示为在用户选定的待更换图案后，对图标的图案进行更换之后的图标图案。
61.本实施例提供的技术方案，先接收用户针对多个模式的选择操作从多个模式中确定目标模式，其中，图标交互界面包括依据多个模式的数量划分的多个可活动子区域，一个模式对应一个可活动子区域，一个模式对应一个图标，可活动子区域用于展示对应模式的图标；再从图标交互界面中确定出包含目标模式对应的目标可活动子区域或包含目标模式对应的目标图标的第一交互界面；最后在显示屏中显示第一交互界面以及以预设方式突出显示目标图标。也就是，当用户选择出目标模式时，电子设备根据目标模式确定待显示的第一交互界面，再对在显示屏中显示第一交互界面以及以预设方式突出显示目标图标。本技术通过为每个目标模式划分对应的可活动子区域，以使目标图标在对应的可活动子区域中飘动，在确定了目标模式时将包含目标模式对应的目标可活动子区域或包含目标模式对应的目标图标的第一交互界面在显示在显示屏中，方便用户精准定位到想要选择的模式；此外，还通过在显示屏中突出显示目标图标，可以提升用户使用智能家居的控制应用软件的交互体验感。
62.下面进一步描述本发明实施例提供的显示方法，图5为本技术实施例提供的一种显示方法的第二流程示意图。本技术实施例是在上述实施例的基础上进行优化，具体优化为：本实施例对确定包含目标模式对应的目标可活动子区域的第一交互界面的过程进行详细的解释说明。
63.参见图5，本实施例的方法包括但不限于如下步骤：
64.s210、根据针对多个模式的选择操作确定目标模式。
65.本步骤的相关内容参见图1实施例的步骤s110，此处不再赘述。
66.s220、从图标交互界面中确定出包含目标模式对应的目标可活动子区域。
67.在本技术实施例中，一个模式对应一个可活动子区域，可以为模式的标识号和对应可活动子区域之间配置对应关系表。当接收到用户针对图标交互界面中多个模式的选择操作，从多个模式中确定出目标模式之后，获取目标模式的标识号，再根据目标模式的标识号从对应关系表中查找该标识号对应的可活动子区域，以便从图标交互界面中的多个可活动子区域中找到目标模式对应的目标可活动子区域。
68.可选的，在确定目标模式之前显示屏当前显示的图标交互界面为第二交互界面。
69.s230、确定第二交互界面中是否包含目标可活动子区域。
70.在本技术实施例中，确定出目标可活动子区域之后，还需确定第二交互界面中是否包含目标可活动子区域。
71.优选的，确定目标可活动子区域是否全部包含在第二交互界面中，若目标可活动子区域全部包含在第二交互界面中，则执行步骤s240；若目标可活动子区域不是全部包含
在第二交互界面中，则执行步骤s250。
72.可选的，确定目标可活动子区域是否部分包含在第二交互界面中，也就是，目标可活动子区域中的一部分包含在第二交互界面的内部。在目标可活动子区域中的一部分包含在第二交互界面内部的情况下，可以设置一个预设百分比，如90％，假如目标可活动子区域的90％及以上区域包含在第二交互界面的内部，认为第二交互界面中包含目标可活动子区域，则执行步骤s240。假如目标可活动子区域包含在第二交互界面内部的区域不足90％，认为第二交互界面不包含目标可活动子区域，则执行步骤s250。
73.另外，预设百分比还可以是95％、80％、50％等，不同百分比会有不同的用户体验。
74.可选的，确定第二交互界面中是否包含目标可活动子区域的过程还可以是：初始时对各可活动子区域有个基准线的标注，具体标注规则可以是，后台可以记录各个可活动子区域的基准线在图标交互界面中的位置，当这个基准线与显示屏的基准线重合时，可以保证该可活动子区域完整显示在显示屏上。
75.s240、在确定第二交互界面中包含目标可活动子区域的情况下，将第二交互界面确定为第一交互界面。
76.在本技术实施例中，在确定第二交互界面中包含目标可活动子区域的情况下，表明目标图标在第二交互界面中，无需对图标交互界面进行移动，此时将第二交互界面确定为第一交互界面。
77.s250、在确定第二交互界面中不包含目标可活动子区域的情况下，则基于显示屏的第一基准线对目标可活动子区域的第二基准线进行平移，直至当前交互界面包含目标可活动子区域时，将当前交互界面确定为第一交互界面。
78.其中，当图标交互界面与显示屏之间的大小关系如图6a或图6b所示时，附图标记21为图标交互界面，附图标记22为显示屏，附图标记23为目标可活动子区域，图标交互界面的移动方向是左右移动，显示屏的第一基准线为宽边中点的垂直延长线，目标可活动子区域的第二基准线为宽边中点的垂直延长线，第二基准线与第一基准线平行。当图标交互界面与显示屏之间的大小关系如图6c所示时，附图标记21为图标交互界面，附图标记22为显示屏，附图标记23为目标可活动子区域，图标交互界面的移动方向是上下移动，显示屏的第一基准线为长边中点的垂直延长线，目标可活动子区域的第二基准线为长边中点的垂直延长线，第二基准线与第一基准线平行。当图标交互界面与显示屏之间的大小关系如图2d所示时，图标交互界面的移动方向可以是左右移动，也可以是上下移动；显示屏的第一基准线可以是宽边中点的垂直延长线，也可以是长边中点的垂直延长线，第二基准线与第一基准线平行。
79.在本技术实施例中，在确定第二交互界面中包含目标可活动子区域的情况下，则从所述图标交互界面中确定出包含所述目标可活动子区域的所述第一交互界面。具体为：基于显示屏的第一基准线对目标可活动子区域的第二基准线进行平移，从而对目标可活动子区域的位置进行调整得到新位置，直至当前交互界面包含目标可活动子区域时，或者直至第一基准线与第二基准线重合时，将当前交互界面确定为第一交互界面。
80.需要说明的是，假若第一基准线与第二基准线重合时，基于平移方向图标交互界面的边界线越过显示屏的边界线，即显示屏中有部分区域没有显示图标交互界面，那么显示屏中对应部分区域会出现黑屏。为了避免黑屏，可以是对黑屏区域渲染为背景色，还可以
是在平移操作中当图标交互界面的边界线与显示屏的边界线对齐时不再执行平移操作，也就是，第一基准线与第二基准线可以不重合。
81.s260、在显示屏显示第一交互界面以及以预设方式突出显示目标图标。
82.本步骤的相关内容参见图1实施例的步骤s130，此处不再赘述。
83.本实施例提供的技术方案，通过接收用户针对多个模式的选择操作从多个模式中确定目标模式；从图标交互界面中确定出包含目标模式对应的目标可活动子区域；确定第二交互界面中是否包含目标可活动子区域；在确定第二交互界面中包含目标可活动子区域的情况下，将第二交互界面确定为第一交互界面；在确定第二交互界面中不包含目标可活动子区域的情况下，则基于显示屏的第一基准线对目标可活动子区域的第二基准线进行平移，直至当前交互界面包含目标可活动子区域时，将当前交互界面确定为第一交互界面；在显示屏显示第一交互界面以及以预设方式突出显示目标图标。本技术通过判断目标可活动子区域是否包含在第二交互界面中，若是，则将第二交互界面确定为第一交互界面，若否，则基于显示屏的第一基准线对目标可活动子区域的位置进行调整，从而确定待显示的第一交互界面。执行本技术技术方案，可以方便用户精准定位到想要选择的模式，可以提升用户使用智能家居的控制应用软件的交互体验感。
84.下面进一步描述本发明实施例提供的显示方法，图7为本技术实施例提供的一种显示方法的第三流程示意图。本技术实施例是在上述实施例的基础上进行优化，具体优化为：本实施例对确定包含目标模式对应的目标图标的第一交互界面的过程进行详细的解释说明。
85.参考图7，本实施例的方法包括但不限于如下步骤：
86.s310、根据针对多个模式的选择操作确定目标模式。
87.本步骤的相关内容参见图1实施例的步骤s110，此处不再赘述。
88.s320、从图标交互界面中确定出目标模式对应的目标图标。
89.在本技术实施例中，一个模式对应一个图标，可以为模式的标识号和对应图标之间配置对应关系表。当接收到用户针对图标交互界面中多个模式的选择操作，从多个模式中确定出目标模式之后，获取目标模式的标识号，再根据目标模式的标识号从对应关系表中查找该标识号对应的图标，以便从图标交互界面中确定出目标模式对应的目标图标。
90.可选的，在确定目标模式之前显示屏当前显示的图标交互界面为第二交互界面。
91.s330、确定第二交互界面中是否包含目标图标。
92.在本技术实施例中，确定出目标可活动子区域之后，还需确定第二交互界面中是否包含目标图标。若第二交互界面中包含目标图标，则执行步骤s340；若第二交互界面中不包含目标图标，则执行步骤s350。
93.优选的，确定第二交互界面中是否包含目标图标可以是确定目标图标是否全部包含在第二交互界面中，若目标图标全部包含在第二交互界面中，则执行步骤s340；若目标图标不是全部包含在第二交互界面中，则执行步骤s350。
94.可选的，确定第二交互界面中是否包含目标图标可以是确定目标图标是否部分包含在第二交互界面中，也就是，目标图标中的一部分包含在第二交互界面的内部。在目标图标中的一部分包含在第二交互界面内部的情况下，可以设置一个预设百分比，如90％，假如目标图标的90％及以上区域包含在第二交互界面的内部，认为第二交互界面中包含目标图
标，则执行步骤s340。假如目标图标包含在第二交互界面内部的区域不足20％，认为第二交互界面不包含目标图标，则执行步骤s350。
95.可选的，当目标图标的大于20％且小于90％的区域包含在第二交互界面的内部，还需要判断在预设时间内(如两秒)，目标图标是否能够出现在第二交互界面中，若能，则认为第二交互界面中包含目标图标，执行步骤s340。示例性的，模式的图标可以是气泡，气泡是可以随意地或有规律地在对应可活动子区域中飘动。假如当前时刻目标图标的20％-90％包含在第二交互界面的内部，此时，还需要判断在预设时间内(如两秒)，目标图标是否能够飘动在第二交互界面中，若能，则认为第二交互界面中包含目标图标，执行步骤s340。
96.s340、在确定第二交互界面中包含目标图标的情况下，将第二交互界面确定为第一交互界面。
97.在本技术实施例中，在确定第二交互界面中包含目标图标的情况下，表明目标图标在第二交互界面中，无需对图标交互界面进行移动，此时将第二交互界面确定为第一交互界面。
98.s350、在确定第二交互界面中不包含目标图标的情况下，获取目标图标在图标交互界面中的第一位置，基于第一位置和预设移动方向确定目标图标的第三基准线。
99.在本技术实施例中，预设移动方向是指图标交互界面的移动方向，当移动方向是左右移动时，第三基准线是目标图标的宽边中点的垂直延长线；当移动方向是上下移动时，第三基准线是目标图标的长边中点的垂直延长线。
100.s360、基于显示屏的第一基准线对第三基准线进行平移，直至当前交互界面中包含目标图标时，将当前交互界面确定为第一交互界面。
101.在本技术实施例中，基于显示屏的第一基准线对目标图标的第三基准线进行平移，从而对目标图标的位置进行调整得到新位置，直至当前交互界面包含目标图标时，或者直至第一基准线与第三基准线重合时，将当前交互界面确定为第一交互界面。
102.需要说明的是，假若第一基准线与第三基准线重合时，基于平移方向图标交互界面的边界线越过显示屏的边界线，即显示屏中有部分区域没有显示图标交互界面，那么显示屏中对应部分区域会出现黑屏。为了避免黑屏，可以是对黑屏区域渲染为背景色，还可以是在平移操作中当图标交互界面的边界线与显示屏的边界线对齐时不再执行平移操作，也就是，第一基准线与第三基准线可以不重合。
103.可以理解的是，在基于显示屏的第一基准线对目标图标的第三基准线进行平移的过程中，目标图标的新位置不可遮挡其他模式的图标。
104.s370、在显示屏显示第一交互界面以及以预设方式突出显示目标图标。
105.本步骤的相关内容参见图1实施例的步骤s130，此处不再赘述。
106.本实施例提供的技术方案，通过接收用户针对多个模式的选择操作从多个模式中确定目标模式；从图标交互界面中确定出目标模式对应的目标图标；确定第二交互界面中是否包含目标图标；在确定第二交互界面中包含目标图标的情况下，将第二交互界面确定为第一交互界面；在确定第二交互界面中不包含目标图标的情况下，获取目标图标在图标交互界面中的第一位置，基于第一位置和预设移动方向确定目标图标的第三基准线；基于显示屏的第一基准线对第三基准线进行平移，直至当前交互界面中包含目标图标时，将当前交互界面确定为第一交互界面；在显示屏显示第一交互界面以及以预设方式突出显示目
标图标。本技术通过判断目标图标是否包含在第二交互界面中，若是，则将第二交互界面确定为第一交互界面，若否，则基于第一位置和预设移动方向对目标图标的位置进行调整，从而确定待显示的第一交互界面。执行本技术技术方案，可以方便用户精准定位到想要选择的模式，可以提升用户使用智能家居的控制应用软件的交互体验感。
107.在另一种实施方式中，在确定第二交互界面中不包含目标图标的情况下，则从图标交互界面中确定出包含目标图标的第一交互界面，包括：获取目标图标在图标交互界面中的第一位置；将目标图标从第一位置移动至第二交互界面中的目标区域，并在移动后将当前交互界面确定为第一交互界面。其中，目标区域可以是第二交互界面中的空白区域，还可以是第二交互界面中上次目标图标的位置。结合图8a-8b所示，附图标记21为图标交互界面，附图标记22为显示屏，图中展示了目标图标不包含在第二交互界面中，将目标图标从第一位置移动至第二交互界面中的目标区域，目标区域是第二交互界面中的空白区域。
108.在上述实施例中为每个模式分配对应的可活动子区域之后，还存储了模式与可活动子区域之间的映射关系。在将目标图标从第一位置移动至目标区域的情况下，该映射关系需要对应调整，以举例说明：移动图标a；将移动后的存在两个图标的可活动子区域中，原有的图标移动至隔壁可活动子区域，以此类推，直至隔壁可活动子区域为图标a对应的可活动子区域。
109.图9为本技术实施例提供的一种显示装置的结构示意图，如图9所示，该装置400集成在电子设备中，电子设备包括显示屏，显示屏可用于显示部分或者全部图标交互界面，该装置400可以包括：
110.模式确定模块410，用于根据针对多个模式的选择操作确定目标模式，其中，所述图标交互界面包括依据所述多个模式的数量划分的多个可活动子区域，一个模式对应一个可活动子区域，一个模式对应一个图标，所述可活动子区域用于展示对应模式的图标；
111.界面确定模块420，用于从所述图标交互界面中确定出包含所述目标模式对应的目标可活动子区域或包含所述目标模式对应的目标图标的第一交互界面；
112.界面显示模块430，用于在所述显示屏显示所述第一交互界面以及以预设方式突出显示所述目标图标。
113.可选的，所述显示屏还用于显示虚拟键选择键界面，所述虚拟键选择键界面包括用于从多个模式中选择目标模式的虚拟操作键。
114.进一步的，上述模式确定模块410，可以具体用于：接收针对所述虚拟操作键的选择操作，从所述多个模式中确定出目标模式。
115.进一步的，上述模式确定模块410，可以具体用于：接收针对所述图标交互界面中多个模式的图标的选择操作，从所述多个模式中确定出目标模式。
116.可选的，在确定所述目标模式之前所述显示屏当前显示的图标交互界面为第二交互界面。
117.进一步的，上述界面确定模块420可以包括：第一界面确定单元和第二界面确定单元。
118.所述第一界面确定单元，用于确定所述第二交互界面中是否包含所述目标可活动子区域；在确定所述第二交互界面中包含所述目标可活动子区域的情况下，将所述第二交互界面确定为所述第一交互界面；在确定所述第二交互界面中不包含所述目标可活动子区
域的情况下，则从所述图标交互界面中确定出包含所述目标可活动子区域的所述第一交互界面。
119.所述第一界面确定单元，可以具体用于基于所述显示屏的第一基准线对所述目标可活动子区域的第二基准线进行平移，直至当前交互界面包含所述目标可活动子区域时，将所述当前交互界面确定为所述第一交互界面。
120.所述第二界面确定单元，用于确定所述第二交互界面中是否包含所述目标图标；在确定所述第二交互界面中包含所述目标图标的情况下，将所述第二交互界面确定为所述第一交互界面；在确定所述第二交互界面中不包含所述目标图标的情况下，从所述图标交互界面中确定出包含所述目标图标的所述第一交互界面。
121.所述第二界面确定单元，可以具体用于获取所述目标图标在所述图标交互界面中的第一位置；基于所述第一位置和预设移动方向确定所述目标图标的第三基准线；基于所述显示屏的第一基准线对所述第三基准线进行平移，直至当前交互界面中包含所述目标图标时，将所述当前交互界面确定为所述第一交互界面。
122.所述第二界面确定单元，还可以具体用于获取所述目标图标在所述图标交互界面中的第一位置；将所述目标图标从所述第一位置移动至所述第二交互界面中的目标区域，并在移动后将当前交互界面确定为所述第一交互界面。
123.进一步的，上述界面显示模块430，可以具体用于：将所述目标图标从第一尺寸调整至第二尺寸以突出显示所述目标图标，所述第一尺寸为所述多个模式中未被选中模式的图标尺寸，所述第二尺寸为所述多个模式中被选中模式的图标尺寸。
124.进一步的，上述显示装置，还可以包括：区域划分模块；
125.所述区域划分模块，用于根据所述多个模式的数量和所述图标交互界面的尺寸，确定每个模式对应的可活动子区域的尺寸；基于所述每个模式对应可活动子区域的尺寸对所述图标交互界面进行区域划分，得到与所述多个模式数量相等的多个可活动子区域，所述多个可活动子区域中相邻可活动子区域之间存在交集区域。
126.进一步的，上述显示装置，还可以包括：模式分配模块；
127.所述模式分配模块，用于获取所述多个模式的排序先后情况和所述多个可活动子区域的排序先后情况；根据所述多个模式的排序先后情况和所述多个可活动子区域的排序先后情况，按照先后顺序依次为每个模式分配对应的可活动子区域。
128.可选的，所述虚拟键选择键界面中关于所述多个模式的顺序是基于所述多个模式的排序先后情况确定。
129.本实施例提供的显示装置可适用于上述任意实施例提供的显示方法，具备相应的功能和有益效果。
130.图10是用来实现本技术实施例的一种显示方法的电子设备的框图。电子设备10旨在表示各种形式的数字计算机，诸如，膝上型计算机、台式计算机、工作台、个人数字助理、服务器、刀片式服务器、大型计算机、和其它适合的计算机。电子设备还可以表示各种形式的移动装置，诸如，个人数字处理、蜂窝电话、智能电话、可穿戴设备(如头盔、眼镜、手表等)和其它类似的计算装置。本文所示的部件、它们的连接和关系、以及它们的功能仅仅作为示例，并且不意在限制本文中描述的和/或者要求的本技术的实现。
131.如图10所示，电子设备10包括至少一个处理器11，以及与至少一个处理器11通信
连接的存储器，如只读存储器(rom)12、随机访问存储器(ram)13等，其中，存储器存储有可被至少一个处理器执行的计算机程序，处理器11可以根据存储在只读存储器(rom)12中的计算机程序或者从存储单元18加载到随机访问存储器(ram)13中的计算机程序，来执行各种适当的动作和处理。在ram 13中，还可存储电子设备10操作所需的各种程序和数据。处理器11、rom 12以及ram 13通过总线14彼此相连。输入/输出(i/o)接口15也连接至总线14。
132.电子设备10中的多个部件连接至i/o接口15，包括：输入单元16，例如键盘、鼠标等；输出单元17，例如各种类型的显示器、扬声器等；存储单元18，例如磁盘、光盘等；以及通信单元19，例如网卡、调制解调器、无线通信收发机等。通信单元19允许电子设备10通过诸如因特网的计算机网络和/或各种电信网络与其他设备交换信息/数据。
133.处理器11可以是各种具有处理和计算能力的通用和/或专用处理组件。处理器11的一些示例包括但不限于中央处理单元(cpu)、图形处理单元(gpu)、各种专用的人工智能(ai)计算芯片、各种运行机器学习模型算法的处理器、数字信号处理器(dsp)、以及任何适当的处理器、控制器、微控制器等。处理器11执行上文所描述的各个方法和处理，例如显示方法。
134.在一些实施例中，显示方法可被实现为计算机程序，其被有形地包含于计算机可读存储介质，例如存储单元18。在一些实施例中，计算机程序的部分或者全部可以经由rom 12和/或通信单元19而被载入和/或安装到电子设备10上。当计算机程序加载到ram 13并由处理器11执行时，可以执行上文描述的显示方法的一个或多个步骤。备选地，在其他实施例中，处理器11可以通过其他任何适当的方式(例如，借助于固件)而被配置为执行显示方法。
135.本文中以上描述的系统和技术的各种实施方式可以在数字电子电路系统、集成电路系统、场可编程门阵列(fpga)、专用集成电路(asic)、专用标准产品(assp)、芯片上系统的系统(soc)、负载可编程逻辑设备(cpld)、计算机硬件、固件、软件、和/或它们的组合中实现。这些各种实施方式可以包括：实施在一个或者多个计算机程序中，该一个或者多个计算机程序可在包括至少一个可编程处理器的可编程系统上执行和/或解释，该可编程处理器可以是专用或者通用可编程处理器，可以从存储系统、至少一个输入装置、和至少一个输出装置接收数据和指令，并且将数据和指令传输至该存储系统、该至少一个输入装置、和该至少一个输出装置。
136.用于实施本技术的方法的计算机程序可以采用一个或多个编程语言的任何组合来编写。这些计算机程序可以提供给通用计算机、专用计算机或其他可编程数据处理装置的处理器，使得计算机程序当由处理器执行时使流程图和/或框图中所规定的功能/操作被实施。计算机程序可以完全在机器上执行、部分地在机器上执行，作为独立软件包部分地在机器上执行且部分地在远程机器上执行或完全在远程机器或服务器上执行。
137.在本技术的上下文中，计算机可读存储介质可以是有形的介质，其可以包含或存储以供指令执行系统、装置或设备使用或与指令执行系统、装置或设备结合地使用的计算机程序。计算机可读存储介质可以包括但不限于电子的、磁性的、光学的、电磁的、红外的、或半导体系统、装置或设备，或者上述内容的任何合适组合。备选地，计算机可读存储介质可以是机器可读信号介质。机器可读存储介质的更具体示例会包括基于一个或多个线的电气连接、便携式计算机盘、硬盘、随机存取存储器(ram)、只读存储器(rom)、可擦除可编程只读存储器(eprom或快闪存储器)、光纤、便捷式紧凑盘只读存储器(cd-rom)、光学储存设备、
磁储存设备、或上述内容的任何合适组合。
138.为了提供与用户的交互，可以在电子设备上实施此处描述的系统和技术，该电子设备具有：用于向用户显示信息的显示装置(例如，crt(阴极射线管)或者lcd(液晶显示器)监视器)；以及键盘和指向装置(例如，鼠标或者轨迹球)，用户可以通过该键盘和该指向装置来将输入提供给电子设备。其它种类的装置还可以用于提供与用户的交互；例如，提供给用户的反馈可以是任何形式的传感反馈(例如，视觉反馈、听觉反馈、或者触觉反馈)；并且可以用任何形式(包括声输入、语音输入或者、触觉输入)来接收来自用户的输入。
139.可以将此处描述的系统和技术实施在包括后台部件的计算系统(例如，作为数据服务器)、或者包括中间件部件的计算系统(例如，应用服务器)、或者包括前端部件的计算系统(例如，具有图形用户界面或者网络浏览器的用户计算机，用户可以通过该图形用户界面或者该网络浏览器来与此处描述的系统和技术的实施方式交互)、或者包括这种后台部件、中间件部件、或者前端部件的任何组合的计算系统中。可以通过任何形式或者介质的数字数据通信(例如，通信网络)来将系统的部件相互连接。通信网络的示例包括：局域网(lan)、广域网(wan)、区块链网络和互联网。
140.计算系统可以包括客户端和服务器。客户端和服务器一般远离彼此并且通常通过通信网络进行交互。通过在相应的计算机上运行并且彼此具有客户端-服务器关系的计算机程序来产生客户端和服务器的关系。服务器可以是云服务器，又称为云计算服务器或云主机，是云计算服务体系中的一项主机产品，以解决了传统物理主机与vps服务中，存在的管理难度大，业务扩展性弱的缺陷。
141.应该理解，可以使用上面所示的各种形式的流程，重新排序、增加或删除步骤。例如，本技术中记载的各步骤可以并行地执行也可以顺序地执行也可以不同的次序执行，只要能够实现本技术的技术方案所期望的结果，本文在此不进行限制。
142.上述具体实施方式，并不构成对本技术保护范围的限制。本领域技术人员应该明白的是，根据设计要求和其他因素，可以进行各种修改、组合、子组合和替代。任何在本技术的精神和原则之内所作的修改、等同替换和改进等，均应包含在本技术保护范围之内。