一种基于数字人移动端页面展示方法与流程
未命名
08-02
阅读:107
评论:0
1.本发明涉及计算机软件开发技术领域,尤其涉及一种基于数字人移动端页面展示方法。
背景技术:
2.在ios设备中,软键盘弹起会导致整个页面上移。在现有技术中,输入框以及整个页面会随着软键盘弹起而上移,位于页面上半部分会因此被遮挡,但是对于与数字人交流对话的场景,软键盘弹起使页面上移,数字人的头部会被遮挡,发送对话消息与数字人对话,无法观察数字人的神情神态,这是一种不好的体验。
3.因此,现有技术存在缺陷,需要改进。
技术实现要素:
4.本发明的目的是克服现有技术的不足,提供一种基于数字人移动端页面展示方法。
5.本发明的技术方案如下:提供一种基于数字人移动端页面展示方法,包括如下步骤:
6.步骤1:判断应用的设备系统,如果设备为ios设备,则进行步骤2,如果不是,则退出程序;
7.步骤2:记录软键盘弹起前页面下的可视化高度,记为height;
8.步骤3:点击输入框,软键盘弹起,记录此时页面的可视化高度为newheight;
9.步骤4:用软键盘弹起前页面可视化高度减去弹起后的可视化高度,即为软键盘高度,即为keyboardheight;
10.步骤5:页面父容器调用scrollintoview()方法,使页面的顶端与可视区域的顶端对齐。
11.进一步地,设置输入框容器的定位点,使得输入框容器的定位跟随软键盘移动;具体步骤为:
12.步骤6:软键盘弹起时,将输入框的容器设为绝对定位,输入框的容器底部设为软键盘高度keyboardheight;
13.步骤7:当软键盘收起时,将输入框的容器底部设为0。
14.采用上述方案,本发明解决了目前在ios移动端设备中与数字人交流时,存在着软键盘弹起时,页面上数字人不完整,或者输入框被遮挡的缺陷的问题,提高了用户的体验。
附图说明
15.图1为本发明的流程示意图。
具体实施方式
16.以下结合附图和具体实施例,对本发明进行详细说明。
17.请参阅图1,本发明提供一种基于数字人移动端页面展示方法,包括如下步骤:
18.步骤1:判断应用的设备系统,如果设备为ios设备,则进行步骤2,如果不是,则退出程序;
19.步骤2:记录软键盘弹起前页面下的可视化高度,记为height;
20.步骤3:点击输入框,软键盘弹起,记录此时页面的可视化高度为newheight;
21.步骤4:用软键盘弹起前页面可视化高度减去弹起后的可视化高度,即为软键盘高度,即为keyboardheight;
22.步骤5:由于软键盘弹起会使页面上移,此时页面的父容器调用scrollintoview()方法,使页面的顶端与可视区域的顶端对齐,此时数字人不会由于页面上移而被阻挡了,数字人的位置保持不变。
23.设置输入框容器的定位点,使得输入框容器的定位跟随软键盘移动;具体步骤为:
24.步骤6:软键盘弹起时,将输入框的容器设为绝对定位,输入框的容器底部设为软键盘高度keyboardheight;
25.步骤7:当软键盘收起时,将输入框的容器底部设为0。
26.在实际应用中,用户启动程序后,程序识别设备是否为ios设备,如果应用的设备不是ios设备,则直接退出程序。如果应用的设备为ios设备,则对设备页面中未弹起软键盘前与弹起软键盘后的页面可视化高度进行识别及记录,并将弹起后页面高度减去弹起前页面高度,计算出软键盘的高度keyboardheight=height-newheight,页面父容器调用scrollintoview()函数方法,使得页面顶端与可视化顶端对齐,使得可见页面内数字人不会随着软键盘的弹出而上移,并使得数字人的头部被遮挡或移出到可见页面外,固定数字人的位置,仅仅输入框随着软键盘弹起,有效提高用户体验。
27.综上所述,本发明解决了目前在ios移动端设备中与数字人交流时,存在着软键盘弹起时,页面上数字人不完整,或者输入框被遮挡的缺陷的问题,提高了用户的体验。
28.以上仅为本发明的较佳实施例而已,并不用于限制本发明,凡在本发明的精神和原则之内所作的任何修改、等同替换和改进等,均应包含在本发明的保护范围之内。
技术特征:
1.一种基于数字人移动端页面展示方法,其特征在于,包括如下步骤:步骤1:判断应用的设备系统,如果设备为ios设备,则进行步骤2,如果不是,则退出程序;步骤2:记录软键盘弹起前页面下的可视化高度,记为height;步骤3:点击输入框,软键盘弹起,记录此时页面的可视化高度为newheight;步骤4:用软键盘弹起前页面可视化高度减去弹起后的可视化高度,即为软键盘高度,即为keyboardheight;步骤5:页面父容器调用scrollintoview()方法,使页面的顶端与可视区域的顶端对齐。2.根据权利要求1所述的基于数字人移动端页面展示方法,其特征在于,设置输入框容器的定位点,使得输入框容器的定位跟随软键盘移动;具体步骤为:步骤6:软键盘弹起时,将输入框的容器设为绝对定位,输入框的容器底部设为软键盘高度keyboardheight;步骤7:当软键盘收起时,将输入框的容器底部设为0。
技术总结
本发明公开一种基于数字人移动端页面展示方法。本发明通过在用户启动程序后,程序识别设备是否为IOS设备,如果应用的设备不是IOS设备,则直接退出程序。如果应用的设备为IOS设备,则对设备页面中未弹起软键盘前与弹起软键盘后的页面可视化高度进行识别及记录,并将弹起后页面高度减去弹起前页面高度,计算出软键盘的高度keyboardHeight=height-newheight,页面父容器调用scrollIntoView()函数方法,使得页面顶端与可视化顶端对齐,使得可见页面内数字人不会随着软键盘的弹出而上移,并使得数字人的头部被遮挡或移出到可见页面外,固定数字人的位置,仅仅输入框随着软键盘弹起,有效提高用户体验。提高用户体验。提高用户体验。
技术研发人员:劳转好 高斌 邹琼 周双全
受保护的技术使用者:深圳市瑞云科技股份有限公司
技术研发日:2023.05.06
技术公布日:2023/8/1
版权声明
本文仅代表作者观点,不代表航家之家立场。
本文系作者授权航家号发表,未经原创作者书面授权,任何单位或个人不得引用、复制、转载、摘编、链接或以其他任何方式复制发表。任何单位或个人在获得书面授权使用航空之家内容时,须注明作者及来源 “航空之家”。如非法使用航空之家的部分或全部内容的,航空之家将依法追究其法律责任。(航空之家官方QQ:2926969996)
航空之家 https://www.aerohome.com.cn/
飞机超市 https://mall.aerohome.com.cn/
航空资讯 https://news.aerohome.com.cn/
