CN110704053A - 一种样式信息的处理方法及装置 - Google Patents

一种样式信息的处理方法及装置 Download PDF

Info

Publication number
CN110704053A
CN110704053A CN201910828476.7A CN201910828476A CN110704053A CN 110704053 A CN110704053 A CN 110704053A CN 201910828476 A CN201910828476 A CN 201910828476A CN 110704053 A CN110704053 A CN 110704053A
Authority
CN
China
Prior art keywords
style information
format
node
page
information
Prior art date
Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
Granted
Application number
CN201910828476.7A
Other languages
English (en)
Other versions
CN110704053B (zh
Inventor
朴惠姝
邓竹立
彭飞
Current Assignee (The listed assignees may be inaccurate. Google has not performed a legal analysis and makes no representation or warranty as to the accuracy of the list.)
Wuba Co Ltd
Original Assignee
Wuba Co Ltd
Priority date (The priority date is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the date listed.)
Filing date
Publication date
Application filed by Wuba Co Ltd filed Critical Wuba Co Ltd
Priority to CN201910828476.7A priority Critical patent/CN110704053B/zh
Publication of CN110704053A publication Critical patent/CN110704053A/zh
Application granted granted Critical
Publication of CN110704053B publication Critical patent/CN110704053B/zh
Active legal-status Critical Current
Anticipated expiration legal-status Critical

Links

Images

Classifications

    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F8/00Arrangements for software engineering
    • G06F8/30Creation or generation of source code
    • G06F8/38Creation or generation of source code for implementing user interfaces
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F8/00Arrangements for software engineering
    • G06F8/40Transformation of program code
    • G06F8/41Compilation
    • G06F8/42Syntactic analysis
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F9/00Arrangements for program control, e.g. control units
    • G06F9/06Arrangements for program control, e.g. control units using stored programs, i.e. using an internal store of processing equipment to receive or retain programs
    • G06F9/44Arrangements for executing specific programs
    • G06F9/451Execution arrangements for user interfaces

Landscapes

  • Engineering & Computer Science (AREA)
  • Software Systems (AREA)
  • Theoretical Computer Science (AREA)
  • General Engineering & Computer Science (AREA)
  • Physics & Mathematics (AREA)
  • General Physics & Mathematics (AREA)
  • Human Computer Interaction (AREA)
  • User Interface Of Digital Computer (AREA)

Abstract

本申请示出了一种样式信息的处理方法及装置。在本申请中,获取React Native页面的代码的抽象语法树,该抽象语法树中至少包括React Native页面中的多个视图节点的第一样式信息;获取该抽象语法树中的视图节点的第一样式信息;根据第一样式信息获取小程序页面支持的第二样式信息,第一样式信息的格式与第二样式信息的格式不同,第一样式信息的内容与第二样式信息的内容相同;在该抽象语法树中设置第二样式信息。通过本申请,可以使得将React Native页面在小程序展示出的页面的样式与React Native页面的样式相同,避免出现在小程序中显示出的样式与React Native页面的样式不同,继而可以避免出现页面的数据显示不全以及显示混乱等现象,从而可以避免降低用户体验。

Description

一种样式信息的处理方法及装置
技术领域
本申请涉及计算机技术领域,特别是涉及一种样式信息的处理方法及装置。
背景技术
当前,越来越多的APP厂商在React Native框架上使用JavaScript开发手机端的APP(应用程序),如此使得用户浏览APP的页面像浏览Web一样,且同时具有Native的操作体验。
与此同时,微信小程序已经逐步被广大用户接受并使用,微信小程序是一种新的开发框架,程序员可以快速地开发一个小程序。微信小程序可以在微信内被便捷地获取和传播,同时具有出色的使用体验。
因此,各大APP厂商在React Native框架上开发一款APP之后,往往也需要开发该APP的微信小程序,以使广大用户在微信中就可以使用该APP的相关功能。
其中,APP中往往包括各种页面,在开发APP时需要对页面进行布局,但是ReactNative页面的StyleSheet布局方式与微信小程序的页面的布局方式不同。如此会导致,将React Native页面的页面数据加载至微信小程序之后,在微信小程序中显示出的页面的样式与React Native页面的样式不同,甚至可能会出现页面的数据显示不全以及显示混乱等现象,进而会降低用户体验。
发明内容
为解决上述技术问题,本申请示出了一种样式信息的处理方法及装置。
第一方面,本申请示出了一种样式信息的处理方法,所述方法包括:
获取React Native页面的代码的抽象语法树,所述抽象语法树中至少包括所述React Native页面中的多个视图节点的第一样式信息;
获取所述抽象语法树中的视图节点的第一样式信息;
根据所述第一样式信息获取小程序页面支持的第二样式信息,所述第一样式信息的格式与所述第二样式信息的格式不同,所述第一样式信息的内容与所述第二样式信息的内容相同;
在所述抽象语法树中设置所述第二样式信息。
在一个可选的实现方式中,所述视图节点至少包括:页面方向节点、字体节点、文字展示节点、图片节点以及页面属性节点。
在一个可选的实现方式中,所述根据所述第一样式信息获取小程序页面支持的第二样式信息,包括:
确定所述视图节点的种类;
获取所述小程序页面支持的、所述种类的节点的样式信息的格式;
获取所述视图节点的第一样式信息中的内容;
生成包括所述内容的、所述格式的第二样式信息。
在一个可选的实现方式中,所述确定所述视图节点的种类,包括:
获取所述第一样式信息中的关键词;
根据所述关键词确定所述视图节点的种类。
在一个可选的实现方式中,所述获取所述小程序页面支持的、所述种类的节点的样式信息的格式,包括:
在视图节点的种类与小程序页面支持的种类的视图节点的样式信息的格式之间的对应关系中,查找与所述种类相对应的格式,并作为所述小程序页面支持的、所述种类的节点的样式信息的格式。
在一个可选的实现方式中,所述获取所述抽象语法树中的视图节点的第一样式信息,包括:
对于所述抽象语法树中的每一个节点,确定所述节点的样式信息中是否包括视图节点对应的关键词;
如果所述节点的样式信息中包括视图节点对应的关键词,则将所述节点的样式确定为视图节点的第一样式信息。
在一个可选的实现方式中,所述在所述抽象语法树中设置所述第二样式信息之后,还包括:
删除所述抽象语法树中的所述第一样式信息。
在一个可选的实现方式中,所述根据所述第一样式信息获取小程序页面支持的第二样式信息,包括:
在所述视图节点的格式为未封装格式的情况下,生成所述未封装格式的所述第二样式信息;
在所述视图节点的格式为封装格式的情况下,生成所述封装格式的所述第二样式信息;
在所述视图节点的格式同时包括所述未封装格式和所述封装格式的情况下,生成所述未封装格式的所述第二样式信息;
在无法确定所述视图节点的格式的情况下,生成所述封装格式的所述第二样式信息。
第二方面,本申请示出了一种样式信息的处理装置,所述装置包括:
第一获取模块,用于获取React Native页面的代码的抽象语法树,所述抽象语法树中至少包括所述React Native页面中的多个视图节点的第一样式信息;
第二获取模块,用于获取所述抽象语法树中的视图节点的第一样式信息;
第三获取模块,用于根据所述第一样式信息获取小程序页面支持的第二样式信息,所述第一样式信息的格式与所述第二样式信息的格式不同,所述第一样式信息的内容与所述第二样式信息的内容相同;
设置模块,用于在所述抽象语法树中设置所述第二样式信息。
在一个可选的实现方式中,所述视图节点至少包括:页面方向节点、字体节点、文字展示节点、图片节点以及页面属性节点。
在一个可选的实现方式中,所述第三获取模块包括:
第一确定单元,用于确定所述视图节点的种类;
第一获取单元,用于获取所述小程序页面支持的、所述种类的节点的样式信息的格式;
第二获取单元,用于获取所述视图节点的第一样式信息中的内容;
第一生成单元,用于生成包括所述内容的、所述格式的第二样式信息。
在一个可选的实现方式中,所述确定单元包括:
获取子单元,用于获取所述第一样式信息中的关键词;
确定子单元,用于根据所述关键词确定所述视图节点的种类。
在一个可选的实现方式中,所述第一获取单元包括:
查找子单元,用于在视图节点的种类与小程序页面支持的种类的视图节点的样式信息的格式之间的对应关系中,查找与所述种类相对应的格式,并作为所述小程序页面支持的、所述种类的节点的样式信息的格式。
在一个可选的实现方式中,所述第二获取模块包括:
第二确定单元,用于对于所述抽象语法树中的每一个节点,确定所述节点的样式信息中是否包括视图节点对应的关键词;
第三确定单元,用于如果所述节点的样式信息中包括视图节点对应的关键词,则将所述节点的样式确定为视图节点的第一样式信息。
在一个可选的实现方式中,所述装置还包括:
删除模块,用于删除所述抽象语法树中的所述第一样式信息。
在一个可选的实现方式中,所述第三获取模块包括:
第二生成单元,用于在所述视图节点的格式为未封装格式的情况下,生成所述未封装格式的所述第二样式信息;
第三生成单元,用于在所述视图节点的格式为封装格式的情况下,生成所述封装格式的所述第二样式信息;
第四生成单元,用于在所述视图节点的格式同时包括所述未封装格式和所述封装格式的情况下,生成所述未封装格式的所述第二样式信息;
第五生成单元,用于在无法确定所述视图节点的格式的情况下,生成所述封装格式的所述第二样式信息。
第三方面,本申请示出了一种电子设备,所述电子设备包括:
处理器;
用于存储处理器可执行指令的存储器;
其中,所述处理器被配置为执行如第一方面所述的样式信息的处理方法。
第四方面,本申请示出了一种非临时性计算机可读存储介质,当所述存储介质中的指令由电子设备的处理器执行时,使得电子设备能够执行如第一方面所述的样式信息的处理方法。
第五方面,本申请示出了一种计算机程序产品,当所述计算机程序产品中的指令由电子设备的处理器执行时,使得电子设备能够执行如第一方面所述的样式信息的处理方法。
本申请提供的技术方案可以包括以下有益效果:
在本申请中,获取React Native页面的代码的抽象语法树,该抽象语法树中至少包括React Native页面中的多个视图节点的第一样式信息;获取该抽象语法树中的视图节点的第一样式信息;根据第一样式信息获取小程序页面支持的第二样式信息,第一样式信息的格式与第二样式信息的格式不同,第一样式信息的内容与第二样式信息的内容相同;在该抽象语法树中设置第二样式信息。通过本申请,可以使得将React Native页面在小程序展示出的页面的样式与React Native页面的样式相同,避免出现在小程序中显示出的样式与React Native页面的样式不同,继而可以避免出现页面的数据显示不全以及显示混乱等现象,从而可以避免降低用户体验。
附图说明
图1是本申请的一种样式信息的处理方法的步骤流程图;
图2是本申请的一种样式信息的处理装置的结构框图;
图3是本申请示出的一种电子设备的框图;
图4是本申请示出的一种电子设备的框图。
具体实施方式
为使本申请的上述目的、特征和优点能够更加明显易懂,下面结合附图和具体实施方式对本申请作进一步详细的说明。
参照图1,示出了本申请的一种样式信息的处理方法的步骤流程图,该方法具体可以包括如下步骤:
在步骤S101中,获取React Native页面的代码的抽象语法树,该抽象语法树中至少包括React Native页面中的多个视图节点的第一样式信息;
视图节点至少包括:页面方向节点、字体节点、文字展示节点、图片节点以及页面属性节点等多种节点。
其中,页面方向节点包括flex相关样式的节点,用于设置页面的方向。
字体节点用于设置页面中的文字的字体大小等。在React Native页面中,默认字体为14px。而在小程序页面中,默认字体可能不是14px。
文字在页面中的某一特定区域中展示时,如果文字较多导致无法咋特定区域全部同时展示时,在特定区域中可以溢出显示或者省略显示,文字展示节点包括用于设置显示状态为溢出显示状态还是省略显示状态。在React Native页面中,默认是省略显示状态。而在小程序页面中,可以默认溢出显示状态。
图片节点用于设置图片在页面中尺寸,例如宽度以及高度等,以及用于设置页面中的父类图片与子类图片之间尺寸大小关系。在React Native页面中,子类图片的尺寸默认与父类图片的尺寸相同。而在小程序页面中,默认子类图片的尺寸大于父类图片的尺寸。
页面属性节点用于设置页面的宽度、高度以及页边距等,页边距包括左页边距、右页边距、上页边距以及下页边距等。
在本申请中,为了使得将React Native页面在小程序展示出的页面的样式与React Native页面的样式相同,可以先获取React Native页面的代码的抽象语法树,然后执行步骤S102。
其中,本申请可以使用现有技术中的任意一种获取页面的语法树的方法来获取React Native页面的抽象语法树,本申请对具体的获取方法不做限定。
在步骤S102中,获取该抽象语法树中的视图节点的第一样式信息;
其中,在本步骤S101中获取到的React Native页面的抽象语法树中,至少包括有React Native页面中的视图节点的第一样式信息,当然,同时也可能会包括React Native页面中的其他类型节点的信息等。由于本申请是为了使得将React Native页面在小程序展示出的页面的样式与React Native页面的样式相同,因此需要对对视图节点中的样式信息进行处理,因此,可以获取抽象语法树中的视图节点的第一样式信息。
其中,React Native页面中的视图节点中的样式信息中往往包括视图节点对应的关键词。例如,页面方向节点的样式信息中往往包括关键词“flex”等。字体节点的样式信息中往往包括关键词“font-size”等。文字展示节点的样式信息中往往包括关键词“overflow”或“hidden”等。图片节点的样式信息中往往包括关键词“image”等。页面属性节点的样式信息中往往包括关键词“width”、“height”、“marginTop”或“marginLeft”等。
因此,对于该抽象语法树中的任意一个节点,可以确定该节点的样式信息中是否包括视图节点对应的关键词;如果该节点的样式信息中包括视图节点对应的关键词,则可以将该节点的样式确定为视图节点的第一样式信息。对于该抽象语法树中的其他每一个节点,同样执行上述操作。如此,可以得到该抽象语法树中的所有视图节点的第一样式信息。
在步骤S103中,根据第一样式信息获取小程序页面支持的第二样式信息,第一样式信息的格式与第二样式信息的格式不同,第一样式信息的内容与第二样式信息的内容相同;
在本申请中的小程序包括微信小程序或支付宝小程序等,对具体的小程序不做限定。
在本申请一个实施例中,本步骤可以通过如下流程实现,包括:
1301、确定视图节点的种类;
在本申请中,视图节点包括页面方向节点、字体节点、文字展示节点、图片节点以及页面属性节点等多个种类的节点。其中,可以获取第一样式信息中的关键词,然后根据关键词确定视图节点的种类。
例如,当视图节点中的第一样式信息中的关键词包括“flex”时,则可以确定视图节点为页面方向节点。当视图节点中的第一样式信息中的关键词包括“font-size”时,则可以确定视图节点为字体节点。当视图节点中的第一样式信息中的关键词包括“overflow”或“hidden”时,则可以确定视图节点为文字展示节点。当视图节点中的第一样式信息中的关键词包括“image”时,则可以确定视图节点为图片节点。当视图节点中的第一样式信息中的关键词包括“width”、“height”、“marginTop”或“marginLeft”等时,则可以确定视图节点为页面属性节点等。
1302、获取小程序页面支持的、该种类的节点的样式信息的格式;
在本申请中,对于任意一个种类的视图节点,事先可以获取小程序页面支持的该种类的视图节点的样式信息的格式,然后将该种类与获取的小程序页面支持的该种类的视图节点的样式信息的格式组成对应表项,并存储在视图节点的种类与小程序页面支持的种类的视图节点的样式信息的格式之间的对应关系中,对于其他每一个视图节点,同样执行上述操作。
例如,假设视图节点的种类为页面方向节点,小程序页面支持的页面方向节点的样式信息的格式为“key=value”的格式。
例如:
{display=flex;
flex=row}。
表示页面方向为沿着列的方向。
假设视图节点的种类为字体节点,小程序页面支持的视图节点的样式信息的格式为“key=value”的格式,例如:{font-size=14px}等,表示文字的字体大小为14px。
假设视图节点的种类为文字展示节点,小程序页面支持的视图节点的样式信息的格式为“key=value”的格式,例如:{overflow=yes};或者,hidden=no}等,标识显示状态为溢出状态。
假设视图节点的种类为图片节点,小程序页面支持的图片节点的样式信息的格式为“key=value”的格式,例如:{width=100%}等,表示父类图片的宽度与子类图片的宽度相同。
假设页面属性节点的种类为图片节点,小程序页面支持的页面属性节点的样式信息的格式为“key=value”的格式,例如:{marginLeft=1}等,表示页面的左页边距为1。
如此,在本步骤中,可以在视图节点的种类与小程序页面支持的种类的视图节点的样式信息的格式之间的对应关系中,查找与该种类相对应的格式,并作为小程序页面支持的、该种类的节点的样式信息的格式。
1303、获取视图节点的第一样式信息中的内容;
本申请中,第一样式信息中的内容可以包括样式参数名和样式参数值,样式参数名:例如,“marginLeft”表示左页边距,“width”表示宽度,“font-size”表示字体大小。
样式参数值:例如,可以为数值,例如,描述左页边距的大小,例如1单位的长度,或者,描述字体大小,例如14px等。
本申请一个实施例中,获取第一样式信息中的内容可以存储在第一样式信息中,如此,可以直接从第一样式信息中获取其内容,例如,样式参数名和样式参数值等。
然而,在另一个实施例中,在React Native页面中,字体大小默认为14px,如此,技术人员在编写React Native页面的代码时,可以在代码中设置字体大小为14px,当然,也可以不设置字体大小,这样,在显示React Native页面时,会默认显示的字体大小问14px,如此,在这种情况下,获取的视图节点的第一样式信息中的内容并不位于第一样式信息中,这些默认的内容可以存储在系统中的一个特定的存储空间中,如此可以获取该特定的存储空间中的内容,并作为视图节点的第一样式信息中的内容。
1304、生成包括该内容的、该格式的第二样式信息。
在本申请另一个实施例中,在视图节点的格式为未封装格式的情况下,生成未封装格式的第二样式信息;在视图节点的格式为封装格式的情况下,生成封装格式的第二样式信息;其中,由于有时候小程序中规定未封装格式的优先级高,因此,在视图节点的格式同时包括未封装格式和封装格式的情况下,可以生成未封装格式的第二样式信息;在无法确定视图节点的格式的情况下,生成封装格式的第二样式信息。
在步骤S104中,在该抽象语法树中设置第二样式信息。
在本申请中,可以在该抽象语法树中添加第二样式信息。如此之后在将抽象语法树加载至小程序页面时,由于该抽象语法树中具有小程序页面支持的格式的第二样式信息,因此,在小程序页面中就能够以第二样式信息显示页面,从而使得将React Native页面在小程序展示出的页面的样式与React Native页面的样式相同。
进一步地,由于设置了第二样式信息的抽象语法树是用于小程序页面的,小程序页面也不支持第一样式信息,即,抽象语法树中的第一样式信息对小程序页面是无效的,因此,为了降低抽象语法树的大小,以提高之后在小程序页面中加载设置了第二样式信息的效率,进而提高在小程序页面中显示页面的效率,可以删除该抽象语法树中的第一样式信息。
在本申请中,获取React Native页面的代码的抽象语法树,该抽象语法树中至少包括React Native页面中的多个视图节点的第一样式信息;获取该抽象语法树中的视图节点的第一样式信息;根据第一样式信息获取小程序页面支持的第二样式信息,第一样式信息的格式与第二样式信息的格式不同,第一样式信息的内容与第二样式信息的内容相同;在该抽象语法树中设置第二样式信息。通过本申请,可以使得将React Native页面在小程序展示出的页面的样式与React Native页面的样式相同,避免出现在小程序中显示出的样式与React Native页面的样式不同,继而可以避免出现页面的数据显示不全以及显示混乱等现象,从而可以避免降低用户体验。
需要说明的是,对于方法实施例,为了简单描述,故将其都表述为一系列的动作组合,但是本领域技术人员应该知悉,本申请并不受所描述的动作顺序的限制,因为依据本申请,某些步骤可以采用其他顺序或者同时进行。其次,本领域技术人员也应该知悉,说明书中所描述的实施例均属于可选实施例,所涉及的动作并不一定是本申请所必须的。
参照图2,示出了本申请的一种样式信息的处理装置的结构框图,应用于客户端,该装置具体可以包括如下模块:
第一获取模块11,用于获取React Native页面的代码的抽象语法树,所述抽象语法树中至少包括所述React Native页面中的多个视图节点的第一样式信息;
第二获取模块12,用于获取所述抽象语法树中的视图节点的第一样式信息;
第三获取模块13,用于根据所述第一样式信息获取小程序页面支持的第二样式信息,所述第一样式信息的格式与所述第二样式信息的格式不同,所述第一样式信息的内容与所述第二样式信息的内容相同;
设置模块14,用于在所述抽象语法树中设置所述第二样式信息。
在一个可选的实现方式中,所述视图节点至少包括:页面方向节点、字体节点、文字展示节点、图片节点以及页面属性节点。
在一个可选的实现方式中,所述第三获取模块13包括:
第一确定单元,用于确定所述视图节点的种类;
第一获取单元,用于获取所述小程序页面支持的、所述种类的节点的样式信息的格式;
第二获取单元,用于获取所述视图节点的第一样式信息中的内容;
第一生成单元,用于生成包括所述内容的、所述格式的第二样式信息。
在一个可选的实现方式中,所述确定单元包括:
获取子单元,用于获取所述第一样式信息中的关键词;
确定子单元,用于根据所述关键词确定所述视图节点的种类。
在一个可选的实现方式中,所述第一获取单元包括:
查找子单元,用于在视图节点的种类与小程序页面支持的种类的视图节点的样式信息的格式之间的对应关系中,查找与所述种类相对应的格式,并作为所述小程序页面支持的、所述种类的节点的样式信息的格式。
在一个可选的实现方式中,所述第二获取模块12包括:
第二确定单元,用于对于所述抽象语法树中的每一个节点,确定所述节点的样式信息中是否包括视图节点对应的关键词;
第三确定单元,用于如果所述节点的样式信息中包括视图节点对应的关键词,则将所述节点的样式确定为视图节点的第一样式信息。
在一个可选的实现方式中,所述装置还包括:
删除模块,用于删除所述抽象语法树中的所述第一样式信息。
在一个可选的实现方式中,所述第三获取模块13包括:
第二生成单元,用于在所述视图节点的格式为未封装格式的情况下,生成所述未封装格式的所述第二样式信息;
第三生成单元,用于在所述视图节点的格式为封装格式的情况下,生成所述封装格式的所述第二样式信息;
第四生成单元,用于在所述视图节点的格式同时包括所述未封装格式和所述封装格式的情况下,生成所述未封装格式的所述第二样式信息;
第五生成单元,用于在无法确定所述视图节点的格式的情况下,生成所述封装格式的所述第二样式信息。
在本申请中,获取React Native页面的代码的抽象语法树,该抽象语法树中至少包括React Native页面中的多个视图节点的第一样式信息;获取该抽象语法树中的视图节点的第一样式信息;根据第一样式信息获取小程序页面支持的第二样式信息,第一样式信息的格式与第二样式信息的格式不同,第一样式信息的内容与第二样式信息的内容相同;在该抽象语法树中设置第二样式信息。通过本申请,可以使得将React Native页面在小程序展示出的页面的样式与React Native页面的样式相同,避免出现在小程序中显示出的样式与React Native页面的样式不同,继而可以避免出现页面的数据显示不全以及显示混乱等现象,从而可以避免降低用户体验。
对于装置实施例而言,由于其与方法实施例基本相似,所以描述的比较简单,相关之处参见方法实施例的部分说明即可。
图3是本申请示出的一种电子设备800的框图。例如,电子设备800可以是移动电话,计算机,数字广播终端,消息收发设备,游戏控制台,平板设备,医疗设备,健身设备,个人数字助理等。
参照图3,电子设备800可以包括以下一个或多个组件:处理组件802,存储器804,电力组件806,多媒体组件808,音频组件810,输入/输出(I/O)的接口812,传感器组件814,以及通信组件816。
处理组件802通常控制电子设备800的整体操作,诸如与显示,电话呼叫,数据通信,相机操作和记录操作相关联的操作。处理组件802可以包括一个或多个处理器820来执行指令,以完成上述方法的全部或部分步骤。此外,处理组件802可以包括一个或多个模块,便于处理组件802和其他组件之间的交互。例如,处理组件802可以包括多媒体模块,以方便多媒体组件808和处理组件802之间的交互。
存储器804被配置为存储各种类型的数据以支持在设备800的操作。这些数据的示例包括用于在电子设备800上操作的任何应用程序或方法的指令,联系人数据,电话簿数据,消息,图像,视频等。存储器804可以由任何类型的易失性或非易失性存储设备或者它们的组合实现,如静态随机存取存储器(SRAM),电可擦除可编程只读存储器(EEPROM),可擦除可编程只读存储器(EPROM),可编程只读存储器(PROM),只读存储器(ROM),磁存储器,快闪存储器,磁盘或光盘。
电源组件806为电子设备800的各种组件提供电力。电源组件806可以包括电源管理系统,一个或多个电源,及其他与为电子设备800生成、管理和分配电力相关联的组件。
多媒体组件808包括在所述电子设备800和用户之间的提供一个输出接口的屏幕。在一些实施例中,屏幕可以包括液晶显示器(LCD)和触摸面板(TP)。如果屏幕包括触摸面板,屏幕可以被实现为触摸屏,以接收来自用户的输入信号。触摸面板包括一个或多个触摸传感器以感测触摸、滑动和触摸面板上的手势。所述触摸传感器可以不仅感测触摸或滑动动作的边界,而且还检测与所述触摸或滑动操作相关的持续时间和压力。在一些实施例中,多媒体组件808包括一个前置摄像头和/或后置摄像头。当设备800处于操作模式,如拍摄模式或视频模式时,前置摄像头和/或后置摄像头可以接收外部的多媒体数据。每个前置摄像头和后置摄像头可以是一个固定的光学透镜系统或具有焦距和光学变焦能力。
音频组件810被配置为输出和/或输入音频信号。例如,音频组件810包括一个麦克风(MIC),当电子设备800处于操作模式,如呼叫模式、记录模式和语音识别模式时,麦克风被配置为接收外部音频信号。所接收的音频信号可以被进一步存储在存储器804或经由通信组件816发送。在一些实施例中,音频组件810还包括一个扬声器,用于输出音频信号。
I/O接口812为处理组件802和外围接口模块之间提供接口,上述外围接口模块可以是键盘,点击轮,按钮等。这些按钮可包括但不限于:主页按钮、音量按钮、启动按钮和锁定按钮。
传感器组件814包括一个或多个传感器,用于为电子设备800提供各个方面的状态评估。例如,传感器组件814可以检测到设备800的打开/关闭状态,组件的相对定位,例如所述组件为电子设备800的显示器和小键盘,传感器组件814还可以检测电子设备800或电子设备800一个组件的位置改变,用户与电子设备800接触的存在或不存在,电子设备800方位或加速/减速和电子设备800的温度变化。传感器组件814可以包括接近传感器,被配置用来在没有任何的物理接触时检测附近物体的存在。传感器组件814还可以包括光传感器,如CMOS或CCD图像传感器,用于在成像应用中使用。在一些实施例中,该传感器组件814还可以包括加速度传感器,陀螺仪传感器,磁传感器,压力传感器或温度传感器。
通信组件816被配置为便于电子设备800和其他设备之间有线或无线方式的通信。电子设备800可以接入基于通信标准的无线网络,如WiFi,运营商网络(如2G、3G、4G或5G),或它们的组合。在一个示例性实施例中,通信组件816经由广播信道接收来自外部广播管理系统的广播信号或广播操作信息。在一个示例性实施例中,所述通信组件816还包括近场通信(NFC)模块,以促进短程通信。例如,在NFC模块可基于射频识别(RFID)技术,红外数据协会(IrDA)技术,超宽带(UWB)技术,蓝牙(BT)技术和其他技术来实现。
在示例性实施例中,电子设备800可以被一个或多个应用专用集成电路(ASIC)、数字信号处理器(DSP)、数字信号处理设备(DSPD)、可编程逻辑器件(PLD)、现场可编程门阵列(FPGA)、控制器、微控制器、微处理器或其他电子元件实现,用于执行上述方法。
在示例性实施例中,还提供了一种包括指令的非临时性计算机可读存储介质,例如包括指令的存储器804,上述指令可由电子设备800的处理器820执行以完成上述方法。例如,所述非临时性计算机可读存储介质可以是ROM、随机存取存储器(RAM)、CD-ROM、磁带、软盘和光数据存储设备等。
图4是本申请示出的一种电子设备1900的框图。例如,电子设备1900可以被提供为一服务器。
参照图4,电子设备1900包括处理组件1922,其进一步包括一个或多个处理器,以及由存储器1932所代表的存储器资源,用于存储可由处理组件1922的执行的指令,例如应用程序。存储器1932中存储的应用程序可以包括一个或一个以上的每一个对应于一组指令的模块。此外,处理组件1922被配置为执行指令,以执行上述方法。
电子设备1900还可以包括一个电源组件1926被配置为执行电子设备1900的电源管理,一个有线或无线网络接口1950被配置为将电子设备1900连接到网络,和一个输入输出(I/O)接口1958。电子设备1900可以操作基于存储在存储器1932的操作系统,例如Windows ServerTM,Mac OS XTM,UnixTM,LinuxTM,FreeBSDTM或类似。
本说明书中的各个实施例均采用递进的方式描述,每个实施例重点说明的都是与其他实施例的不同之处,各个实施例之间相同相似的部分互相参见即可。
本领域内的技术人员应明白,本申请的实施例可提供为方法、装置、或计算机程序产品。因此,本申请可采用完全硬件实施例、完全软件实施例、或结合软件和硬件方面的实施例的形式。而且,本申请可采用在一个或多个其中包含有计算机可用程序代码的计算机可用存储介质(包括但不限于磁盘存储器、CD-ROM、光学存储器等)上实施的计算机程序产品的形式。
本申请是参照根据本申请的方法、终端设备(系统)、和计算机程序产品的流程图和/或方框图来描述的。应理解可由计算机程序指令实现流程图和/或方框图中的每一流程和/或方框、以及流程图和/或方框图中的流程和/或方框的结合。可提供这些计算机程序指令到通用计算机、专用计算机、嵌入式处理机或其他可编程数据处理终端设备的处理器以产生一个机器,使得通过计算机或其他可编程数据处理终端设备的处理器执行的指令产生用于实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能的装置。
这些计算机程序指令也可存储在能引导计算机或其他可编程数据处理终端设备以特定方式工作的计算机可读存储器中,使得存储在该计算机可读存储器中的指令产生包括指令装置的制造品,该指令装置实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能。
这些计算机程序指令也可装载到计算机或其他可编程数据处理终端设备上,使得在计算机或其他可编程终端设备上执行一系列操作步骤以产生计算机实现的处理,从而在计算机或其他可编程终端设备上执行的指令提供用于实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能的步骤。
尽管已描述了本申请的优选实施例,但本领域内的技术人员一旦得知了基本创造性概念,则可对这些实施例做出另外的变更和修改。所以,所附权利要求意欲解释为包括优选实施例以及落入本申请范围的所有变更和修改。
最后,还需要说明的是,在本文中,诸如第一和第二等之类的关系术语仅仅用来将一个实体或者操作与另一个实体或操作区分开来,而不一定要求或者暗示这些实体或操作之间存在任何这种实际的关系或者顺序。而且,术语“包括”、“包含”或者其任何其他变体意在涵盖非排他性的包含,从而使得包括一系列要素的过程、方法、物品或者终端设备不仅包括那些要素,而且还包括没有明确列出的其他要素,或者是还包括为这种过程、方法、物品或者终端设备所固有的要素。在没有更多限制的情况下,由语句“包括一个……”限定的要素,并不排除在包括所述要素的过程、方法、物品或者终端设备中还存在另外的相同要素。
以上对本申请所提供的一种样式信息的处理方法及装置,进行了详细介绍,本文中应用了具体个例对本申请的原理及实施方式进行了阐述,以上实施例的说明只是用于帮助理解本申请的方法及其核心思想;同时,对于本领域的一般技术人员,依据本申请的思想,在具体实施方式及应用范围上均会有改变之处,综上所述,本说明书内容不应理解为对本申请的限制。

Claims (18)

1.一种样式信息的处理方法,其特征在于,所述方法包括:
获取React Native页面的代码的抽象语法树,所述抽象语法树中至少包括所述ReactNative页面中的多个视图节点的第一样式信息;
获取所述抽象语法树中的视图节点的第一样式信息;
根据所述第一样式信息获取小程序页面支持的第二样式信息,所述第一样式信息的格式与所述第二样式信息的格式不同,所述第一样式信息的内容与所述第二样式信息的内容相同;
在所述抽象语法树中设置所述第二样式信息。
2.根据权利要求1所述的方法,其特征在于,所述视图节点至少包括:页面方向节点、字体节点、文字展示节点、图片节点以及页面属性节点。
3.根据权利要求1所述的方法,其特征在于,所述根据所述第一样式信息获取小程序页面支持的第二样式信息,包括:
确定所述视图节点的种类;
获取所述小程序页面支持的、所述种类的节点的样式信息的格式;
获取所述视图节点的第一样式信息中的内容;
生成包括所述内容的、所述格式的第二样式信息。
4.根据权利要求3所述的方法,其特征在于,所述确定所述视图节点的种类,包括:
获取所述第一样式信息中的关键词;
根据所述关键词确定所述视图节点的种类。
5.根据权利要求3所述的方法,其特征在于,所述获取所述小程序页面支持的、所述种类的节点的样式信息的格式,包括:
在视图节点的种类与小程序页面支持的种类的视图节点的样式信息的格式之间的对应关系中,查找与所述种类相对应的格式,并作为所述小程序页面支持的、所述种类的节点的样式信息的格式。
6.根据权利要求1所述的方法,其特征在于,所述获取所述抽象语法树中的视图节点的第一样式信息,包括:
对于所述抽象语法树中的每一个节点,确定所述节点的样式信息中是否包括视图节点对应的关键词;
如果所述节点的样式信息中包括视图节点对应的关键词,则将所述节点的样式确定为视图节点的第一样式信息。
7.根据权利要求1所述的方法,其特征在于,所述在所述抽象语法树中设置所述第二样式信息之后,还包括:
删除所述抽象语法树中的所述第一样式信息。
8.根据权利要求1所述的方法,其特征在于,所述根据所述第一样式信息获取小程序页面支持的第二样式信息,包括:
在所述视图节点的格式为未封装格式的情况下,生成所述未封装格式的所述第二样式信息;
在所述视图节点的格式为封装格式的情况下,生成所述封装格式的所述第二样式信息;
在所述视图节点的格式同时包括所述未封装格式和所述封装格式的情况下,生成所述未封装格式的所述第二样式信息;
在无法确定所述视图节点的格式的情况下,生成所述封装格式的所述第二样式信息。
9.一种样式信息的处理装置,其特征在于,所述装置包括:
第一获取模块,用于获取React Native页面的代码的抽象语法树,所述抽象语法树中至少包括所述React Native页面中的多个视图节点的第一样式信息;
第二获取模块,用于获取所述抽象语法树中的视图节点的第一样式信息;
第三获取模块,用于根据所述第一样式信息获取小程序页面支持的第二样式信息,所述第一样式信息的格式与所述第二样式信息的格式不同,所述第一样式信息的内容与所述第二样式信息的内容相同;
设置模块,用于在所述抽象语法树中设置所述第二样式信息。
10.根据权利要求9所述的装置,其特征在于,所述视图节点至少包括:页面方向节点、字体节点、文字展示节点、图片节点以及页面属性节点。
11.根据权利要求9所述的装置,其特征在于,所述第三获取模块包括:
第一确定单元,用于确定所述视图节点的种类;
第一获取单元,用于获取所述小程序页面支持的、所述种类的节点的样式信息的格式;
第二获取单元,用于获取所述视图节点的第一样式信息中的内容;
第一生成单元,用于生成包括所述内容的、所述格式的第二样式信息。
12.根据权利要求11所述的装置,其特征在于,所述确定单元包括:
获取子单元,用于获取所述第一样式信息中的关键词;
确定子单元,用于根据所述关键词确定所述视图节点的种类。
13.根据权利要求11所述的装置,其特征在于,所述第一获取单元包括:
查找子单元,用于在视图节点的种类与小程序页面支持的种类的视图节点的样式信息的格式之间的对应关系中,查找与所述种类相对应的格式,并作为所述小程序页面支持的、所述种类的节点的样式信息的格式。
14.根据权利要求9所述的装置,其特征在于,所述第二获取模块包括:
第二确定单元,用于对于所述抽象语法树中的每一个节点,确定所述节点的样式信息中是否包括视图节点对应的关键词;
第三确定单元,用于如果所述节点的样式信息中包括视图节点对应的关键词,则将所述节点的样式确定为视图节点的第一样式信息。
15.根据权利要求9所述的装置,其特征在于,所述装置还包括:
删除模块,用于删除所述抽象语法树中的所述第一样式信息。
16.根据权利要求9所述的装置,其特征在于,所述第三获取模块包括:
第二生成单元,用于在所述视图节点的格式为未封装格式的情况下,生成所述未封装格式的所述第二样式信息;
第三生成单元,用于在所述视图节点的格式为封装格式的情况下,生成所述封装格式的所述第二样式信息;
第四生成单元,用于在所述视图节点的格式同时包括所述未封装格式和所述封装格式的情况下,生成所述未封装格式的所述第二样式信息;
第五生成单元,用于在无法确定所述视图节点的格式的情况下,生成所述封装格式的所述第二样式信息。
17.一种电子设备,其特征在于,所述电子设备包括:
处理器;
用于存储处理器可执行指令的存储器;
其中,所述处理器被配置为执行如权利要求1-8任一项所述的样式信息的处理方法。
18.一种非临时性计算机可读存储介质,当所述存储介质中的指令由电子设备的处理器执行时,使得电子设备能够执行如权利要求1-8任一项所述的样式信息的处理方法。
CN201910828476.7A 2019-09-03 2019-09-03 一种样式信息的处理方法及装置 Active CN110704053B (zh)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN201910828476.7A CN110704053B (zh) 2019-09-03 2019-09-03 一种样式信息的处理方法及装置

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN201910828476.7A CN110704053B (zh) 2019-09-03 2019-09-03 一种样式信息的处理方法及装置

Publications (2)

Publication Number Publication Date
CN110704053A true CN110704053A (zh) 2020-01-17
CN110704053B CN110704053B (zh) 2023-05-23

Family

ID=69194019

Family Applications (1)

Application Number Title Priority Date Filing Date
CN201910828476.7A Active CN110704053B (zh) 2019-09-03 2019-09-03 一种样式信息的处理方法及装置

Country Status (1)

Country Link
CN (1) CN110704053B (zh)

Cited By (4)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN111638880A (zh) * 2020-05-29 2020-09-08 山东浪潮通软信息科技有限公司 节点信息展示方法、装置、存储介质和计算机可读介质
CN111897523A (zh) * 2020-06-29 2020-11-06 北京金茂绿建科技有限公司 一种信息显示方法和装置
CN112231619A (zh) * 2020-10-15 2021-01-15 北京三快在线科技有限公司 转换方法、装置、电子设备及存储介质
CN112559109A (zh) * 2020-12-28 2021-03-26 携程旅游网络技术(上海)有限公司 基于组件库的显示界面的生成方法及系统、设备及介质

Citations (13)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
JP2879099B1 (ja) * 1998-02-26 1999-04-05 工業技術院長 抽象構文木処理方法、抽象構文木処理プログラムを記録したコンピュータ読み取り可能な記録媒体、抽象構文木データを記録したコンピュータ読み取り可能な記録媒体、及び、抽象構文木処理装置
US8745027B1 (en) * 2011-04-11 2014-06-03 Google Inc. Jslayout cascading style sheets optimization
JP2016051367A (ja) * 2014-09-01 2016-04-11 日本電気通信システム株式会社 データ解析装置、データ解析方法、および、プログラム。
CN107239318A (zh) * 2017-06-13 2017-10-10 腾讯科技(深圳)有限公司 应用转换方法、装置及设备
CN108170435A (zh) * 2018-01-16 2018-06-15 优视科技新加坡有限公司 一种源代码转换方法、装置及设备
CN108228184A (zh) * 2018-01-26 2018-06-29 福建中金在线信息科技有限公司 页面样式生成方法、装置、电子设备和计算机存储介质
CN108255485A (zh) * 2017-09-22 2018-07-06 优视科技有限公司 页面搭建方法、设备及电子设备
CN108268262A (zh) * 2017-12-27 2018-07-10 广东耐思尼克信息技术有限公司 实现将html转换为微信小程序的方法、装置及系统
EP3425496A1 (en) * 2017-07-07 2019-01-09 Beijing Xiaomi Mobile Software Co., Ltd. Method and device for supporting multi-framework syntax
CN109815455A (zh) * 2019-02-02 2019-05-28 天津字节跳动科技有限公司 项目文件处理方法和装置
CN109918073A (zh) * 2019-01-29 2019-06-21 维沃移动通信有限公司 一种源码文件的生成方法、装置以及终端
CN109947433A (zh) * 2019-03-28 2019-06-28 优信拍(北京)信息科技有限公司 一种小程序的生成方法、更新方法及装置
CN110109681A (zh) * 2019-05-08 2019-08-09 上海携程商务有限公司 不同平台间代码的转换方法及系统

Patent Citations (13)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
JP2879099B1 (ja) * 1998-02-26 1999-04-05 工業技術院長 抽象構文木処理方法、抽象構文木処理プログラムを記録したコンピュータ読み取り可能な記録媒体、抽象構文木データを記録したコンピュータ読み取り可能な記録媒体、及び、抽象構文木処理装置
US8745027B1 (en) * 2011-04-11 2014-06-03 Google Inc. Jslayout cascading style sheets optimization
JP2016051367A (ja) * 2014-09-01 2016-04-11 日本電気通信システム株式会社 データ解析装置、データ解析方法、および、プログラム。
CN107239318A (zh) * 2017-06-13 2017-10-10 腾讯科技(深圳)有限公司 应用转换方法、装置及设备
EP3425496A1 (en) * 2017-07-07 2019-01-09 Beijing Xiaomi Mobile Software Co., Ltd. Method and device for supporting multi-framework syntax
CN108255485A (zh) * 2017-09-22 2018-07-06 优视科技有限公司 页面搭建方法、设备及电子设备
CN108268262A (zh) * 2017-12-27 2018-07-10 广东耐思尼克信息技术有限公司 实现将html转换为微信小程序的方法、装置及系统
CN108170435A (zh) * 2018-01-16 2018-06-15 优视科技新加坡有限公司 一种源代码转换方法、装置及设备
CN108228184A (zh) * 2018-01-26 2018-06-29 福建中金在线信息科技有限公司 页面样式生成方法、装置、电子设备和计算机存储介质
CN109918073A (zh) * 2019-01-29 2019-06-21 维沃移动通信有限公司 一种源码文件的生成方法、装置以及终端
CN109815455A (zh) * 2019-02-02 2019-05-28 天津字节跳动科技有限公司 项目文件处理方法和装置
CN109947433A (zh) * 2019-03-28 2019-06-28 优信拍(北京)信息科技有限公司 一种小程序的生成方法、更新方法及装置
CN110109681A (zh) * 2019-05-08 2019-08-09 上海携程商务有限公司 不同平台间代码的转换方法及系统

Non-Patent Citations (2)

* Cited by examiner, † Cited by third party
Title
BAOJIANG CUI: "Code Comparison System based on Abstract Syntax Tree" *
DEVOLPERFRONT: "学不动了 ,京东跨端移动开发平台 Ares 发布!", 《CSDN HTTPS://BLOG.CSDN.NET/DEVOLPERFRONT/ARTICLE/DETAILS/90628528?》 *

Cited By (6)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN111638880A (zh) * 2020-05-29 2020-09-08 山东浪潮通软信息科技有限公司 节点信息展示方法、装置、存储介质和计算机可读介质
CN111638880B (zh) * 2020-05-29 2023-10-13 浪潮通用软件有限公司 节点信息展示方法、装置、存储介质和计算机可读介质
CN111897523A (zh) * 2020-06-29 2020-11-06 北京金茂绿建科技有限公司 一种信息显示方法和装置
CN111897523B (zh) * 2020-06-29 2024-03-15 北京金茂绿建科技有限公司 一种信息显示方法和装置
CN112231619A (zh) * 2020-10-15 2021-01-15 北京三快在线科技有限公司 转换方法、装置、电子设备及存储介质
CN112559109A (zh) * 2020-12-28 2021-03-26 携程旅游网络技术(上海)有限公司 基于组件库的显示界面的生成方法及系统、设备及介质

Also Published As

Publication number Publication date
CN110704053B (zh) 2023-05-23

Similar Documents

Publication Publication Date Title
US10705780B2 (en) Method, device, and storage medium for displaying application page
CN110704053B (zh) 一种样式信息的处理方法及装置
CN109032606B (zh) 原生应用程序的编译处理方法、装置及终端
CN106569800B (zh) 前端界面生成方法及装置
EP2924591A1 (en) Method and device for controlling page rollback
CN107423106B (zh) 支持多框架语法的方法和装置
US10909203B2 (en) Method and device for improving page display effect via execution, conversion and native layers
CN107203398B (zh) 应用分发方法及装置
CN107193606B (zh) 应用分发方法及装置
CN110704059B (zh) 图像处理方法、装置、电子设备及存储介质
CN105786944B (zh) 浏览器自动翻页的处理方法和装置
CN106815291B (zh) 搜索结果项展现方法、装置和用于搜索结果项展现的装置
CN111752598A (zh) 页面生成方法、装置、电子设备及存储介质
CN106708967B (zh) 页面显示方法及装置
CN106503048B (zh) 浏览器颜色设置方法和装置
CN111814088A (zh) 一种页面处理方法及装置
US11210449B2 (en) Page display method and device and storage medium
CN105468606B (zh) 网页保存的方法及装置
CN104951522B (zh) 一种进行搜索的方法和装置
CN113128181B (zh) 一种信息处理方法及装置
CN110457084B (zh) 一种加载方法及装置
CN112182449A (zh) 页面加载方法、装置、电子设备及存储介质
CN107423060B (zh) 动画效果的呈现方法、装置及终端
CN110795444B (zh) Dom数据更新方法、页面更新方法及装置
US9679076B2 (en) Method and device for controlling page rollback

Legal Events

Date Code Title Description
PB01 Publication
PB01 Publication
SE01 Entry into force of request for substantive examination
SE01 Entry into force of request for substantive examination
GR01 Patent grant
GR01 Patent grant