键盘绘制方法、装置、电子设备和存储介质与流程

1.本发明实施例涉及计算机技术，尤其涉及一种键盘绘制方法、装置、电子设备和存储介质。


背景技术：

2.随着互联网技术的发展，人们在使用智能手机进行交互时，通常需要利用键盘来实现。例如利用聊天软件与其他人进行通讯时，需要在智能手机上通过键盘输入用户所要表达的内容。因此，键盘的使用在人们的日常生活中发挥着很大的作用。
3.利用键盘输入用户所要表达的内容时，首先要唤起键盘。目前，通常是调用手机自带的输入键盘，通过用户在键盘上的点击事件获取用户输入的内容。此外，还有利用h5标签通过代码结构来模拟一个输入键盘，以供用户使用。
4.上述两种方式中，第一种方式，手机端原来的键盘，首先唤起时可能有卡顿，因为相当于唤起的一个单独的服务，ios和android的键盘在h5上展示不一致，有可能需要代码做出兼容，如果是android的原生键盘，有可能把原来在底部展示的内容，顶出来，破坏展示。且原生键盘支持的功能比较复杂，有可能只希望用户输入特定的数字或小数时，存在原生组件如果要限制用户输入特定的数字或小数，则需要写很多的冗余代码，而且前后端要同时校验用户输入的是否符合规则。
5.第二种方式通过普通h5标签实现的虚拟键盘，存在用户可以直接看到代码的格式的问题，而且每次渲染，都需要重新渲染一次，且若有一些恶意插入脚本的软件，则可能通过看到的虚拟键盘上的结构，通过用户的手势，即分析得到用户输入的密码等问题，造成用户的隐私信息不安全的问题。


技术实现要素：

6.本发明实施例提供一种键盘绘制方法、装置、电子设备和存储介质，以实现生成一种可满足用户需求，且保护用户隐私信息的键盘的效果。
7.第一方面，本发明实施例提供了一种键盘绘制方法，该方法包括：
8.响应于外界输入的唤起绘制键盘的触发操作；
9.确定待绘制的键盘的键盘布局参数，根据所述键盘布局参数于画布上绘制所述键盘。
10.第二方面，本发明实施例还提供了一种键盘绘制装置，该装置包括：
11.绘制键盘唤起模块，用于响应于外界输入的唤起绘制键盘的触发操作；
12.键盘绘制模块，用于确定待绘制的键盘的键盘布局参数，根据所述键盘布局参数于画布上绘制所述键盘。
13.第三方面，本发明实施例还提供了一种电子设备，该电子设备包括：
14.一个或多个处理器；
15.存储装置，用于存储一个或多个程序；
16.当所述一个或多个程序被所述一个或多个处理器执行，使得所述一个或多个处理器实现本发明实施例中任一所述的键盘绘制方法。
17.第四方面，本发明实施例还提供了一种包含计算机可执行指令的存储介质，所述计算机可执行指令在由计算机处理器执行时用于执行本发明实施例中任一所述的键盘绘制方法。
18.本发明实施例的技术方案，通过响应于外界输入的唤起绘制键盘的触发操作，根据确定的待绘制的键盘的键盘布局参数于画布上绘制键盘，这样可不需用客户端自带的键盘，解决了现有技术中唤起客户端自带的键盘时的卡顿问题，以及ios和android的键盘在h5上展示不一致，有可能需要代码做出兼容的问题，且由于默认键盘支持的功能比较复杂，需要写很多的冗余代码，而且前后端要同时校验用户输入的是否符合规则的问题。同时还解决了通过普通h5标签实现的虚拟键盘，存在用户可以直接看到代码的格式的问题，而且每次渲染，都需要重新渲染一次，且若有一些恶意插入脚本的软件，则可能通过看到的虚拟键盘上的结构，通过用户的手势，即分析得到用户输入的密码等问题，造成用户的隐私信息不安全的问题。这样可以实现生成一种可满足用户需求，且保护用户隐私信息的键盘的效果。
附图说明
19.图1是本发明实施例一中的键盘绘制方法的流程图；
20.图2是本发明实施例一中的自定义键盘布局参数的示意图；
21.图3是本发明实施例一中的默认键盘布局参数的示意图；
22.图4是本发明实施例二中的键盘绘制方法的流程图；
23.图5是本发明实施例二中的键盘绘制方法的执行流程示意图；
24.图6是本发明实施例三中的键盘绘制装置的结构示意图；
25.图7是本发明实施例四中的一种电子设备的结构示意图。
具体实施方式
26.下面结合附图和实施例对本发明作进一步的详细说明。可以理解的是，此处所描述的具体实施例仅仅用于解释本发明，而非对本发明的限定。另外还需要说明的是，为了便于描述，附图中仅示出了与本发明相关的部分而非全部结构。
27.实施例一
28.图1为本发明实施例一提供的键盘绘制方法的流程图，本实施例可适用于绘制虚拟的可保护用户隐私信息的键盘的情况，该方法可以由键盘绘制装置来执行，该键盘绘制装置可以由软件和/或硬件来实现，该键盘绘制装置可以配置在电子计算设备上，具体包括如下步骤：
29.s110、响应于外界输入的唤起绘制键盘的触发操作。
30.示例性的，唤起绘制键盘的触发操作可以是外界(例如可以是用户)输入的用于唤起绘制键盘的操作。
31.服务器响应于外界输入的唤起绘制键盘的触发操作，即可在当前页面上绘制键盘。
32.在本发明实施中，唤起绘制键盘的触发操作具体可以是：用户点击要输入内容的输入框。例如，用户进入某一要进行输入内容的应用程序，比如微信，当用户要利用微信进行交互时，用户可以点击微信中用于输入信息的输入框。
33.在一个实施例中，唤起绘制键盘的触发操作具体还可以是：用户点击客户端(具体可以是手机或平板等移动设备)中要进行操作的显示界面的空白区域。例如，用户进入微信后，用户进入与某一对象的聊天界面，当用户需要利用微信跟该聊天对象进行交互时，用户可点击当前聊天界面中的空白区域。服务器响应于用户的上述操作，即可在当前聊天界面上绘制键盘。
34.需要说明的是，具体的用户选取何种方式唤起绘制键盘的触发操作，可根据用户需求自行选取，这里不做限定。
35.此外，上述唤起绘制键盘的触发操作仅为本发明实施例的部分示例，并不是全部示例，例如，还可以是利用语音唤起绘制键盘的触发操作，还可以是利用手势唤起绘制键盘的触发操作等等。任何可唤起绘制键盘的触发操作均属于本发明实施例的包含范围。
36.s120、确定待绘制的键盘的键盘布局参数，根据键盘布局参数于画布上绘制键盘。
37.示例性的，键盘布局参数可以是待绘制的键盘的布局参数。具体的这里的键盘布局参数可以但不限于包括：内容参数信息和/或顺序参数信息。
38.在本发明实施例中，内容参考信息至少包括：待绘制的键盘所需的至少一个数字和/或至少一个字符。
39.在本发明实施例中，顺序参数信息为各数字和/或各字符的排序方式。
40.可选的，确定待绘制的键盘的键盘布局参数，包括：接收外界输入的自定义键盘布局参数，将自定义键盘布局参数作为待绘制的键盘的键盘布局参数；或者，获取默认键盘布局参数，将默认键盘布局参数作为待绘制的键盘的键盘布局参数。
41.示例性的，自定义键盘布局参数可以是根据用户需求，用户自行定义的键盘布局参数，即用户自行决定的在待绘制的键盘上要具有哪些数字和/或字符，以及这些数字和/或字符的排序方式。
42.具体的例如，如图2所述的自定义键盘布局参数的示意图，用户定义在待绘制的键盘上仅具有0
‑
9这10个数字，且这10个数字的排序方式如图2所示为根据用户的设置乱序进行排列的。
43.默认键盘布局参数可以是系统默认的键盘的布局参数。即系统默认的键盘上所具有的数字和/或字符，以及这些数字和/或字符的排序方式。
44.具体的例如，以键盘上仅有数字为例，如图3所述的默认键盘布局参数的示意图，系统默认的在待绘制的键盘上仅具有0
‑
9这10个数字，且这10个数字的排序方式如图3所示为系统默认的按一定规则进行排序的。
45.本发明实施例中，将外界输入的自定义键盘布局参数作为待绘制的键盘的键盘布局参数，这样设置的好处在于，避免通过用户的手势，即分析得到用户输入的密码等问题，造成用户的隐私信息不安全的问题。且绘制的键盘可根据用户需求自行设置，满足了用户的个性化需求，提高了用户体验。
46.在本发明实施例中，除了可确定在待绘制的键盘上的各数字和/或各字符的布局情况外，还可以键盘自身的布局情况，即键盘布局参数还可以包括键盘的背景色和/或键盘
的点击交互样式。
47.具体的，键盘的背景色可以是待绘制的键盘的背景颜色。
48.需要说明的是，这里的键盘背景色也可以是用户自定义的，还可以是系统默认的，具体的可根据用户需求自行设置，这里不做限定。
49.在本发明实施例中，键盘的点击交互样式可以是后续用户在使用该键盘时，若点击键盘上的数字和/或字符，则键盘所呈现的样式。具体的例如可以是，当后续用户在使用该键盘时，若用户点击了键盘上的某一个数字“2”，则在该键盘上的数字“2”在用户点击的同时，数字“2”的颜色有变化，或者是发出预设的声音(例如可以是发出“嘀嘀”的声音，或者可以是播报数字“2”)等。
50.需要说明的是，在本发明实施例中，在设置键盘的点击交互样式之前，还需要增加点击事件，具体的可以是设置一个监听事件，以便利用该监听事件，可很好的监听到后续在使用绘制好的键盘时，用户点击的具体的数字和/或字符。
51.在本发明实施例中，当键盘布局参数包括键盘的背景色和/或键盘的点击交互样式时，所述根据键盘布局参数于画布上绘制所述键盘，具体可以是：根据键盘的背景色和/或键盘的点击交互样式，于画布上绘制键盘。
52.具体的可以是，可根据设置的键盘的背景色和/或键盘的点击交互样式，在当前页面的画布上绘制键盘。
53.当服务器响应于外界输入的唤起绘制键盘的触发操作，且服务器确定待绘制的键盘的键盘布局参数后，可根据键盘布局参数于画布上绘制键盘。
54.在本发明实施例中，这里的画布可以是canvas，canvas是在html5中新增的标签用于在网页实时生成图像，并且可以操作图像内容。
55.在本发明实施例中，根据确定的键盘布局参数，于画布上绘制键盘，这样设置的好处在于，可不需用客户端自带的键盘，解决了现有技术中唤起客户端自带的键盘时的卡顿问题，以及ios和android的键盘在h5上展示不一致，有可能需要代码做出兼容的问题，且由于默认键盘支持的功能比较复杂，需要写很多的冗余代码，而且前后端要同时校验用户输入的是否符合规则的问题。同时还解决了通过普通h5标签实现的虚拟键盘，存在用户可以直接看到代码的格式的问题，而且每次渲染，都需要重新渲染一次，且若有一些恶意插入脚本的软件，则可能通过看到的虚拟键盘上的结构，通过用户的手势，即分析得到用户输入的密码等问题，造成用户的隐私信息不安全的问题。这样可以实现生成一种可满足用户需求，且保护用户隐私信息的键盘的效果。
56.在本发明实施例中，可选的，当键盘布局参数包括内容参数信息和/或顺序参数信息时，根据键盘布局参数于画布上绘制键盘，具体可以是：接收外界输入的待绘制的键盘所需的至少一个数字和/或至少一个字符；以及各数字和/或各字符的排序方式；基于各数字和/或各字符，以及各数字和/或各字符的排序方式，于画布上绘制键盘。
57.在本发明实施例中，可选的，所述基于各数字和/或各字符，以及各数字和/或各字符的排序方式，于画布上绘制键盘，具体可以是：基于各数字和/或各字符，以及各数字和/或各字符的排序方式，确定各数字和/或各字符在待绘制的键盘上的位置；基于各数字和/或各字符在待绘制的键盘上的位置，于画布上绘制键盘。
58.这样可根据用户需求，绘制用户所需的键盘，满足了用户的个性化需求，提高了用
户体验。
59.本发明实施例的技术方案，通过响应于外界输入的唤起绘制键盘的触发操作，根据确定的待绘制的键盘的键盘布局参数于画布上绘制键盘，这样可不需用客户端自带的键盘，解决了现有技术中唤起客户端自带的键盘时的卡顿问题，以及ios和android的键盘在h5上展示不一致，有可能需要代码做出兼容的问题，且由于默认键盘支持的功能比较复杂，需要写很多的冗余代码，而且前后端要同时校验用户输入的是否符合规则的问题。同时还解决了通过普通h5标签实现的虚拟键盘，存在用户可以直接看到代码的格式的问题，而且每次渲染，都需要重新渲染一次，且若有一些恶意插入脚本的软件，则可能通过看到的虚拟键盘上的结构，通过用户的手势，即分析得到用户输入的密码等问题，造成用户的隐私信息不安全的问题。这样可以实现生成一种可满足用户需求，且保护用户隐私信息的键盘的效果。
60.实施例二
61.图4为本发明实施例二提供的键盘绘制方法的流程图，本发明实施例与上述实施例中各个可选方案可以结合。在本发明实施例中，可选的，在所述根据键盘布局参数于画布上绘制键盘之后，所述方法还包括：响应于外界输入的唤起键盘的唤起操作，在页面上显示绘制好的键盘；接收对键盘上的各数字和/或各字符的点击操作，响应于点击操作，确定外界输入的内容信息。所述方法还包括：响应于外界输入的收起绘制好的键盘的触发操作，将绘制好的键盘隐藏。
62.如图4所示，本发明实施例的方法具体包括如下步骤：
63.s210、响应于外界输入的唤起绘制键盘的触发操作。
64.s220、确定待绘制的键盘的键盘布局参数，根据键盘布局参数于画布上绘制键盘。
65.s230、响应于外界输入的唤起键盘的唤起操作，在页面上显示绘制好的键盘。
66.示例性的，参考图5所述的键盘绘制方法的执行流程示意图，当绘制好用户所需的键盘后，可响应于外界输入的唤起键盘的唤起操作，具体的可以参照上述唤起绘制键盘的触发操作，这里不做详细赘述。
67.当服务器响应于外界输入的唤起键盘的唤起操作后，可将绘制好的键盘在页面上进行展示。
68.s240、接收对键盘上的各数字和/或各字符的点击操作，响应于点击操作，确定外界输入的内容信息。
69.示例性的，当在页面上展示绘制好的键盘后，可接收外部对键盘上的各数字和/或各字符的点击操作，具体的可以是接收用户对键盘上的各数字和/或各字符的点击操作，服务器响应于上述对键盘上的各数字和/或各字符的点击操作，即可得到用户输入的内容信息。
70.具体的例如，用户进入微信后，用户进入与某一对象的聊天界面，当用户唤起键盘的唤起操作唤起绘制好的键盘后，可在当前的聊天界面上显示出绘制好的键盘，当用户需要利用微信跟某一个聊天对象进行交互时，用户可点击绘制好的键盘上的各数字和/或各字符，服务器响应于上述的用户对绘制好的键盘上的各数字和/或各字符的点击操作，可确定用户输入的具体内容信息。例如，用户点击了“n”、“i”、“h”、“a”、“o”和“！”，则根据用户点击的这些字符，可确定用户输入的内容信息为“你好！”。
71.这样可根据用户的点击操作，精确确定用户输入的内容信息。
72.在本发明实施例中，在绘制键盘后，还需要将绘制好的键盘与页面进行绑定，这样当确定了外界输入的内容信息后，可将内容信息显示在页面上。
73.具体的可以是，将绘制好的键盘与页面进行绑定，这样当用户点击绘制好的键盘上的各数字和/或各字符时，根据用户的对各数字和/或各字符点击操作，将确定的内容信息直接在页面的对应位置进行展示。
74.继续上述示例，当绘制好键盘后，当用户进入微信后，用户进入与某一对象的聊天界面，若确定用户输入的具体内容信息为“你好！”，在可将该内容信息“你好！”显示在当前聊天界面中的输入聊天内容的输入框中。
75.这样可以让用户实时的了解自己输入的具体内容，以便若发现输入的内容有误，用户可及时进行更改。
76.在本发明实施例中，本发明实施例的技术方案还包括：接收外界输入的加密操作；对应的，可基于所述加密操作，将内容信息利用加密标识显示在页面上。
77.具体的可以是，在绘制键盘时，可以设置一个加密标识，例如可以是“*”标识。当用户在利用绘制好的键盘输入需加密的数字和/或字符时，可在页面上用加密标识进行显示，即不显示用户输入的数字和/或字符。
78.当用户在利用绘制好的键盘输入需加密的数字和/或字符时，用户可进行加密操作，具体的可以是在键盘上会有“加密”的控件，当检测到用户点击“加密”控件时，则此时用户输入的数字和/或字符进入加密状态。当用户点击了“加密”控件后，用户再点击键盘上的数字和/或字符，在页面上不会显示用户点击的数字和/或字符，而是用加密标识来代替用户点击的数字和/或字符。例如，当点击了“加密”控件后，用户点击了“1”、“2”、“4”、“7”、“6”和“9”，则在页面上显示的为“******”。
79.这样可根据用户的需求，对用户输入的内容进行加密，保护用户的信息，满足了用户的个性化需求，提高了用户体验。
80.在利用绘制好的键盘输入内容时，可持续性的输入和更改，直至输入完成并提交为止。
81.s250、响应于外界输入的收起绘制好的键盘的触发操作，将绘制好的键盘隐藏。
82.示例性的，当用户输入完成后，不想用绘制好的键盘时，可执行将绘制好的键盘收起来的触发操作，这样可将绘制好的键盘隐藏起来。
83.在本发明实施例中，收起绘制好的键盘的触发操作的具体实施方式可参照上述唤起绘制键盘的触发操作的方式，这里不再赘述。
84.当用户输入完成后，不想用绘制好的键盘时，可执行将绘制好的键盘收起来的触发操作，服务器响应于上述收起绘制好的键盘的触发操作，则将绘制好的键盘隐藏起来。这样下次再使用该绘制好的键盘时，可执行唤起绘制好的键盘的唤起操作，这样即可实现将之前隐藏起来的绘制好的键盘展示在页面上，不需重新绘制，达到了绘制的键盘的高可用性。
85.在本发明实施例中，绘制好的键盘可在多端进行展示，且在多端进行展示的效果一致。实现了绘制的键盘的高可复用性，大大的降低了成本。
86.本发明实施例的技术方案，通过响应于外界输入的唤起键盘的唤起操作，在页面
上显示绘制好的键盘，接收对键盘上的各数字和/或各字符的点击操作，响应于点击操作，确定外界输入的内容信息，这样可根据用户的点击操作，精确确定用户输入的内容信息。同时在不需使用绘制好的键盘时，可响应于外界输入的收起绘制好的键盘的触发操作，将绘制好的键盘隐藏，这样下次再使用该绘制好的键盘时，可执行唤起绘制好的键盘的唤起操作，这样即可实现将之前隐藏起来的绘制好的键盘展示在页面上，不需重新绘制，达到了绘制的键盘的高可用性。
87.实施例三
88.图6为本发明实施例三提供的键盘绘制装置的结构示意图，如图6所示，该装置包括：绘制键盘唤起模块31和键盘绘制模块32。
89.其中，绘制键盘唤起模块31，用于响应于外界输入的唤起绘制键盘的触发操作；
90.键盘绘制模块32，用于确定待绘制的键盘的键盘布局参数，根据所述键盘布局参数于画布上绘制所述键盘。
91.在本发明实施例的技术方案的基础上，键盘绘制模块32包括：
92.第一键盘布局参数确定单元，用于接收外界输入的自定义键盘布局参数，将所述自定义键盘布局参数作为待绘制的键盘的键盘布局参数；或者，
93.第二键盘布局参数确定单元，用于获取默认键盘布局参数，将所述默认键盘布局参数作为待绘制的键盘的键盘布局参数。
94.可选的，所述键盘布局参数包括内容参数信息和/或顺序参数信息。
95.可选的，所述键盘布局参数还包括键盘的背景色和/或键盘的点击交互样式。
96.在本发明实施例的技术方案的基础上，键盘绘制模块32还包括：
97.键盘绘制单元，用于根据所述键盘的背景色和/或所述键盘的点击交互样式，于画布上绘制所述键盘。
98.在本发明实施例的技术方案的基础上，该装置还包括：
99.键盘显示模块，用于响应于外界输入的唤起所述键盘的唤起操作，在页面上显示绘制好的所述键盘；
100.输入内容信息确定模块，用于接收对所述键盘上的各数字和/或各字符的点击操作，响应于所述点击操作，确定外界输入的内容信息。
101.在本发明实施例的技术方案的基础上，该装置还包括：
102.信息绑定模块，用于将绘制好的所述键盘与页面进行绑定；
103.信息显示模块，用于将所述内容信息显示在所述页面上。
104.在本发明实施例的技术方案的基础上，该装置还包括：
105.加密操作接收模块，用于接收外界输入的加密操作。
106.对应的，信息显示模块具体用于：基于所述加密操作，将所述内容信息利用加密标识显示在所述页面上。
107.在本发明实施例的技术方案的基础上，该装置还包括：
108.键盘隐藏模块，用于响应于外界输入的收起绘制好的所述键盘的触发操作，将绘制好的所述键盘隐藏。
109.本发明实施例所提供的键盘绘制装置可执行本发明任意实施例所提供的键盘绘制方法，具备执行方法相应的功能模块和有益效果。
110.实施例四
111.图7为本发明实施例四提供的一种电子设备的结构示意图，如图7所示，该电子设备包括处理器70、存储器71、输入装置72和输出装置73；电子设备中处理器70的数量可以是一个或多个，图7中以一个处理器70为例；电子设备中的处理器70、存储器71、输入装置72和输出装置73可以通过总线或其他方式连接，图7中以通过总线连接为例。
112.存储器71作为一种计算机可读存储介质，可用于存储软件程序、计算机可执行程序以及模块，如本发明实施例中的键盘绘制方法对应的程序指令/模块(例如，绘制键盘唤起模块31和键盘绘制模块32)。处理器70通过运行存储在存储器71中的软件程序、指令以及模块，从而执行电子设备的各种功能应用以及数据处理，即实现上述的键盘绘制方法。
113.存储器71可主要包括存储程序区和存储数据区，其中，存储程序区可存储操作系统、至少一个功能所需的应用程序；存储数据区可存储根据终端的使用所创建的数据等。此外，存储器71可以包括高速随机存取存储器，还可以包括非易失性存储器，例如至少一个磁盘存储器件、闪存器件、或其他非易失性固态存储器件。在一些实例中，存储器71可进一步包括相对于处理器70远程设置的存储器，这些远程存储器可以通过网络连接至电子设备。上述网络的实例包括但不限于互联网、企业内部网、局域网、移动通信网及其组合。
114.输入装置72可用于接收输入的数字或字符信息，以及产生与电子设备的用户设置以及功能控制有关的键信号输入。输出装置73可包括显示屏等显示设备。
115.实施例五
116.本发明实施例五还提供一种包含计算机可执行指令的存储介质，所述计算机可执行指令在由计算机处理器执行时用于执行一种键盘绘制方法。
117.当然,本发明实施例所提供的一种包含计算机可执行指令的存储介质,其计算机可执行指令不限于如上所述的方法操作,还可以执行本发明任意实施例所提供的键盘绘制方法中的相关操作。
118.通过以上关于实施方式的描述，所属领域的技术人员可以清楚地了解到，本发明可借助软件及必需的通用硬件来实现，当然也可以通过硬件实现，但很多情况下前者是更佳的实施方式。基于这样的理解，本发明的技术方案本质上或者说对现有技术做出贡献的部分可以以软件产品的形式体现出来，该计算机软件产品可以存储在计算机可读存储介质中，如计算机的软盘、只读存储器(read
‑
only memory,rom)、随机存取存储器(random access memory,ram)、闪存(flash)、硬盘或光盘等，包括若干指令用以使得一台计算机电子设备(可以是个人计算机，服务器，或者网络设备等)执行本发明各个实施例所述的方法。
119.值得注意的是，上述键盘绘制装置的实施例中，所包括的各个单元和模块只是按照功能逻辑进行划分的，但并不局限于上述的划分，只要能够实现相应的功能即可；另外，各功能单元的具体名称也只是为了便于相互区分，并不用于限制本发明的保护范围。
120.注意，上述仅为本发明的较佳实施例及所运用技术原理。本领域技术人员会理解，本发明不限于这里所述的特定实施例，对本领域技术人员来说能够进行各种明显的变化、重新调整和替代而不会脱离本发明的保护范围。因此，虽然通过以上实施例对本发明进行了较为详细的说明，但是本发明不仅仅限于以上实施例，在不脱离本发明构思的情况下，还可以包括更多其他等效实施例，而本发明的范围由所附的权利要求范围决定。