【技术实现步骤摘要】
本专利技术涉及计算机，特别涉及一种根据不同语言的页面自动布局方法及装置。
技术介绍
1、随着经济全球化的不断推进，现有许多网站或者移动应用都需要实现国际化，支持以多种不同的语言进行展示(例如英语、中文、法语等)。传统的国际化实现方式是直接新增一个内容完全相同，仅展示语言不同的页面，根据用户的需要而切换至相应语言的页面。
2、然而，在现有技术中，由于只是单纯的在做页面语言的切换，对于在切换不同的语言后，不同语言的字符串长度不一致导致的页面布局混乱问题没有做进一步的处理，还有一些国家的语言是从右边到左边看的，页面的布局也要重新按照这个阅读习惯来调整。
技术实现思路
1、本专利技术的目的在于避免现有技术中的不足之处而提供一种能够在实现切换语言的功能的同时，页面能够根据语言和语言的字符串长度进行页面的自动布局技术。
2、本专利技术的目的通过以下技术方案实现：
3、因此，根据本专利技术公开的一个方面，提供了一种根据不同语言的页面自动布局方法，包括以下步骤：
4、s1：根据初始化语言进行自动布局；
5、s2：计算切换语言的各个字符串的长度；
6、s3：获取各个承载文字的html元素的最大宽度，并判断对应的各个字符串的长度是否大于html元素的最大宽度；若是，完整的显示字符串；若否，对html元素进行标记，并在显示的字符串中隐藏超出最大宽度的字符串。
7、具体的，步骤s2包括以下步骤：
8、s21：创
9、s22：根据切换语言对应的key值计算出字符串的长度。
10、更具体的，步骤s21还包括：
11、s211：对json文件中对应的key值进行存储；
12、s212：在app.vue文件中给路由出口增加一个动态key值，动态key值绑定存储的key值；
13、s213：对动态key值进行监听。
14、另一具体的，在显示的字符串中隐藏超出最大宽度的字符串，具体包括：
15、取字符串的确定的百分比长度作为显示比例在对应的html元素中显示,剩下的字符串内容就显示为省略号。
16、更具体的，还包括：
17、s4：识别鼠标位置，并判断鼠标位置是否位于被标记的html元素；若是，进入下一步骤；
18、s5：生成显示窗口，并在显示窗口中完整的显示被标记的html元素对应的字符串。
19、以上的，还包括以下步骤：
20、s23：根据key值判断切换语言的阅读顺序，并判断阅读顺序是否与初始化语言一致；若不一致，进入步骤s24；
21、s24：根据切换语言的阅读顺序对页面布局进行调整。
22、更具体的，若切换语言的阅读顺序为从右往左，则步骤s24包括：通过在页面的根元素应用css样式的direction：rtl属性，来实现页面的文本从右到左排序。
23、根据本专利技术公开的另一个方面，提供了一种根据不同语言的页面自动布局装置，采用上述的一种根据不同语言的页面自动布局方法，包括：存储模块、切换模块、计算模块和布局模块；
24、切换模块用于确定切换语言；
25、存储模块用于存储切换语言对应的json文件及对应的key值进行存储；
26、计算模块用于计算各个承载文字的html元素的最大宽度，以及根据key值计算切换语言的各个字符串的长度；
27、布局模块用于根据计算模块的计算结果对页面进行自动布局。
28、根据本专利技术公开的再一方面，提供了一种计算设备，包括存储器、处理器及存储在存储器上并可在处理器上运行的计算机指令，处理器执行指令时实现如上一种电子曲谱的生成方法的步骤。
29、根据本专利技术公开的另一方面，提供了一种计算机可读存储介质，其存储有计算机指令，该指令被处理器执行时实现如上一种电子曲谱的生成方法的步骤。
30、本专利技术的有益效果：本申请的一种根据不同语言的页面自动布局方法，能够在用户切换web端的语言的时候，能够根据该语言的字符串的长度，自动的调整宽度进行完整的字段显示和超出最大宽度显示省略号鼠标移上后显示完整的字段内容，从而对于页面的布局没有造成混乱的影响，提高用户的使用体验。
本文档来自技高网...【技术保护点】
1.一种根据不同语言的页面自动布局方法，其特征在于，包括以下步骤：
2.根据权利要求1所述的一种根据不同语言的页面自动布局方法，其特征在于，所述步骤S2包括以下步骤：
3.根据权利要求2所述的一种根据不同语言的页面自动布局方法，其特征在于：
4.根据权利要求1所述的一种根据不同语言的页面自动布局方法，其特征在于，所述在显示的字符串中隐藏超出所述最大宽度的字符串，具体包括：
5.根据权利要4所述的一种根据不同语言的页面自动布局方法，其特征在于，还包括：
6.根据权利要求2或3所述的一种根据不同语言的页面自动布局方法，其特征在于，还包括以下步骤：
7.根据权利要求6所述的一种根据不同语言的页面自动布局方法，其特征在于：
8.一种根据不同语言的页面自动布局装置，采用权利要求1至7任一项所述的一种根据不同语言的页面自动布局方法，其特征在于，包括：存储模块、切换模块、计算模块和布局模块；
9.一种计算设备，包括存储器、处理器及存储在存储器上并可在处理器上运行的计算机指令，其特征在于，所述处理器执
10.一种计算机可读存储介质，其存储有计算机指令，其特征在于，该指令被处理器执行时实现权利要求1至7任意一项所述方法的步骤。
...【技术特征摘要】
1.一种根据不同语言的页面自动布局方法，其特征在于，包括以下步骤：
2.根据权利要求1所述的一种根据不同语言的页面自动布局方法，其特征在于，所述步骤s2包括以下步骤：
3.根据权利要求2所述的一种根据不同语言的页面自动布局方法，其特征在于：
4.根据权利要求1所述的一种根据不同语言的页面自动布局方法，其特征在于，所述在显示的字符串中隐藏超出所述最大宽度的字符串，具体包括：
5.根据权利要4所述的一种根据不同语言的页面自动布局方法，其特征在于，还包括：
6.根据权利要求2或3所述的一种根据不同语言的页面自动布局方法，其特征在于，还...
【专利技术属性】
技术研发人员：肖家和，林弟，张常华，
申请(专利权)人：广东保伦电子股份有限公司，
类型：发明
国别省市：
还没有人留言评论。发表了对其他浏览者有用的留言会获得科技券。