控件配置方法、装置、计算机可读介质及电子设备与流程

1.本技术涉及计算机及前端显示技术领域，具体而言，涉及一种控件配置方法、装置、计算机可读介质及电子设备。


背景技术：

2.在控件配置的应用场景中，比如，在配置显示控件的应用场景中，通常是将各个控件直接排列显示在界面中，然而，这样的做法使得界面内控件的形式和排列方式相对固定，并不能满足用户对控件配置灵活性和控件显示友好性的双重需求，基于此，如何提高界面中控件配置的灵活性和控件显示友好性是亟待解决的技术问题。


技术实现要素：

3.本技术的实施例提供了一种控件配置方法、装置、计算机程序产品或计算机程序、计算机可读介质及电子设备，进而至少在一定程度上可以提高界面中控件配置的灵活性。
4.本技术的其他特性和优点将通过下面的详细描述变得显然，或部分地通过本技术的实践而习得。
5.根据本技术实施例的一个方面，提供了一种控件配置方法，所述方法包括：获取待配置控件的控件个数；获取目标图像，并在所述目标图像中确定与所述控件个数相匹配的控件绑定区域；在所述目标图像的各个控件绑定区域中配置所述待配置控件。
6.根据本技术实施例的一个方面，提供了一种控件配置装置，所述装置包括：第一获取单元，被用于获取待配置控件的控件个数；第二获取单元，被用于获取目标图像，并在所述目标图像中确定与所述控件个数相匹配的控件绑定区域；配置单元，被用于在所述目标图像的各个控件绑定区域中配置所述待配置控件。
7.在本技术的一些实施例中，基于前述方案，所述装置还包括：确定单元，被用于在获取待配置控件的控件个数之前，响应于针对界面内原始控件的选定操作，将选定的原始控件确定为所述待配置控件。
8.在本技术的一些实施例中，基于前述方案，所述第二获取单元配置为：获取第一待选图像，并确定所述第一待选图像的至少一个图像参数；基于所述第一待选图像的至少一个图像参数，从所述第一待选图像中确定所述目标图像。
9.在本技术的一些实施例中，基于前述方案，所述图像参数包括图像尺寸，所述第二获取单元配置为：从所述第一待选图像中确定第二待选图像，所述第二待选图像的图像尺寸与所述待配置控件所在界面区域的尺寸相匹配；从所述第二待选图像中确定所述目标图像。
10.在本技术的一些实施例中，基于前述方案，所述图像参数包括图像分辨率，所述第二获取单元配置为：从所述第一待选图像中确定所述图像分辨率超过第一预定阈值的图像，得到第三待选图像；从所述第三待选图像中确定所述目标图像。
11.在本技术的一些实施例中，基于前述方案，所述第二获取单元配置为：获取所述目
标图像中各个像素单元的像素值；基于所述目标图像中各个像素单元的像素值，在所述目标图像中确定与所述控件个数相匹配的控件绑定区域。
12.在本技术的一些实施例中，基于前述方案，所述第二获取单元配置为：在所述目标图像中确定与所述控件个数相匹配的待选区域，并计算各个待选区域中像素单元的像素值标准差；在存在至少一个待选区域对应的像素值标准差超过第二预定阈值时，更新各个待选区域的区域边界，直至所述各个待选区域对应的像素值标准差低于所述第二预定阈值；将所述像素值标准差低于所述第二预定阈值的待选区域确定为所述控件绑定区域。
13.在本技术的一些实施例中，基于前述方案，所述第二获取单元配置为：在所述目标图像中确定像素分界点，所述像素分界点的相邻像素单元之间的像素值差值超过第三预定阈值；基于各个像素分界点在所述目标图像中的位置，在所述目标图像中确定颜色区分边界；在所述目标图像中确定由所述颜色区分边界限制的与所述控件个数相匹配的控件绑定区域。
14.在本技术的一些实施例中，基于前述方案，，所述第二获取单元配置为：响应于在所述目标图像中的勾勒操作，获取在所述目标图像中的勾勒轨迹；在所述目标图像中确定由所述勾勒轨迹限制的与所述控件个数相匹配的控件绑定区域。
15.在本技术的一些实施例中，基于前述方案，所述配置单元配置为：获取与各个所述待配置控件对应的控件事件，所述控件事件用于实现控件功能；建立所述控件事件与所述控件绑定区域之间的绑定关系；基于所述绑定关系，在所述目标图像的各个控件绑定区域中配置所述待配置控件。
16.在本技术的一些实施例中，基于前述方案，所述装置还包括：触发单元，被用于在基于所述绑定关系，在所述目标图像的各个控件绑定区域中配置所述待配置控件之后，在检测到针对所述目标图像中的任意一个控件绑定区域的点击操作时，触发绑定在所述任意一个控件绑定区域的控件事件；执行单元，被用于基于所述控件事件，执行与所述控件事件相对应的程序指令。
17.在本技术的一些实施例中，基于前述方案，所述装置还包括：渲染单元，被用于在所述目标图像的各个控件绑定区域中配置所述待配置控件之后，基于所述待配置控件所在界面区域的背景颜色，渲染所述目标图像的背景颜色，并将所述目标图像配置在所述待配置控件所在界面区域。
18.根据本技术实施例的一个方面，提供了一种计算机程序产品或计算机程序，该计算机程序产品或计算机程序包括计算机指令，该计算机指令存储在计算机可读存储介质中。电子设备的处理器从计算机可读存储介质读取该计算机指令，处理器执行该计算机指令，使得该电子设备执行上述实施例中所述的控件配置方法。
19.根据本技术实施例的一个方面，提供了一种计算机可读介质，其上存储有计算机程序，所述计算机程序被处理器执行时实现如上述实施例中所述的控件配置方法。
20.根据本技术实施例的一个方面，提供了一种电子设备，包括：一个或多个处理器；存储装置，用于存储一个或多个程序，当所述一个或多个程序被所述一个或多个处理器执行时，使得所述一个或多个处理器实现如上述实施例中所述的控件配置方法。
21.在本技术的一些实施例所提供的技术方案中，基于获取的待配置控件的控件个数，在目标图像中确定与所述控件个数相匹配的控件绑定区域，并将所述待配置控件配置
在所述目标图像的各个控件绑定区域中。一方面，可以根据实际需要在目标图像中配置待配置控件，提高了在界面中进行控件配置的灵活性。另一方面，在图像中配置控件，能够增强控件显示的友好性。
22.应当理解的是，以上的一般描述和后文的细节描述仅是示例性和解释性的，并不能限制本技术。
附图说明
23.此处的附图被并入说明书中并构成本说明书的一部分，示出了符合本技术的实施例，并与说明书一起用于解释本技术的原理。显而易见地，下面描述中的附图仅仅是本技术的一些实施例，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据这些附图获得其他的附图。在附图中：
24.图1示出了可以应用本技术实施例的技术方案的示例性硬件环境的示意图；
25.图2示出了根据本技术一个实施例的控件配置方法的流程图；
26.图3示出了根据本技术一个实施例的获取目标图像的细节流程图；
27.图4示出了根据本技术一个实施例的在所述目标图像中确定与所述控件个数相匹配的控件绑定区域的细节流程图；
28.图5示出了根据本技术一个实施例的在所述目标图像中确定与所述控件个数相匹配的控件绑定区域的细节流程图；
29.图6示出了根据本技术一个实施例的在所述目标图像中确定与所述控件个数相匹配的控件绑定区域的界面演示图；
30.图7示出了根据本技术一个实施例的在所述目标图像中确定与所述控件个数相匹配的控件绑定区域的细节流程图；
31.图8示出了根据本技术一个实施例的在所述目标图像中确定与所述控件个数相匹配的控件绑定区域的界面演示图；
32.图9示出了根据本技术一个实施例的在所述目标图像中确定与所述控件个数相匹配的控件绑定区域的细节流程图；
33.图10示出了根据本技术一个实施例的在所述目标图像中确定与所述控件个数相匹配的控件绑定区域的界面演示图；
34.图11示出了根据本技术一个实施例的在所述目标图像的各个控件绑定区域中配置所述待配置控件的细节流程图；
35.图12示出了根据本技术一个实施例的将所述目标图像配置在所述待配置控件所在界面区域的界面演示图；
36.图13示出了根据本技术一个实施例的控件配置装置的框图；
37.图14示出了适于用来实现本技术实施例的电子设备的计算机系统的结构示意图。
具体实施方式
38.现在将参考附图更全面地描述示例实施方式。然而，示例实施方式能够以多种形式实施，且不应被理解为限于在此阐述的范例；相反，提供这些实施方式使得本技术将更加全面和完整，并将示例实施方式的构思全面地传达给本领域的技术人员。
39.此外，所描述的特征、结构或特性可以以任何合适的方式结合在一个或更多实施例中。在下面的描述中，提供许多具体细节从而给出对本技术的实施例的充分理解。然而，本领域技术人员将意识到，可以实践本技术的技术方案而没有特定细节中的一个或更多，或者可以采用其它的方法、组元、装置、步骤等。在其它情况下，不详细示出或描述公知方法、装置、实现或者操作以避免模糊本技术的各方面。
40.附图中所示的方框图仅仅是功能实体，不一定必须与物理上独立的实体相对应。即，可以采用软件形式来实现这些功能实体，或在一个或多个硬件模块或集成电路中实现这些功能实体，或在不同网络和/或处理器装置和/或微控制器装置中实现这些功能实体。
41.附图中所示的流程图仅是示例性说明，不是必须包括所有的内容和操作/步骤，也不是必须按所描述的顺序执行。例如，有的操作/步骤还可以分解，而有的操作/步骤可以合并或部分合并，因此实际执行的顺序有可能根据实际情况改变。
42.需要说明的是：在本文中提及的“多个”是指两个或两个以上。“和/或”描述关联对象的关联关系，表示可以存在三种关系，例如，a和/或b可以表示：单独存在a，同时存在a和b，单独存在b这三种情况。字符“/”一般表示前后关联对象是一种“或”的关系。
43.需要注意的是，本技术的说明书和权利要求书及上述附图中的术语“第一”、“第二”等是用于区别类似的对象，而不必用于描述特定的顺序或先后次序。应该理解这样使用的对象在适当情况下可以互换，以便这里描述的本技术的实施例能够以除了在图示或描述的那些以外的顺序实施。
44.图1示出了可以应用本技术实施例的技术方案的示例性硬件环境的示意图。
45.如图1所示，本技术实施例的技术方案的实施环境可以包括终端设备。例如，包括如图1中所示智能手机101、平板电脑102、触摸显示器103和便携式计算机104中的任意一种，当然也可以是其它具有触摸或非触摸显示功能的电子设备等等。
46.在本技术的一个实施例中，用户可以利用具有触摸或非触摸显示功能的智能手机实施本技术实施例的技术方案，例如图1中所示的智能手机101。具体的，所述智能手机的屏幕可以显示界面，且在所述屏幕显示的界面中可以进行控件配置。
47.在本实施例中，如图1所示的任意一个终端设备可以获取待配置控件的控件个数和目标图像，并在所述目标图像中确定与所述控件个数相匹配的控件绑定区域，然后，在所述目标图像的各个控件绑定区域中配置所述待配置控件。
48.在本实施例中，通过将待配置控件配置在目标图像的各个控件绑定区域中，可以提高界面中控件配置的灵活性，同时增强控件显示的友好性。
49.以下对本技术实施例的技术方案的实现细节进行详细阐述：
50.图2示出了根据本技术一个实施例的控件配置方法的流程图，该控件配置方法可以由具有计算处理功能的设备来执行，比如可以由图1中所示的终端设备来执行。参照图2所示，该控件配置方法至少包括步骤220至步骤260，详细介绍如下：
51.在步骤220中，获取待配置控件的控件个数。
52.在本技术中，控件是指可在界面上放置的可视化图形“元件”，如按钮、文件编辑框等。控件具有执行功能或通过“事件”引发代码运行并完成响应的功能。
53.在步骤220之前的一个实施例中，即在获取待配置控件的控件个数之前，可以通过如下方式确定待配置控件，即，响应于针对界面内原始控件的选定操作，将选定的原始控件
确定为所述待配置控件。
54.在一个具体场景下，可以是用户通过在界面中的触控操作，在界面中选择至少一个原始控件(即界面中存在的控件)，并将选择的原始控件确定为待配置控件。
55.在此场景下，触控操作可以是滑动界面中原始控件，长按界面中原始控件，以及连续点击界面中原始控件中的任意一种。
56.在本实施例中，在界面中将原始控件确定为待配置控件之后，可以直接对待配置控件进行计数，从而获取待配置控件的控件个数。
57.在本实施例中，用户通过在界面中的触控操作，在界面中选择至少一个原始控件作为待配置控件，其好处在于，可以增强在控件配置过程中用户与界面之间的交互性，从而提高用户体验。
58.继续参照图2，在步骤240中，获取目标图像，并在所述目标图像中确定与所述控件个数相匹配的控件绑定区域。
59.在步骤240的一个实施例中，获取目标图像，可以是获取事先准备好的目标图像，或者是获取由用户选定的目标图像。
60.在步骤240的另一个实施例中，获取目标图像，也可以是从多个待选图像中获取目标图像。
61.在本实施例中，从多个待选图像中获取目标图像，可以按照如图3所示的步骤执行。
62.参见图3，示出了根据本技术一个实施例的获取目标图像的细节流程图。具体包括步骤241至步骤242：
63.在步骤241中，获取第一待选图像，并确定所述第一待选图像的至少一个图像参数。
64.在步骤242中，基于所述第一待选图像的至少一个图像参数，从所述第一待选图像中确定所述目标图像。
65.在本实施例中，所述图像参数包括图像尺寸，或者包括图像分辨率，还或者同时包括图像尺寸和图像分辨率。
66.在所述图像参数包括图像尺寸时，所述基于所述第一待选图像的至少一个图像参数，从所述第一待选图像中确定所述目标图像，可以通过执行如下步骤实现：
67.步骤一，从所述第一待选图像中确定第二待选图像，所述第二待选图像的图像尺寸与所述待配置控件所在界面区域的尺寸相匹配。
68.步骤二，从所述第二待选图像中确定所述目标图像。
69.在本实施例中，从所述第二待选图像中确定所述目标图像，可以是从所述第二待选图像中随机选定一个图像作为目标图像，也可以是由用户在所述第二待选图像中选择一个图像作为目标图像。
70.在本实施例中，以图像尺寸作为参数在第一待选图像中筛选出第二待选图像，其好处在于，在后续的控件配置过程中，可以使得图像更流畅的嵌入到待配置控件所在界面区域中，从而提高控件配置效率。
71.在所述图像参数包括图像分辨率时，所述基于所述第一待选图像的至少一个图像参数，从所述第一待选图像中确定所述目标图像，可以通过执行如下步骤实现：
72.步骤一，从所述第一待选图像中确定所述图像分辨率超过第一预定阈值的图像，得到第三待选图像。
73.步骤二，从所述第三待选图像中确定所述目标图像。
74.在本实施例中，从所述第三待选图像中确定所述目标图像，可以是将图像分辨率最高的第三待选图像作为目标图像，也可以是从所述第三待选图像中随机选定一个图像作为目标图像，还可以是由用户在所述第三待选图像中选择一个图像作为目标图像。
75.在本实施例中，以图像分辨率作为参数在第一待选图像中筛选出第三待选图像，其好处在于，在后续的控件配置过程中，可以防止目标图像在界面中显示时失真严重，从而使得目标图像在界面中的显示效果更加清晰，提高控件配置质量。
76.在所述图像参数同时包括图像尺寸和图像分辨率，所述基于所述第一待选图像的至少一个图像参数，从所述第一待选图像中确定所述目标图像，可以通过执行如下步骤实现：
77.步骤一，从所述第一待选图像中确定第二待选图像，所述第二待选图像的图像尺寸与所述待配置控件所在界面区域的尺寸相匹配；
78.步骤二，从所述第二待选图像中确定所述图像分辨率超过第一预定阈值的图像，得到第三待选图像；
79.步骤三，从所述第三待选图像中确定所述目标图像。
80.在本实施例中，同时以图像尺寸和图像分辨率作为参数在第一待选图像中筛选出第三待选图像，其好处在于，在后续的控件配置过程中，可以既保证提高控件配置效率，又保证提高控件配置质量。
81.在本技术中，在所述目标图像中确定与所述控件个数相匹配的控件绑定区域，即在所述目标图像中确定与所述控件个数具有相同数量的控件绑定区域，例如，控件个数为4个，则需要在目标图像中确定4个控件绑定区域。
82.在步骤240的一个实施例中，在所述目标图像中确定与所述控件个数相匹配的控件绑定区域，可以按照如图4所示的步骤执行。
83.参见图4，示出了根据本技术一个实施例的在所述目标图像中确定与所述控件个数相匹配的控件绑定区域的细节流程图。具体包括步骤243至步骤244：
84.在步骤243中，获取所述目标图像中各个像素单元的像素值。
85.在步骤244中，基于所述目标图像中各个像素单元的像素值，在所述目标图像中确定与所述控件个数相匹配的控件绑定区域。
86.在本技术中，目标图像中各个像素单元的像素值决定目标图像的颜色分布，因此，基于像素值在目标图像中确定控件绑定区域，可以确定得到由颜色区域反映的控件绑定区域，使得在后续的控件配置过程中，增强控件的显示特征和效果。
87.进一步的，在如图4所示步骤244的一个实施例中，基于所述目标图像中各个像素单元的像素值，在所述目标图像中确定与所述控件个数相匹配的控件绑定区域，可以按照如图5所示的步骤执行。
88.参见图5，示出了根据本技术一个实施例的在所述目标图像中确定与所述控件个数相匹配的控件绑定区域的细节流程图。具体包括步骤2441至步骤2443：
89.在步骤2441中，在所述目标图像中确定与所述控件个数相匹配的待选区域，并计
算各个待选区域中像素单元的像素值标准差。
90.在步骤2442中，在存在至少一个待选区域对应的像素值标准差超过第二预定阈值时，更新各个待选区域的区域边界，直至所述各个待选区域对应的像素值标准差低于所述第二预定阈值。
91.在步骤2443中，将所述像素值标准差低于所述第二预定阈值的待选区域确定为所述控件绑定区域。
92.在如图5所示步骤2442的一个实施例中，更新各个待选区域的区域边界可以是在原待选区域边界的基础上进行更新的，例如，可以是缩小或者扩大原待选区域的边界，也可以是移动原待选区域的边界，还可以是在原待选区域中增加新的边界，以使得隔离原待选区域中突兀的颜色区域。
93.在本技术中，像素值标准差能够反应图像区域中的颜色复杂程度，像素值标准差越大，则说明图像区域中的颜色复杂程度越高。
94.在本技术中，在像素值标准差低于第二预定阈值的待选区域中，其颜色复杂度较小，具有较强的标识性，因此，将像素值标准差低于第二预定阈值的待选区域确定为所述控件绑定区域，使得在后续控件配置过程中，能够增强控件的显示特征和显示效果。同时，基于像素值标准差可以自动在目标图像中确定控件绑定区域，能够提高控件绑定区域的确定效率，进而提高控件配置效率。
95.为了使本领域技术人员更好的理解本实施例，下面将结合图6对本实施例进行说明。
96.参见图6，示出了根据本技术一个实施例的在所述目标图像中确定与所述控件个数相匹配的控件绑定区域的界面演示图。
97.如图6所示，人物图像601(即目标图像)包括待选区域602和待选区域604，其中，像素块603对应于待选区域602，像素块605对应于待选区域604。如图可见，像素块603中各个像素单元之间的像素值差距较小，因此，待选区域602对应的像素值标准差也就较小，使得其被确定为控件绑定区域的可能性更高，而在人物图像601中，待选区域602也具有较强的标识性，适用于绑定控件。进一步的，像素块605中各个像素单元之间的像素值差距较大，因此，待选区域604对应的像素值标准差也就较大，使得其被确定为控件绑定区域的可能性更低，而在人物图像601中，待选区域604的标识性较低，并不适用于绑定控件。
98.在如图4所示步骤244的另一个实施例中，基于所述目标图像中各个像素单元的像素值，在所述目标图像中确定与所述控件个数相匹配的控件绑定区域，还可以按照如图7所示的步骤执行。
99.参见图7，示出了根据本技术一个实施例的在所述目标图像中确定与所述控件个数相匹配的控件绑定区域的细节流程图。具体包括步骤2444至步骤2446：
100.在步骤2444中，在所述目标图像中确定像素分界点，所述像素分界点的相邻像素单元之间的像素值差值超过第三预定阈值。
101.在步骤2445中，基于各个像素分界点在所述目标图像中的位置，在所述目标图像中确定颜色区分边界。
102.在步骤2446中，在所述目标图像中确定由所述颜色区分边界限制的与所述控件个数相匹配的控件绑定区域。
103.在本技术中，目标图像中像素分界点的相邻像素单元之间的像素值差值较大时，则说明目标图像在该像素分界点所在图像位置的颜色跳转跨度较大。
104.进一步的，在本技术中，由各个像素分界点确定颜色区分边界，由颜色区分边界所限制控件绑定区域的颜色复杂度较小，也具有较强的标识性，因此，将由颜色区分边界所限制的区域确定为控件绑定区域，能够增强控件的显示特征和显示效果。同时，由各个像素分界点确定颜色区分边界，由颜色区分边界确定控件绑定区域，也能够提高控件绑定区域的确定效率，进而提高控件配置效率。
105.为了使本领域技术人员更好的理解本实施例，下面将结合图6对本实施例进行说明。
106.参见图8，示出了根据本技术一个实施例的在所述目标图像中确定与所述控件个数相匹配的控件绑定区域的界面演示图。
107.如图8所示，人物图像801(即目标图像)中包括多个像素分界点，以像素分界点802为例，其对应像素块803，在像素块803中，相邻像素单元5和4之间的像素值差值较大，相邻像素单元5和7之间的像素值差值较大，相邻像素单元5和8之间的像素值差值较大，相邻像素单元5和9之间的像素值差值较大，相邻像素单元5和6之间的像素值差值较大。
108.继续如图8所示，通过多个像素分界点可以在目标图像801中确定颜色区分边界804，而由颜色区分边界804限制的控件绑定区域(人物图像的头发)具有较强的标识性，适用于绑定控件。
109.在步骤240的另一个实施例中，在所述目标图像中确定与所述控件个数相匹配的控件绑定区域，还可以按照如图9所示的步骤执行。
110.参见图9，示出了根据本技术一个实施例的在所述目标图像中确定与所述控件个数相匹配的控件绑定区域的细节流程图。具体包括步骤245至步骤246：
111.在步骤245中，响应于在所述目标图像中的勾勒操作，获取在所述目标图像中的勾勒轨迹。
112.在步骤246中，在所述目标图像中确定由所述勾勒轨迹限制的与所述控件个数相匹配的控件绑定区域。
113.在本实施例中，可以是由用户在所述目标图像中进行勾勒操作，并确定对应的勾勒轨迹，由所述勾勒轨迹确定与所述控件个数相匹配的控件绑定区域，其好处在于，可以增强在控件配置过程中用户与界面之间的交互性，从而提高用户体验。
114.为了使本领域技术人员更好的理解本实施例，下面将结合图10对本实施例进行说明。
115.参见图10，示出了根据本技术一个实施例的在所述目标图像中确定与所述控件个数相匹配的控件绑定区域的界面演示图。
116.如图10所示，在人物图像1001(即目标图像)的脸部区域进行勾勒，得到勾勒轨迹1002，因此，可以将由勾勒轨迹1002限制的区域(即脸部区域)确定为控件绑定区域。
117.在步骤240的其它实施例中，在所述目标图像中确定与所述控件个数相匹配的控件绑定区域，还可以通过预先训练的机器学习模型在目标图像中识别图像的各个特征部位，并根据所述特征部位所在的区域确定为与所述控件个数相匹配的控件绑定区域。
118.具体的，例如，在目标图像为人物图像时，可以通过预先训练的机器学习模型在人
物图像中识别任务的眼睛，鼻子，嘴巴，手等特征部位，并将这些特征部位所在的区域确定为控件绑定区域。
119.在上述几个实施例中，在确定与所述控件个数相匹配的控件绑定区域的过程中，也可以先确定大于所述控件个数的控件绑定区域，然后再根据控件绑定区域的面积，在大于所述控件个数的控件绑定区域中确定与所述控件个数相匹配的控件绑定区域。例如，控件个数为4，可以先确定6个控件绑定区域，然后再根据控件绑定区域的面积从大到小的顺序，在6个控件绑定区域中确定面积靠前的4个控件绑定区域。
120.在上述几个实施例中，在确定与所述控件个数相匹配的控件绑定区域的过程中，还可以先确定大于所述控件个数的控件绑定区域，然后由用户在大于所述控件个数的控件绑定区域中选定与所述控件个数相匹配的控件绑定区域。
121.继续参照图2，在步骤260中，在所述目标图像的各个控件绑定区域中配置所述待配置控件。
122.在步骤260的一个实施例中，在所述目标图像的各个控件绑定区域中配置所述待配置控件，可以按照如图11所示的步骤执行。
123.参见图11，示出了根据本技术一个实施例的在所述目标图像的各个控件绑定区域中配置所述待配置控件的细节流程图。具体包括步骤261至步骤263：
124.在步骤261中，获取与各个所述待配置控件对应的控件事件，所述控件事件用于实现控件功能。
125.在步骤262中，建立所述控件事件与所述控件绑定区域之间的绑定关系。
126.在步骤263中，基于所述绑定关系，在所述目标图像的各个控件绑定区域中配置所述待配置控件。
127.在本实施例的步骤262中，可以是按照一一对应的关系，将界面中选定的各个待配置控件拖拽至目标图像的各个控件绑定区域，由此建立待配置控件对应的控件事件与所述控件绑定区域之间的绑定关系。
128.在本实施例的步骤262中，也可以是随机建立选定的各个待配置控件对应的控件事件与所述控件绑定区域之间的绑定关系。
129.在如图11所示步骤263的一个实施例中，在基于所述绑定关系，在所述目标图像的各个控件绑定区域中配置所述待配置控件之后，还可以执行如下步骤：
130.步骤一，在检测到针对所述目标图像中的任意一个控件绑定区域的点击操作时，触发绑定在所述任意一个控件绑定区域的控件事件。
131.步骤二，基于所述控件事件，执行与所述控件事件相对应的程序指令。
132.在本实施中，例如，目标图像中的某一个控件绑定区域绑定有跳转a界面的控件事件，在点击目标图像中的该控件绑定区域时，触发跳转a界面的控件事件，执行与跳转a界面控件事件相对应的程序指令，最终实现界面跳转至a界面。
133.在本技术中，在所述目标图像的各个控件绑定区域中配置所述待配置控件之后，还可以执行如下步骤：
134.基于所述待配置控件所在界面区域的背景颜色，渲染所述目标图像的背景颜色，并将所述目标图像配置在所述待配置控件所在界面区域。
135.为了使本领域技术人员更好的理解是如何将所述目标图像配置在所述待配置控
件所在界面区域的，下面将结合图12进行说明。
136.参见图12，示出了根据本技术一个实施例的将所述目标图像配置在所述待配置控件所在界面区域的界面演示图。
137.如图12所示，在界面1210中，包括待配置控件1201，即控件1，控件2，控件3，以及控件4，若控件1201所在界面区域的背景颜色为透明色，则渲染目标图像1202的背景颜色为透明色，若控件1201所在界面区域的背景颜色为蓝色，则渲染目标图像1202的背景颜色为蓝色。
138.在将待配置控件1201配置在目标图像1202的各个控件绑定区域中之后，将目标图像1202配置在待配置控件1201所在界面区域。如图12所示界面1220中，目标图像1202包括4个控件绑定区域1203，其中，每一个控件绑定区域绑定有一个控件。例如，目标图像1202的4个控件绑定区域1203(即人物头发所在的区域，人物脸部所在的区域，人物手持书本所在的区域，人物鞋子所在的区域，)中，对应绑定有控件1，控件2，控件3，以及控件4。
139.在本技术的一些实施例所提供的技术方案中，基于获取的待配置控件的控件个数，在目标图像中确定与所述控件个数相匹配的控件绑定区域，并将所述待配置控件配置在所述目标图像的各个控件绑定区域中。一方面，可以根据实际需要在目标图像中配置待配置控件，提高了在界面中进行控件配置的灵活性。另一方面，在图像中配置控件，能够增强控件显示的友好性。
140.以下介绍本技术的装置实施例，可以用于执行本技术上述实施例中的控件配置方法。对于本技术装置实施例中未披露的细节，请参照本技术上述的控件配置方法的实施例。
141.图13示出了根据本技术一个实施例的控件配置装置的框图。
142.参照图13所示，根据本技术的一个实施例的控件配置装置1300，包括：第一获取单元1301、第二获取单元1302和配置单元1303。
143.其中，第一获取单元1301，被用于获取待配置控件的控件个数；第二获取单元1302，被用于获取目标图像，并在所述目标图像中确定与所述控件个数相匹配的控件绑定区域；配置单元1303，被用于在所述目标图像的各个控件绑定区域中配置所述待配置控件。
144.在本技术的一些实施例中，基于前述方案，所述装置还包括：确定单元，被用于在获取待配置控件的控件个数之前，响应于针对界面内原始控件的选定操作，将选定的原始控件确定为所述待配置控件。
145.在本技术的一些实施例中，基于前述方案，所述第二获取单元1302配置为：获取第一待选图像，并确定所述第一待选图像的至少一个图像参数；基于所述第一待选图像的至少一个图像参数，从所述第一待选图像中确定所述目标图像。
146.在本技术的一些实施例中，基于前述方案，所述图像参数包括图像尺寸，所述第二获取单元1302配置为：从所述第一待选图像中确定第二待选图像，所述第二待选图像的图像尺寸与所述待配置控件所在界面区域的尺寸相匹配；从所述第二待选图像中确定所述目标图像。
147.在本技术的一些实施例中，基于前述方案，所述图像参数包括图像分辨率，所述第二获取单元1302配置为：从所述第一待选图像中确定所述图像分辨率超过第一预定阈值的图像，得到第三待选图像；从所述第三待选图像中确定所述目标图像。
148.在本技术的一些实施例中，基于前述方案，所述第二获取单元1302配置为：获取所
述目标图像中各个像素单元的像素值；基于所述目标图像中各个像素单元的像素值，在所述目标图像中确定与所述控件个数相匹配的控件绑定区域。
149.在本技术的一些实施例中，基于前述方案，所述第二获取单元1302配置为：在所述目标图像中确定与所述控件个数相匹配的待选区域，并计算各个待选区域中像素单元的像素值标准差；在存在至少一个待选区域对应的像素值标准差超过第二预定阈值时，更新各个待选区域的区域边界，直至所述各个待选区域对应的像素值标准差低于所述第二预定阈值；将所述像素值标准差低于所述第二预定阈值的待选区域确定为所述控件绑定区域。
150.在本技术的一些实施例中，基于前述方案，所述第二获取单元1302配置为：在所述目标图像中确定像素分界点，所述像素分界点的相邻像素单元之间的像素值差值超过第三预定阈值；基于各个像素分界点在所述目标图像中的位置，在所述目标图像中确定颜色区分边界；在所述目标图像中确定由所述颜色区分边界限制的与所述控件个数相匹配的控件绑定区域。
151.在本技术的一些实施例中，基于前述方案，，所述第二获取单元1302配置为：响应于在所述目标图像中的勾勒操作，获取在所述目标图像中的勾勒轨迹；在所述目标图像中确定由所述勾勒轨迹限制的与所述控件个数相匹配的控件绑定区域。
152.在本技术的一些实施例中，基于前述方案，所述配置单元1303配置为：获取与各个所述待配置控件对应的控件事件，所述控件事件用于实现控件功能；建立所述控件事件与所述控件绑定区域之间的绑定关系；基于所述绑定关系，在所述目标图像的各个控件绑定区域中配置所述待配置控件。
153.在本技术的一些实施例中，基于前述方案，所述装置还包括：触发单元，被用于在基于所述绑定关系，在所述目标图像的各个控件绑定区域中配置所述待配置控件之后，在检测到针对所述目标图像中的任意一个控件绑定区域的点击操作时，触发绑定在所述任意一个控件绑定区域的控件事件；执行单元，被用于基于所述控件事件，执行与所述控件事件相对应的程序指令。
154.在本技术的一些实施例中，基于前述方案，所述装置还包括：渲染单元，被用于在所述目标图像的各个控件绑定区域中配置所述待配置控件之后，基于所述待配置控件所在界面区域的背景颜色，渲染所述目标图像的背景颜色，并将所述目标图像配置在所述待配置控件所在界面区域。
155.图14示出了适于用来实现本技术实施例的电子设备的计算机系统的结构示意图。
156.需要说明的是，图14示出的电子设备的计算机系统1400仅是一个示例，不应对本技术实施例的功能和使用范围带来任何限制。
157.如图14所示，计算机系统1400包括中央处理单元(central processing unit，cpu)1401，其可以根据存储在只读存储器(read
‑
only memory，rom)1402中的程序或者从储存部分1408加载到随机访问存储器(random access memory，ram)1403中的程序而执行各种适当的动作和处理，例如执行上述实施例中所述的方法。在ram 1403中，还存储有系统操作所需的各种程序和数据。cpu 1401、rom 1402以及ram 1403通过总线1404彼此相连。输入/输出(input/output，i/o)接口1405也连接至总线1404。
158.以下部件连接至i/o接口1405：包括键盘、鼠标等的输入部分1406；包括诸如阴极射线管(cathode ray tube，crt)、液晶显示器(liquid crystal display，lcd)等以及扬声
器等的输出部分1407；包括硬盘等的储存部分1408；以及包括诸如lan(local area network，局域网)卡、调制解调器等的网络接口卡的通信部分1409。通信部分1409经由诸如因特网的网络执行通信处理。驱动器1410也根据需要连接至i/o接口1405。可拆卸介质1411，诸如磁盘、光盘、磁光盘、半导体存储器等等，根据需要安装在驱动器1410上，以便于从其上读出的计算机程序根据需要被安装入储存部分1408。
159.特别地，根据本技术的实施例，上文参考流程图描述的过程可以被实现为计算机软件程序。例如，本技术的实施例包括一种计算机程序产品，其包括承载在计算机可读介质上的计算机程序，该计算机程序包含用于执行流程图所示的方法的程序代码。在这样的实施例中，该计算机程序可以通过通信部分1409从网络上被下载和安装，和/或从可拆卸介质1411被安装。在该计算机程序被中央处理单元(cpu)1401执行时，执行本技术的系统中限定的各种功能。
160.需要说明的是，本技术实施例所示的计算机可读介质可以是计算机可读信号介质或者计算机可读存储介质或者是上述两者的任意组合。计算机可读存储介质例如可以是——但不限于——电、磁、光、电磁、红外线、或半导体的系统、装置或器件，或者任意以上的组合。计算机可读存储介质的更具体的例子可以包括但不限于：具有一个或多个导线的电连接、便携式计算机磁盘、硬盘、随机访问存储器(ram)、只读存储器(rom)、可擦式可编程只读存储器(erasable programmable read only memory，eprom)、闪存、光纤、便携式紧凑磁盘只读存储器(compact disc read
‑
only memory，cd
‑
rom)、光存储器件、磁存储器件、或者上述的任意合适的组合。在本技术中，计算机可读存储介质可以是任何包含或存储程序的有形介质，该程序可以被指令执行系统、装置或者器件使用或者与其结合使用。而在本技术中，计算机可读的信号介质可以包括在基带中或者作为载波一部分传播的数据信号，其中承载了计算机可读的程序代码。这种传播的数据信号可以采用多种形式，包括但不限于电磁信号、光信号或上述的任意合适的组合。计算机可读的信号介质还可以是计算机可读存储介质以外的任何计算机可读介质，该计算机可读介质可以发送、传播或者传输用于由指令执行系统、装置或者器件使用或者与其结合使用的程序。计算机可读介质上包含的程序代码可以用任何适当的介质传输，包括但不限于：无线、有线等等，或者上述的任意合适的组合。
161.附图中的流程图和框图，图示了按照本技术各种实施例的系统、方法和计算机程序产品的可能实现的体系架构、功能和操作。其中，流程图或框图中的每个方框可以代表一个模块、程序段、或代码的一部分，上述模块、程序段、或代码的一部分包含一个或多个用于实现规定的逻辑功能的可执行指令。也应当注意，在有些作为替换的实现中，方框中所标注的功能也可以以不同于附图中所标注的顺序发生。例如，两个接连地表示的方框实际上可以基本并行地执行，它们有时也可以按相反的顺序执行，这依所涉及的功能而定。也要注意的是，框图或流程图中的每个方框、以及框图或流程图中的方框的组合，可以用执行规定的功能或操作的专用的基于硬件的系统来实现，或者可以用专用硬件与计算机指令的组合来实现。
162.描述于本技术实施例中所涉及到的单元可以通过软件的方式实现，也可以通过硬件的方式来实现，所描述的单元也可以设置在处理器中。其中，这些单元的名称在某种情况下并不构成对该单元本身的限定。
163.作为另一方面，本技术还提供了一种计算机程序产品或计算机程序，该计算机程序产品或计算机程序包括计算机指令，该计算机指令存储在计算机可读存储介质中。计算机设备的处理器从计算机可读存储介质读取该计算机指令，处理器执行该计算机指令，使得该计算机设备执行上述实施例中所述的控件配置方法。
164.作为另一方面，本技术还提供了一种计算机可读介质，该计算机可读介质可以是上述实施例中描述的电子设备中所包含的；也可以是单独存在，而未装配入该电子设备中。上述计算机可读介质承载有一个或者多个程序，当上述一个或者多个程序被一个该电子设备执行时，使得该电子设备实现上述实施例中所述的控件配置方法。
165.应当注意，尽管在上文详细描述中提及了用于动作执行的设备的若干模块或者单元，但是这种划分并非强制性的。实际上，根据本技术的实施方式，上文描述的两个或更多模块或者单元的特征和功能可以在一个模块或者单元中具体化。反之，上文描述的一个模块或者单元的特征和功能可以进一步划分为由多个模块或者单元来具体化。
166.通过以上的实施方式的描述，本领域的技术人员易于理解，这里描述的示例实施方式可以通过软件实现，也可以通过软件结合必要的硬件的方式来实现。因此，根据本技术实施方式的技术方案可以以软件产品的形式体现出来，该软件产品可以存储在一个非易失性存储介质(可以是cd
‑
rom，u盘，移动硬盘等)中或网络上，包括若干指令以使得一台计算设备(可以是个人计算机、服务器、触控终端、或者网络设备等)执行根据本技术实施方式的方法。
167.本领域技术人员在考虑说明书及实践这里公开的实施方式后，将容易想到本技术的其它实施方案。本技术旨在涵盖本技术的任何变型、用途或者适应性变化，这些变型、用途或者适应性变化遵循本技术的一般性原理并包括本技术未公开的本技术领域中的公知常识或惯用技术手段。
168.应当理解的是，本技术并不局限于上面已经描述并在附图中示出的精确结构，并且可以在不脱离其范围进行各种修改和改变。本技术的范围仅由所附的权利要求来限制。