一种避免闪动的weex卡片显示方法、设备及介质技术

技术编号:38848896 阅读:25 留言:0更新日期:2023-09-17 09:58
本发明专利技术提供了一种避免闪动的weex卡片显示方法、设备及介质,通过将用户首次进入的第一显示界面接收到的目标字符串进行渲染后得到的目标图像信息存储至客户端的缓存模块,当用户再次切换到第一显示界面是,先根据指定标识找到当前第二字符串对应的weex卡片显示图像,再根据判断该第二字符串的指定标签判断该第二字符串中的待显示数据是否与改第二字符串对应的目标字符串中的待显示数据相同,若不同,则将该第二字符串待显示数据中与对应的目标字符串的待显示数据不同字段内容进行替换,对于与目标标识相同的指定标识对应的第二字符串,由于渲染出的图像没有变化,避免了重新对第二字符串进行渲染导致的weex卡片闪动,提高了用户体验。高了用户体验。高了用户体验。

【技术实现步骤摘要】
一种避免闪动的weex卡片显示方法、设备及介质


[0001]本专利技术涉及数据处理领域,特别是涉及一种避免闪动的weex卡片显示方法、电子设备及存储介质。

技术介绍

[0002]现有技术中,在客户端的显示界面上显示的卡片为weex卡片时,每次加载weex卡片时需要重新对weex卡片进行渲染,当用户切换回之前加载过weex卡片的显示界面时,当前显示界面中渲染过得weex卡片会再次根据服务器发送的字符串进行渲染,会导致weex卡片存在闪动问题。因此,获取一种避免闪动的weex卡片显示方法是一个非常重要的技术难题。

技术实现思路

[0003]针对上述技术问题,本专利技术采用的技术方案为:
[0004]一种避免闪动的weex卡片显示方法,应用于weex卡片显示系统,所述weex卡片显示系统包括相互连接的客户端和服务器;
[0005]所述客户端执行如下步骤:
[0006]S100、响应于所述服务器发送的若干目标字符串,生成每一目标字符串对应的目标weex卡片并在所述客户端的第一显示界面进行显示;其中,所述目标字符串包括待显示数据和待渲染图像数据;
[0007]S200、根据若干目标字符串和若干目标weex卡片,获取目标图像信息列表T并将T存储至所述客户端的缓存模块;其中,T=(T1,T2,
……
,T
i

……
,T
m
),i=1,2,
……
,m;m为目标weex卡片的数量,T中第i个目标图像信息T
i
=(MT
i
,BT
i
),MT
i
为第i个目标weex卡片对应的目标weex卡片显示图像,BT
i
为根据第i个目标weex卡片对应的目标字符串生成的目标标识,所述目标weex卡片显示图像为根据目标字符串中的待渲染数据进行渲染后得到的图像;
[0008]S300、响应于第一页面切换指令,将所述客户端对应的显示界面切换为第二显示界面;
[0009]S400、响应于第二页面切换指令,将所述客户端对应的显示界面切换为第一显示界面;
[0010]S500、响应于所述服务器发送的若干第二字符串,生成每一第二字符串对应的指定标识X1,X2,
……
,X
j

……
,X
n
;其中,j=1,2,
……
,n;X
j
为第j个第二字符串对应的指定标识;所述第二字符串用于控制所述客户端在第一显示界面生成当前时间对应的目标weex卡片;
[0011]S600、确定T中是否包含与X
j
相同的目标标识,若包含则根据与X
j
相同的目标标识对应的目标图像在第一显示界面生成第j个第二字符串对应的目标weex卡片。
[0012]本专利技术至少具有以下有益效果:
[0013]本专利技术提供一种避免闪动的weex卡片显示方法,响应于所述服务器发送的若干目标字符串,生成每一目标字符串对应的目标weex卡片并在所述客户端的第一显示界面进行显示,根据若干目标字符串和若干目标weex卡片,获取目标图像信息列表T并将T存储至所述客户端的缓存模块,响应于第一页面切换指令,将所述客户端对应的显示界面切换为第二显示界面,响应于第二页面切换指令,将所述客户端对应的显示界面切换为第一显示界面,响应于所述服务器发送的若干第二字符串,生成每一第二字符串对应的指定标识,确定T中是否包含与X
j
相同的目标标识,若包含则根据与X
j
相同的目标标识对应的目标图像在第一显示界面生成第j个第二字符串对应的目标weex卡片。由此,通过将用户首次进入的第一显示界面接收到的目标字符串进行渲染后得到的目标图像信息存储至客户端的缓存模块,当用户再次切换到第一显示界面是,先根据指定标识找到当前第二字符串对应的weex卡片显示图像,再根据判断该第二字符串的指定标签判断该第二字符串中的待显示数据是否与改第二字符串对应的目标字符串中的待显示数据相同,若不同,则将该第二字符串待显示数据中与对应的目标字符串的待显示数据不同字段内容进行替换,对于与目标标识相同的指定标识对应的第二字符串,由于渲染出的图像没有变化,因此,直接调用缓存模块中的目标weex卡片显示图像,避免了重新对第二字符串进行渲染导致的weex卡片闪动,提高了用户体验。
附图说明
[0014]为了更清楚地说明本专利技术实施例中的技术方案,下面将对实施例描述中所需要使用的附图作简单地介绍,显而易见地,下面描述中的附图仅仅是本专利技术的一些实施例,对于本领域普通技术人员来讲,在不付出创造性劳动的前提下,还可以根据这些附图获得其他的附图。
[0015]图1为本专利技术实施例提供的避免闪动的weex卡片显示方法的流程示意图。
具体实施方式
[0016]下面将结合本专利技术实施例中的附图,对本专利技术实施例中的技术方案进行清楚、完整地描述,显然,所描述的实施例仅仅是本专利技术一部分实施例,而不是全部的实施例。基于本专利技术中的实施例,本领域技术人员在没有作出创造性劳动前提下所获得的所有其他实施例,都属于本专利技术保护的范围。
[0017]本专利技术提供一种避免闪动的weex卡片显示方法,应用于weex卡片显示系统,所述weex卡片显示系统包括相互连接的客户端和服务器;
[0018]如图1所示,所述客户端执行如下步骤:
[0019]S100、响应于所述服务器发送的若干目标字符串,生成每一目标字符串对应的目标weex卡片并在所述客户端的第一显示界面进行显示;其中,所述目标字符串包括待显示数据和待渲染图像数据。
[0020]具体地,所述第一显示界面为客户端对应的初始显示界面,可以理解为用户点击该客户端时所展示的显示界面。
[0021]进一步地,所述服务器不仅向客户端发送目标字符串,还会向客户端发送可以生成目标native卡片的字符串。
[0022]在本申请实施例中,所述客户端还包括:相互连接的渲染模块和存储模块,目标weex卡片通过如下步骤生成:
[0023]S110、获取服务器发送的指定字符串列表Z=(Z1,Z2,
……
,Z
v

……
,Z
c
);其中,v=1,2,
……
,c,c为指定字符串的数量,Z
v
为Z中第v个目标字符串;Z
v
包含卡片类型标识、卡片ID和第v个目标卡片的生成数据;所述卡片类型标识为第一卡片类型标识或第二卡片类型标识;所述目标卡片为目标native卡片或目标weex卡片;若卡片类型标识为第一卡片类型标识,所述生成数据中包含待显示参数;若卡片类型标识为第二卡片类型标识,所述生成数据中包含待显示参数和待渲染图像数据。
[0024]具体地,任意指定字符串对应的第一类cell模块或本文档来自技高网
...

【技术保护点】

【技术特征摘要】
1.一种避免闪动的weex卡片显示方法,其特征在于,应用于weex卡片显示系统,所述weex卡片显示系统包括相互连接的客户端和服务器;所述客户端执行如下步骤:S100、响应于所述服务器发送的若干目标字符串,生成每一目标字符串对应的目标weex卡片并在所述客户端的第一显示界面进行显示;其中,所述目标字符串包括待显示数据和待渲染图像数据;S200、根据若干目标字符串和若干目标weex卡片,获取目标图像信息列表T并将T存储至所述客户端的缓存模块;其中,T=(T1,T2,
……
,T
i

……
,T
m
),i=1,2,
……
,m;m为目标weex卡片的数量,T中第i个目标图像信息T
i
=(MT
i
,BT
i
),MT
i
为第i个目标weex卡片对应的目标weex卡片显示图像,BT
i
为根据第i个目标weex卡片对应的目标字符串生成的目标标识,所述目标weex卡片显示图像为根据目标字符串中的待渲染数据进行渲染后得到的图像;S300、响应于第一页面切换指令,将所述客户端对应的显示界面切换为第二显示界面;S400、响应于第二页面切换指令,将所述客户端对应的显示界面切换为第一显示界面;S500、响应于所述服务器发送的若干第二字符串,生成每一第二字符串对应的指定标识X1,X2,
……
,X
j

……
,X
n
;其中,j=1,2,
……
,n;X
j
为第j个第二字符串对应的指定标识;所述第二字符串用于控制所述客户端在第一显示界面生成当前时间对应的目标weex卡片;S600、确定T中是否包含与X
j
相同的目标标识,若包含则根据与X
j
相同的目标标识对应的目标图像在第一显示界面生成第j个第二字符串对应的目标weex卡片。2.根据权利要求1所述的方法,其特征在于,T
i
还包括将T
i
对应的目标字符串进行信息摘要算法处理后得到的目标标签QT
i
。3.根据权利要求2所述的方法,其特征在于,所述目标字符串还包括组ID和服务ID,S500还包括如下步骤:S510、提取每一第二字符串中的组ID、服务ID和待渲染图像数据作为每一第二字符串对应的指定标识;S520、对每一第二字符串进行信息摘要算法处理,得到每一第二字符串对应的指定标签BX1,BX2,
……
,BX
j

……
,BX
n
。4.根据权利要求3所述的方法,其特征在于,所述客户端还包括数据对比模块和数据更改模块,若X
j
与MT中任一目标标识相同,且BX
j
与该目标标识对应的目标标签不同,通过如下步骤获取第j个第二字符串对应的目标weex卡片:S610、根据X
j
,获取第三字符串;其中,所述第三字符串为MT中与X
j
相同的目标标识对应的目标字符串;S620、获取第二字符串中的待显示数据对应的第二字段信息列表Q=(Q1,Q2,
……
,Q
h

……
,Q
H
),h=1,2,
……
,H;其中,H为第二字符串中待显示数据对应的第二字段名的数量,第二字符串中待显示数据对应的第h个第二字段信息Q
h
=(EQ
h
,XQ
h
),EQ
h
为第二字符串中待显示数据对应的第h个第二字段名,XQ
h
为EQ
h
对应的第二显示数据;S630、获取第三字符串中的待显示数据对应的第三字段信息列表G=(G1,G2,
……
,G
h

……
,G
H
),第三字符串中待显示数据对应的第h个第三字段信息G
h
=(EG
h
,XG
h
),EG
h
为第三字符串中待显示数据对应的第h个第三字段名,XG
h
为EG
h
对应的第三显示数据,且EQ
h

EG
h
;S640、将Q和G发送至数据对比模块进行对比,获取指定对比标识列表S=(S1,S2,
……
,S
h
,<...

【专利技术属性】
技术研发人员:李睿钱有才韩海燕闫晶侯远哲
申请(专利权)人:中航信移动科技有限公司
类型:发明
国别省市:

网友询问留言 已有0条评论
  • 还没有人留言评论。发表了对其他浏览者有用的留言会获得科技券。

1