WO2011097965A1 - 一种用户界面的生成方法和装置 - Google Patents

一种用户界面的生成方法和装置 Download PDF

Info

Publication number
WO2011097965A1
WO2011097965A1 PCT/CN2011/070068 CN2011070068W WO2011097965A1 WO 2011097965 A1 WO2011097965 A1 WO 2011097965A1 CN 2011070068 W CN2011070068 W CN 2011070068W WO 2011097965 A1 WO2011097965 A1 WO 2011097965A1
Authority
WO
WIPO (PCT)
Prior art keywords
layer
drawn
attribute information
user interface
style
Prior art date
Application number
PCT/CN2011/070068
Other languages
English (en)
French (fr)
Inventor
周桓宇
顾晓元
涂强
Original Assignee
腾讯科技（深圳）有限公司
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 腾讯科技（深圳）有限公司 filed Critical 腾讯科技（深圳）有限公司
Priority to CA2789684A priority Critical patent/CA2789684C/en
Priority to MX2012009334A priority patent/MX2012009334A/es
Priority to RU2012137767/08A priority patent/RU2530272C2/ru
Priority to BR112012020136-0A priority patent/BR112012020136B1/pt
Publication of WO2011097965A1 publication Critical patent/WO2011097965A1/zh
Priority to US13/571,543 priority patent/US20120313956A1/en

Links

Classifications

    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06T—IMAGE DATA PROCESSING OR GENERATION, IN GENERAL
    • G06T11/00—2D [Two Dimensional] image generation
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F8/00—Arrangements for software engineering
    • G06F8/30—Creation or generation of source code
    • G06F8/34—Graphical or visual programming
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F8/00—Arrangements for software engineering
    • G06F8/30—Creation or generation of source code
    • G06F8/38—Creation or generation of source code for implementing user interfaces

Definitions

  • the present invention relates to the field of Internet technologies, and in particular, to a method and an apparatus for generating a user interface. Background of the invention
  • the user interface is a window for interacting with the user.
  • the user interface operates the client software to complete the corresponding functions.
  • the initial user interface design tends to design a program interface that satisfies most users' perceptions.
  • the user interface is designed to be more user-friendly and more in line with the user's personal aesthetic habits.
  • more and more application support allows users to customize the interface, which is commonly referred to as "skinning.” For example, instant messaging, which relies heavily on the user experience, "skinning" is a very important feature.
  • the application stores a plurality of different styles of user interfaces in advance for the user to select.
  • a user interface is selected from the alternative user interface to switch, thereby achieving skinning.
  • the interface element uses only a single texture resource, the performance capability is limited, and it is unable to achieve more and more performance in the modern interface design.
  • a set of image resources in the skin must be consistent in style. Therefore, all images must be reloaded when skinning.
  • the number of images used in the application interface is increasing, and UI designers must design a large number of images for the skin package, which is costly. Therefore, in the prior art, there is a defect that the user interface is single and the skin is inconvenient. Summary of the invention
  • the present invention provides a method and apparatus for generating a user interface for providing different user interfaces according to user requirements.
  • the invention provides a method for generating a user interface, the method comprising:
  • the post-rendered layers are combined to generate a user interface.
  • the present invention provides a device for generating a user interface, the device comprising:
  • An obtaining module configured to obtain a layer to be drawn and a layer style to be drawn
  • a layer generating module configured to extract attribute information of the layer according to the layer style, and draw the layer to be drawn according to the extracted attribute information, and generate a layer after drawing;
  • An interface generation module is configured to combine the drawn layers to generate a user interface.
  • the invention also provides a method for generating a user interface, the user interface comprising a plurality of layers, the method comprising the following steps:
  • the present invention has the following advantages: According to the needs of the user, different layers of the user interface are generated, different layers are layered to obtain the final user interface, and the user interface can be dynamically changed by changing the properties of the layer. , thereby realizing the diversification of the user interface and improving the easy replacement of the user interface. BRIEF DESCRIPTION OF THE DRAWINGS
  • FIG. 1 is a method for generating a user interface according to an embodiment of the present invention
  • FIG. 2 is an overall user interface provided in an embodiment of the present invention
  • FIG. 3 is a plurality of layers of an overall user interface provided in an embodiment of the present invention
  • FIG. 4 is a flowchart of a method for generating a user interface according to an embodiment of the present invention
  • Figure 5 (a) is a schematic structural view of a layer in an embodiment of the present invention.
  • FIG. 5(b) is a schematic structural diagram of a plurality of layers stacked in an embodiment of the present invention
  • FIG. 5(c) is a schematic structural view of a user interface stacked by a plurality of layers in the embodiment of the present invention
  • FIG. 6 is a logical division of a layer of a user interface in an embodiment of the present invention.
  • FIG. 7 is a schematic diagram of a user layer of a user interface according to an embodiment of the present invention
  • FIG. 8 is a schematic diagram of a method for generating a user interface according to an embodiment of the present invention
  • FIG. FIG. 10 is a schematic diagram of a background layer of a background layer according to an embodiment of the present invention
  • FIG. Figure 11 is a color layer of a background layer in an embodiment of the present invention
  • Figure 12 is a texture layer of an embodiment of the present invention.
  • Figure 15 is a blue layer of a mask layer in an embodiment of the present invention.
  • FIG. 16 is a schematic diagram of a device for generating a user interface according to an embodiment of the present invention. Mode for carrying out the invention
  • an embodiment of the present invention provides a method for generating a user interface, which specifically includes the following steps:
  • Step 101 Acquire a layer to be drawn and a layer style to be drawn
  • Step 102 Extract, according to the layer style, attribute information of the layer, and draw the layer to be drawn according to the extracted attribute information, and generate a layer after the drawing;
  • Step 103 Combine the drawn layers to generate a user interface.
  • the interface includes: a background image of the tiger, two controls "OK” and “Cancel” for interacting with the user.
  • an embodiment of the present invention provides a device for generating a user interface.
  • the basic unit for generating the user interface is a layer.
  • the so-called layer a complete user interface is separated into several drawing levels, each layer generates a level of the entire user interface, and finally all layers are superimposed and combined to obtain the final user interface.
  • the content of a portion of the layer is selectively replaceable and/or changeable.
  • Figure 3 As shown, in order to separate the complete user interface as shown in Figure 2, multiple levels can be obtained, such as: the background layer carrying the tiger picture, the control layer carrying the "OK" and "Cancel" controls, and so on. It can be seen that the key to user interface generation is the generation of each layer and the combination between multiple layers, and the generation of each layer and the combination of multiple layers are set by setting the attributes of the layer. And cascading implementation of different layers.
  • the layer is generated by extracting the attribute information of the layer to be drawn according to the preset layer style to be drawn, setting the layer to be drawn according to the attribute information, and generating the drawn layer.
  • a method for generating a user interface specifically includes the following steps:
  • Step 401 Acquire a layer to be drawn and a layer style to be drawn.
  • the layer is a complete drawing layer separated by the user interface. Therefore, in the process of drawing the user interface, multiple layers can be drawn by drawing each drawing level of the user interface, that is, each layer. Cascade, get the complete user interface. Among them, the style of each drawing layer is the layer style of the corresponding layer.
  • the user interface is drawn in a pre-set style.
  • the user interface consists of multiple layers, each layer carrying a partial style of the user interface, namely the layer style. Therefore, to complete the overall setup of the user interface, you first need to get the layer styles that each layer carries.
  • Step 402 Extract, according to the layer style, attribute information of the layer, and draw the layer to be drawn according to the extracted attribute information, and generate a layer after drawing.
  • the properties of a layer are mainly divided into two categories: properties for setting their own styles, and properties for layering with other layers, generally including: (1) image content properties; (2) transparency properties; (3) Drawing mode attributes and (4) mixed mode attributes, the functions of the above attributes are explained in further detail below.
  • the color data on the layer is formed by controlling the colors of the layers Content.
  • the image content attribute of the layer is obtained by loading a conventional picture file (of course, it can also be specified by setting specific color data). After the image file is loaded, the layer's color data and size are no longer changed.
  • the layer located above blocks the layer below. Therefore, whether it is the needs of the layer itself or the need to overlay with other layers, you need to set the transparency property of the layer.
  • the transparency property of the layer is dynamically modified, and of course other properties of the layer can be dynamically modified.
  • the transparency property is modified periodically to produce a fade-in fade effect in the production of two layers.
  • the size of the layer does not change, but the size of the user interface composed of the layer is usually adjustable.
  • the size of the Session window that is, the representation of the user interface
  • the setting of this property determines how the layer fills the entire session window, where the drawing mode properties include: tile mode, cascading mode, and so on.
  • the mixed mode attribute is the mixed calculation formula used to control the color between the layers, and the mixed layer is used to obtain the layers after the layering. The color data to get the new color.
  • the attribute information of the layer is extracted, and the attribute of the layer to be drawn is set according to the extracted attribute information, and the generating the layer after the drawing includes the following steps:
  • (1) According to the layer style, 4 is to extract each attribute information of the corresponding layer.
  • the drawing mode corresponding to the layer style is tiled, and the corresponding image content is a specified picture.
  • the attribute information of the extracted layer according to the layer style specifically includes one or more of the following:
  • the drawing the to-be-drawn layer according to the extracted attribute information includes:
  • the image content of the layer to be drawn is a specified picture, load the picture and extract the color data. If the drawing mode of the layer to be drawn is tiled, the layer is tiled in the session window when the layer has a larger session window and the layer is smaller.
  • Step 403 Combine the drawn layers to generate a user interface. As shown in FIG. 5( a ), it is a layer in the embodiment of the present invention, as shown in layer n. Figure 5
  • the final user interface consists of a number of presentation elements: basemap, background, image border shape, image border shadow, and controls.
  • basemap basemap
  • background image border shape
  • image border shadow controls.
  • all layers that make up a user interface are logically divided into four logical levels, each of which can have multiple layers.
  • the drawing of each layer itself does not have special functionality.
  • the logical layer is the result of drawing several layers and is given certain functional goals for performing specific functions.
  • the above four logical levels are generated in turn, and the generated four logical levels are cascaded to obtain the final user interface.
  • the four logical levels are: (1) logical layer 1 - background layer, (2) logical layer 2 - texture layer, (3) logic layer 3 - control layer and (4) logic layer 4 - Mask layer.
  • a method for generating a user interface includes the following steps:
  • Step 801 Draw a background layer of the user interface.
  • the background layer consists of two layers, a color layer and a picture layer.
  • the main function of this logic layer is to complete the drawing of the entire background of the user interface (such as Windows session window).
  • the background layer is the main visual part of the entire user interface and can be replaced as the user likes.
  • the color of the color layer in the background layer needs to be consistent with the overall color of the image of the image layer to ensure the visual effect (of course, the color of the color layer can also be specified). Therefore, the color of the background layer is automatically calculated by the program, and the generation algorithm is a commonly used octree color quantization method, and a statistical picture. The highest frequency appears in the color and gives an average color close to the overall hue.
  • the background layer includes: a picture replacement module 11 and a color calculation module 13.
  • the picture replacement module 11 receives the replacement background picture request and replaces it according to the picture selected by the user.
  • the picture replacing module 11 notifies the picture layer 12 to reload the picture and read the color data of the loaded picture; after the picture layer 12 reads the color data, the color data is transferred to the color calculation module 13;
  • the calculation module 13 calculates a color close to the overall hue of the picture, and then passes the color to the color layer 14; the color layer 14 stores the color value.
  • the picture replacement module 11 and the color calculation module 13 do not participate in the usual image drawing process. After the picture layer 12 and the color layer 14 are superimposed and drawn, the main background content of the entire window is displayed; on the other hand, the other interface is displayed. The logical layer of detail.
  • Step 802 Superimpose the texture layer of the user interface.
  • This layer mainly superimposes a layer with lighting effects on the background layer.
  • the background layer is a flat picture in the entire drawing area because it is only a superposition of pictures and colors.
  • a regular Windows session window consists of a title bar, a client area, and a status bar.
  • the texture layer draws a layer with only luminance information on the background, and changes the brightness of the background layer to distinguish the logical regions of the Windows session window on the background.
  • the brightness information is determined by setting the color data of the image content attribute.
  • This logical layer does not need to be adjusted by the user, so it is fixed.
  • Step 803 superimposing the control layer of the user interface.
  • Each session window is distributed with controls, such as Windows buttons, text boxes, and list boxes.
  • the controls in the above session window are drawn at this level. Wherein, the layer only needs to extract the image Attributes, get the preset control style.
  • control layer is shown in Figure 13.
  • Step 804 superimposing a mask layer of the user interface.
  • This logical layer is drawn after the other levels have been drawn, so the drawing of this layer can obscure all the controls on the session window.
  • This mask layer is mainly used to: Provide a border for the session window and a shadow for the border of the session window. Accordingly, the mask layer includes a border shape layer and a border shadow layer.
  • the layers formed by the above layers are generally rectangular areas, such as: the picture and the background color in the background layer, and the rendering results are all in the form of rectangular areas.
  • the edges of the session window are generally rounded, or irregular edges.
  • the mask layer uses an extra layer to define the edge of the window on the previously acquired rectangle, thus forming the border of the session window.
  • the determination of the session window border is achieved by a mixture of additional layers and attribute information of previously acquired rectangular layers according to the mixed mode attribute.
  • the color data and transparency data of each pixel in the image include four channels of a (transparency), r (red), g (green), and b (blue), and the mixed multiplication formula is as follows:
  • Dst b Src b * Dst b
  • Src the layer used to define the edge of the window, the content of which is a picture with transparency, which can be customized by the UI
  • Dst is the image content of the currently drawn layer.
  • the color of the pixel in Src is purely transparent (the four channels of a, r, g, and b are all 0), and the calculated result is purely transparent; the color of the pixel in Src is pure white (a, r, g, b The four channels are all part of 1), and the calculated result remains the content before drawing. This allows the UI designer to control the shape of the border after the session window is drawn by customizing the image content.
  • the drawing of the border of the session window can be implemented by a template, as shown in FIG. 14, which is a multiplication template of the mask layer.
  • the layer content is a picture designed and designed by UI staff. After layer processing of the control border, the result of each layer drawing has a certain edge shape.
  • the shadow layer only needs to be made as a transparent texture with ' ⁇ conforming to the edge shape.
  • the blue layer of the mask layer is used to form the shadow of the session window border.
  • the foregoing embodiment of the present invention only introduces the extraction of the main attribute information in the layer and the drawing of the layer by the main attribute information, and the attributes of each layer are not limited to the attributes in the embodiment of the present invention, and The various attributes extracted from the layer style for drawing layers are within the scope of the present invention, such as audio attributes and the like.
  • the above-mentioned logical layer is only a preferred embodiment of the present invention, and any layer separated from the user interface belongs to the protection scope of the present invention, such as a dynamic effect layer.
  • the embodiment of the present invention provides a device for generating a user interface.
  • the device 1600 includes: an obtaining module 1610, configured to acquire a layer to be drawn and a layer to be drawn; a layer generating module 1620, according to the layer Style, extract the attribute information of the layer, And the layer to be drawn is drawn according to the extracted attribute information, and the layer after the drawing is generated; the interface generating module 1630 is configured to combine the layer after the drawing to generate a user interface.
  • the post-rendering layer includes one or more of the following: a background layer; a texture layer; a control layer; a mask layer;
  • the attribute information includes: image content; transparency; drawing mode; mixed mode.
  • the layer generating module 1620 includes an extracting sub-module 1621, specifically configured to: obtain a picture file to be loaded according to the layer style; obtain color data according to the picture file, where the color data is the to-be-drawn picture Image attribute information of the layer; or, extracting transparency attribute information of the layer to be drawn according to the layer style and other layer layering effects;
  • the extraction submodule 1621 is specifically configured to:
  • the extraction submodule 1621 is specifically configured to:
  • Color data of the currently drawn layer by a color mixture multiplication formula The color data of the border defining layer is mixed to obtain color data of a layer border of the layer to be drawn.
  • the layer generating module 1620 includes a drawing sub-module 1622, specifically configured to: traverse the extracted attribute information; when the attribute information is not empty, draw the to-be-drawn layer according to the attribute information.
  • the interface generating module 1630 is specifically configured to perform lamination combining at least two post-painting layers to generate the user interface.
  • the modifying module 1640 is configured to dynamically modify attributes of the drawn layer.
  • the invention has the following advantages: according to the needs of the user, different layers of the user interface are generated, different layers are layered to obtain the final user interface, and the user interface can be dynamically changed by changing the properties of the layer, thereby realizing the user interface. Diversify and improve the interchangeability of the user interface.
  • the user interface is divided into multiple layers, the visual effect of the entire user interface can be changed by replacing some of the layers.
  • the user can customize the personalized user interface using his own picture, and the style of the entire user interface can be automatically adjusted accordingly. Therefore, the interface generation method of the present invention is not only convenient for skinning, but also does not need to save a large number of pictures in advance.
  • the present invention can be implemented by means of software plus a necessary general hardware platform, and of course, can also be through hardware, but in many cases, the former is a better implementation. the way.
  • the technical solution of the present invention which is essential or contributes to the prior art, may be embodied in the form of a software product stored in a storage medium, including a plurality of instructions for making a
  • the terminal device (which may be a cell phone, a personal computer, a server, or a network device, etc.) performs the methods described in various embodiments of the present invention.
  • modules in the apparatus in the embodiments may be distributed in the apparatus of the embodiment according to the embodiment, or may be changed in one or more apparatuses different from the embodiment.
  • the modules of the above embodiments may be integrated into one or may be deployed separately; they may be combined into one module, or may be further split into multiple sub-modules.

Landscapes

  • Engineering & Computer Science (AREA)
  • Theoretical Computer Science (AREA)
  • Software Systems (AREA)
  • General Engineering & Computer Science (AREA)
  • Physics & Mathematics (AREA)
  • General Physics & Mathematics (AREA)
  • Human Computer Interaction (AREA)
  • Image Generation (AREA)
  • User Interface Of Digital Computer (AREA)
  • Processing Or Creating Images (AREA)

Description

一种用户界面的生成方法和装置 本专利申请要求于 2010年 2月 11日向中国国家知识产权局递交的、 申请号为 "201010109033.1"、题目为 "一种用户界面的生成方法和装置" 的发明专利申请的优先权。 技术领域
本发明涉及互联网技术领域， 尤其涉及一种用户界面的生成方法和 装置。 发明背景
随着网络技术和软件开发的发展， 越来越多的人们通过各种各样的 客户端软件实现各种功能， 如： 即时通讯软件， 音乐盒， 邮箱等。 对于 客户端软件来说， 用户界面 （ UI, User Interface )是与用户进行交互的 窗口， 人们通过用户界面来操作客户端软件完成相应的功能。 初期用户 界面的设计，倾向于设计出一个满足大多数用户感受的程序界面。然而， 由于用户的习惯、 生活环境， 层次等等各不相同， 一款用户界面不可能 满足所有用户的感受， 并且随着用户群的日益庞大， 这个问题变得越来 越突出。 用户界面的设计在朝着更吸引用户， 更能符合用户个人审美习 惯的方向发展。 为了适应不同用户的审美习惯和需求， 越来越多的应用 程序支持让用户定制界面， 也就是通常称作的 "换肤"。 如即时通讯这 类极度依赖用户使用体验的软件， "换肤" 是非常重要的一项功能。
现有技术中， 应用程序预先存储有多种不同风格的用户界面， 以供 用户选择。 当用户需要进行换肤时， 从备选的用户界面中选择一种用户 界面， 进行切换， 从而实现换肤。 由上述现有技术可知， 由于界面元素只采用单一的贴图资源， 表现 能力有限， 无法达到现代界面设计上越来越多的表现。 此外， 一套皮肤 中的图片资源， 风格必须保持一致。 因此换肤时， 所有的图片都必须重 新加载。 而应用程序界面中所使用的图片越来越多， UI设计人员必须针 对皮肤包设计大量的图片， 成本高昂。 因此， 现有技术中存在用户界面 单一且换肤不便的缺陷。 发明内容
本发明提供了一种用户界面的生成方法及装置， 用于根据用户需求 提供不同的用户界面。
本发明提供了一种用户界面的生成方法， 该方法包括：
获取待绘制图层和待绘制的图层样式；
根据所述图层样式， 提取图层的属性信息， 并根据所提取的属性信 息绘制所述待绘制图层， 生成绘制后图层；
将所述绘制后图层进行组合， 生成用户界面。
本发明提供了一种用户界面的生成装置， 该装置包括：
获取模块， 用于获取待绘制图层和待绘制的图层样式；
图层生成模块， 用于根据所述图层样式， 提取图层的属性信息， 并 根据所提取的属性信息绘制所述待绘制图层， 生成绘制后图层；
界面生成模块， 用于将所述绘制后图层进行组合， 生成用户界面。 本发明还提供了一种用户界面的生成方法， 该用户界面包括多个图 层， 该方法包括以下步骤：
绘制背景层；
绘制控件层；
将包括所述背景层和所述控件层在内的所述多个图层进行组合， 生 成该用户界面。
与现有技术相比， 本发明具有以下优点： 根据用户的需求， 生成用 户界面的不同图层， 将不同图层进行层叠获取最终的用户界面， 并可通 过改变图层的属性动态改变用户界面， 从而实现了用户界面的多样化和 提高用户界面的易更换性。 附图简要说明
为了更清楚地说明本发明或现有技术中的技术方案， 下面将对本发 明或现有技术描述中所需要使用的附图作筒单地介绍， 显而易见地， 下 面描述中的附图仅仅是本发明的一些实施例， 对于本领域普通技术人员 来讲， 在不付出创造性劳动性的前提下， 还可以根据这些附图获得其他 的附图。
图 1 为本发明实施例中提供的一种用户界面的生成方法； 图 2为本发明实施例中提供的整体用户界面；
图 3为本发明实施例中提供的整体用户界面的多个图层； 图 4为本发明实施例中用户界面的生成方法的流程图；
图 5 ( a ) 为本发明实施例中一个图层的结构示意图；
图 5 ( b ) 为本发明实施例中多个图层层叠的结构示意图； 图 5 ( c )为本发明实施例中由多个图层层叠所的用户界面的结构示 意图；
图 6为本发明实施例中用户界面的图层的逻辑划分；
图 7为本发明实施例中用户界面的图层按逻辑后的图层结构； 图 8 为本发明实施例中提供的一种用户界面的生成方法； 图 9为本发明实施例中用户界面的背景层的结构示意图； 图 10 为本发明实施例中背景层的图片图层； 图 11 为本发明实施例中背景层的颜色图层；
图 12 为本发明实施例的质感层；
图 13 为本发明实施例的控件层；
图 14 为本发明实施例中遮罩层的乘法模板；
图 15 为本发明实施例中遮罩层的蓝光图层；
图 16为本发明实施例中提供的一种用户界面的生成装置。 实施本发明的方式
下面将结合本发明中的附图， 对本发明的技术方案进行清楚、 完整 地描述， 显然， 所描述的实施例是本发明一部分实施例， 而不是全部的 实施例。 基于本发明中的实施例， 本领域普通技术人员在没有做出创造 性劳动前提下所获得的所有其他实施例， 都属于本发明保护的范围。
如图 1 所示， 本发明实施例提供一种用户界面的生成方法， 具体包 括以下步骤：
步骤 101、 获取待绘制图层和待绘制的图层样式；
步骤 102、 根据所述图层样式， 提取图层的属性信息， 并根据所提 取的属性信息绘制所述待绘制图层， 生成绘制后图层；
步骤 103、 将所述绘制后图层进行组合， 生成用户界面。
如图 2所示， 为一个完成的用户界面， 从中可以看出， 该界面包括： 一个老虎的背景图片，用于与用户进行交互的 2个控件 "确定"和 "取消"。
为实现上述本发明实施例的技术方案， 本发明实施例提供一种用户界 面的生成装置。 该装置中， 用于生成用户界面的基本单元为图层。 所谓图 层， 即将一个完整的用户界面分离成若干绘图层次， 每一个图层生成整个 用户界面的一个层次， 最后将所有的层次进行叠加、 组合， 获取最终的用 户界面。 优选地， 部分图层的内容可进行选择性替换和 /或更改。 如图 3 所示， 为将如图 2所示的完整的用户界面进行分离， 从中可以获得多个层 次， 如： 承载老虎图片的背景层， 承载 "确定" 和 "取消" 控件的控件层 等等。 由此可知， 用户界面生成的关键是每一个图层的生成和多个图层之 间的组合， 而上述每一个图层的生成和多个图层之间的组合均通过设置图 层的属性和不同图层的层叠实现。
以下， 首先对生成用户界面的基本单元 "图层"的生成进行详细介绍。 图层的生成主要是根据预先设置的待绘制图层样式提取待绘制图层 的属性信息， 根据属性信息设置该待绘制图层， 生成所绘制后的图层。 具 体地， 如图 4所示， 一个用户界面的生成方法具体包括以下步骤：
步骤 401、 获取待绘制图层和待绘制的图层样式。
图层为一个完整的用户界面分离而得的绘图层次， 因此， 在绘制用户 界面的过程中， 可以通过绘制该用户界面的每一个绘图层次， 即每一个图 层， 再将多个图层进行层叠， 得到完整的用户界面。 其中， 每一个绘图层 次的样式即为对应图层的图层样式。
用户界面是按照预先设置的样式绘制而成。 而用户界面由多个图层组 成， 每一个图层承载该用户界面的部分样式， 即图层样式。 因此， 要完成 用户界面的整体设置， 首先需要获取每一图层所承载的图层样式。
步骤 402、 根据所述图层样式， 提取图层的属性信息， 并根据所提 取的属性信息绘制所述待绘制图层， 生成绘制后图层。
图层的属性主要分为两大类： 用于设置自身样式的属性， 和用于与其 他图层进行层叠的属性， 一般包括： （1 )图像内容属性； （2 )透明度属性； ( 3 )绘制模式属性和（4 ) 混合模式属性， 以下分别对上述属性的功能进 行进一步详细的阐述。
( 1 ) 图像内容属性
即该图层上的颜色数据， 通过控制图层各处的颜色形成该图层的图像 内容。优选地， 图层的图像内容属性通过加载常规的图片文件得到（当然， 也可以通过设置具体的颜色数据进行指定）。 图片文件的加载完成之后， 图层的颜色数据和尺寸不再改变。
( 2 )透明度属性
由于本发明实施例中一个完整的用户界面是经由多个图层叠加组合 而获得的， 此时位于上面的图层会遮挡住位于下面的图层。 因此无论是图 层本身的需要， 还是与其他图层进行叠加组合时的需要， 都需要设置图层 的透明度属性。
优选地， 动态修改图层的透明度属性， 当然也可以动态修改图层的其 他属性。 例如： 在程序运行期间， 定时修改透明度属性， 从而在产生两个 图层产生渐隐渐显效果。
( 3 )绘制模式属性
根据图像内容属性中的描述， 当图层的图像内容选 4奪后， 图层的尺寸 是不会变化的，但该图层组成的用户界面的尺寸通常都是可调节的。例如： 如在 Windows系统下， 会话窗口 （ Window ) (即用户界面的表现形式 )的 尺寸是可以随意调节的。 此时， 通过该属性的设置以确定图层如何填充整 个会话窗口， 其中绘制模式属性包括： 平铺模式， 层叠模式等。
( 4 )混合模式属性
当图层叠加绘制时， 层与层重叠位置的两个颜色数据需要进行混合， 混合模式属性即为用于控制图层之间颜色的混合计算公式， 通过混合计 算， 获取层叠后图层各处的颜色数据， 从而获取新的颜色。
具体地， 根据图层样式， 提取图层的属性信息， 并根据所提取的属 性信息对所述待绘制图层的属性进行设置， 生成绘制后图层包括以下步 骤：
( 1 )根据图层样式， 4是取出对应图层的各个属性信息。 例如： 该图层样式对应的绘制模式为平铺， 对应的图像内容为某一指 定的图片等。
( 2 )根据所提取的属性信息对所述待绘制图层的属性进行设置， 生 成绘制后图层。
具体地， 所述根据所述图层样式， 提取图层的属性信息具体包括以 下中的一种或多种：
( 1 )根据所述图层样式获取所需加载的图片文件；根据所述图片文 件获取颜色数据， 所述颜色数据为所述待绘制图层的图像内容属性信 息；
( 2 )根据所述图层样式与其他图层层叠效果提取所述待绘制图层的 透明度属性信息；
( 3 )根据所述图层样式和所述图层所在的会话窗口提取所述待绘制 图层的绘制模式属性信息， 所述绘制模式属性用于确定所述待绘制图层 填充所述会话窗口的方式；
( 4 )根据所述图层样式和不同图层层叠后的图层样式提取所述待绘 制图层的混合模式属性信息， 所述混合模式属性用于获取所述待绘制图 层的图层边框的颜色数据。
所述根据所提取的属性信息绘制所述待绘制图层包括：
( 1 )遍历提取的所述属性信息；
( 2 )当所述属性信息不为空时，根据所述属性信息绘制所述待绘制 图层。
例如： 如果待绘制图层的图像内容为某一指定的图片， 则加载图片并 提取颜色数据。 如果待绘制图层的绘制模式为平铺， 则在使用过程中， 当 该图层所在会话窗口较大而该图层较小时， 该图层平铺于该会话窗口。
步骤 403、 将所述绘制后图层进行组合， 生成用户界面。 如图 5 ( a )所示， 为本发明实施例中的一个图层， 如图层 n。 如图 5
( b )所示， 将获取到的 n个图层按照顺序由下至上进行叠加， 得到如图 5
( c )所示的整体的用户界面， 该界面有图层 1至图层 n层叠而成。
需要说明的是， 若干图层绘制后的图像结果， 也可作为一个图层来使 用。 因此，整个用户界面的绘制， 实际上是多个图层以树型结构组织而成。
再次， 对图 1中的用户界面进行分析， 该最终的用户界面由许多表现 元素组成： 底图、 底色、 图像边框形状、 图像边框阴影、 控件。 为了便于 获取任意用户界面， 如图 6所示， 从逻辑上将组成一个用户界面的所有图 层分为 4个逻辑层次， 每个逻辑层可以拥有多个图层。 每个图层本身的绘 制并不带有特殊的功能性， 逻辑层是若干图层绘制后的结果， 被赋予一定 的功能目标， 用于完成特定的功能。 在生成用户界面的过程中， 依次生成 上述 4个逻辑层次， 再将所生成的 4个逻辑层次进行层叠， 即可得到最终 的用户界面。 如图 7所示， 该 4个逻辑层次为： （1 )逻辑层 1 -背景层、 ( 2 )逻辑层 2 -质感层、 （3 )逻辑层 3 -控件层和（4 )逻辑层 4 -遮罩 层。
以下将结合具体附图， 分别对各个逻辑层次进行进一步详细的阐述。 如图 8所示， 本发明实施例提供的一种用户界面的生成方法包括以下 步骤：
步骤 801、 绘制用户界面的背景层。
背景层由两个图层构成， 分别是颜色图层和图片图层。 此逻辑层的主 要功能， 是完成用户界面（如 Windows会话窗口 )整个背景的绘制。 背景 层是整个用户界面主要的视觉部分， 并且可以随用户的喜好， 进行更换。 背景层中颜色图层的颜色， 需要与图片图层的图片的整体色调保持一致， 以保证视觉效果（当然也可以指定颜色图层的颜色）。 因此， 背景层的颜 色由程序自动计算生成， 生成算法为常用的八叉树颜色量化法， 统计图片 中出现频率最高的颜色， 并得出一个接近于整体色调的平均颜色。
如图 9所示， 该背景层包括： 图片更换模块 11和颜色计算模块 13。 当用户发起更换背景图片请求时， 图片更换模块 11接收该更换背景图片 请求， 并根据用户所选择的图片进行更换。 当用户更换背景图片后， 图片 更换模块 11 通知图片图层 12重新加载图片和读取所加载图片的颜色数 据； 图片图层 12读取颜色数据后， 将颜色数据传递给颜色计算模块 13; 颜色计算模块 13计算出一个接近图片整体色调的颜色， 然后将该颜色传 递给颜色图层 14; 颜色图层 14筒单存储该颜色值。
其中， 图片更换模块 11和颜色计算模块 13不参与平时的图像绘制过 程， 图片图层 12和颜色图层 14叠加绘制后， 作为整个窗口的主要背景内 容； 在其之上， 则是表现其他界面细节的逻辑层。
例如： 加载如图 10所示的图片文件作为图片图层， 并通过该图片文 件获取到如图 11所示的颜色图层。
步骤 802、 叠加绘制用户界面的质感层。
该层次主要在背景层上叠加一个具有光照效果的图层。 背景层由于只 是图片和颜色的筒单叠加， 因此在整个绘制区域中， 是一个平坦的图片。 而一个常规的 Windows会话窗口，由标题栏、客户区、状态栏等区域组成。 质感层绘制一个只有亮度信息的图层绘制在背景上， 改变背景层的亮度， 从而在背景上区分出 Windows会话窗口的各个逻辑区域，该亮度信息通过 设置图像内容属性的颜色数据而确定。
此逻辑层的内容， 不需要用户进行调整， 因此是固定不变的。
例如： 如图 12所示， 为一个只具有亮度信息的质感层。
步骤 803、 叠加绘制用户界面的控件层。
每一个会话窗口都会分布有控件， 如 Windows的按钮、 文本框、 列表 框， 上述会话窗口中的控件绘制在此层。 其中， 该此图层仅需提取图像内 容属性， 获取预设的控件样式即可。
例如： 该控件层如图 13所示。
在将该控件层与背景层、质感层进行叠加时，需要获取控件层的属性， 并将背景层的图像内容、 透明度属性与控件层的图像内容、 透明度属性混 来。
步骤 804、 叠加绘制用户界面的遮罩层。
该逻辑层绘制在其它层次绘制结束之后， 所以此层的绘制可以遮挡住 会话窗口上的所有控件。 该遮罩层主要用于： 为会话窗口提供边框和为会 话窗口边框提供阴影效果。 相应地， 该遮罩层包括边框形状图层和边框阴 影图层。
以下分别对上述两功能进行详细描述。
( a )边框形状图层
在绘制此图层之前， 经上述各个图层层叠绘制后形成的图层一般为矩 形区域， 如： 背景层中的图片和底色， 绘制结果都是以矩形区域的形式展 现。 而在一般用户界面设计中， 为了用户界面的美观， 会话窗口的边缘一 般呈圓角， 或不规则的边缘。 遮罩层即是使用一个额外的图层对之前获取 的矩形图层上定义窗口边缘， 从而形成会话窗口的边框。 优选地， 根据混 合模式属性， 通过额外的图层和之前获取的矩形图层的属性信息的混合来 实现会话窗口边框的确定。
具体地， 图像中每一个像素点的颜色数据和透明度数据， 包含 a (透 明度）、 r (红）、 g (绿）、 b (蓝）四个通道， 混合乘法公式如下所示：
Dsta= Srca * Dsta
Dstr= Srcr * Dstr
Figure imgf000012_0001
Dstb = Srcb * Dstb 其中， Src 为用于定义窗口边缘所采用的图层， 其内容为带透明度的 图片， 可由 UI进行定制； Dst为当前已经绘制好的图层的图像内容。
其中， Src中像素颜色为纯透明（a、 r、 g、 b四个通道都为 0 )的图层 部分， 计算得出的结果也是纯透明的； Src 中像素颜色纯白 （a、 r、 g、 b 四个通道都为 1 )的部分， 计算得出的结果保持绘制前的内容。 由此， UI 设计人员通过定制图片内容， 即可控制会话窗口绘制后的边框形状。
优选地， 对会话窗口边框的绘制可通过模板来实现， 如图 14所示， 为遮罩层的乘法模板。
( b )边框阴影图层
为了在会话窗口边缘的透明阴影， 只需要叠加一个带透明度的图层即 可。 该图层内容为 UI人员设计制作的图片。 经过控制边框的图层处理， 各层绘制的结果已具有了一定的边缘形状。 阴影图层只需要制作为 '^ί符 合边缘形状的透明贴图。
例如： 如图 15所示， 为遮罩层的蓝光图层， 用于形成会话窗口边框 的阴影。
最终， 经上述各个图层的绘制， 生成如图 2所示的用户界面。
需要说明的是， 上述本发明实施例仅对图层中主要属性信息的提取与 通过主要属性信息绘制图层进行了介绍， 每一个图层的属性并不限于本发 明实施例中的属性， 凡是从图层样式提取的用于绘制图层的各种属性均属 于本发明的保护范围， 如音频属性等。 此外， 上述划分出的逻辑图层仅为 本发明一种优选的实施方式， 凡是从用户界面分离出的图层均属于本发明 的保护范围， 如： 动态效果层等。
本发明实施例提供一种用户界面的生成装置， 该装置 1600包括： 获取模块 1610, 用于获取待绘制图层和待绘制的图层样式； 图层生成模块 1620,用于根据所述图层样式，提取图层的属性信息， 并根据所提取的属性信息绘制所述待绘制图层， 生成绘制后图层； 界面生成模块 1630, 用于将所述绘制后图层进行组合， 生成用户界 面。
其中， 所述绘制后图层包括以下中的一种或多种： 背景层； 质感层； 控件层； 遮罩层；
所述属性信息包括： 图像内容； 透明度； 绘制模式； 混合模式。 其中， 图层生成模块 1620包括提取子模块 1621 , 具体用于： 根据所述图层样式获取所需加载的图片文件； 根据所述图片文件获 取颜色数据， 所述颜色数据为所述待绘制图层的图像内容属性信息； 或者， 根据所述图层样式与其他图层层叠效果提取所述待绘制图层 的透明度属性信息；
或者， 根据所述图层样式和所述图层所在的会话窗口提取所述待绘 制图层的绘制模式属性信息， 所述绘制模式属性用于确定所述待绘制图 层填充所述会话窗口的方式；
或者， 根据所述图层样式和不同图层层叠后的图层样式提取所述待 绘制图层的混合模式属性信息， 所述混合模式属性用于获取所述待绘制 图层的图层边框的颜色数据。
其中， 提取子模块 1621具体用于：
根据所述图片文件获取所述图片文件自身的第一颜色数据； 根据所述图片文件获取与所述第一颜色数据匹配的第二颜色数据。 其中， 提取子模块 1621具体用于：
根据不同图层层叠后的图层样式获取边框定义图层；
获取当前已经绘制好的图层的颜色数据和所述边框定义图层的颜色 数据；
通过颜色混合乘法公式对所述当前已经绘制好的图层的颜色数据和 所述边框定义图层的颜色数据进行混合,获取所述待绘制图层的图层边框 的颜色数据。
其中， 图层生成模块 1620包括绘制子模块 1622, 具体用于： 遍历提取的所述属性信息； 当所述属性信息不为空时， 根据所述属 性信息绘制所述待绘制图层。
其中，所述界面生成模块 1630具体用于将至少两个绘制后图层进行 层叠组合， 生成所述用户界面。
其中， 还包括：
修改模块 1640, 用于动态修改所述绘制后图层的属性。
本发明具有以下优点：根据用户的需求，生成用户界面的不同图层， 将不同图层进行层叠获取最终的用户界面， 并可通过改变图层的属性动 态改变用户界面， 从而实现了用户界面的多样化和提高用户界面的易更 换性。 此外， 由于用户界面分成多个图层， 通过更换部分图层即可改变 整个用户界面的视觉效果。 并且， 用户能够使用自己的图片来定制个性 化用户界面， 整个用户界面的风格可以据此自动进行调整， 因此本发明 的界面生成方法不仅换肤方便， 而且不必事先保存大量图片。
通过以上的实施方式的描述， 本领域的技术人员可以清楚地了解到 本发明可借助软件加必需的通用硬件平台的方式来实现， 当然也可以通 过硬件， 但很多情况下前者是更佳的实施方式。 基于这样的理解， 本发 明的技术方案本质上或者说对现有技术做出贡献的部分可以以软件产 品的形式体现出来， 该计算机软件产品存储在一个存储介质中， 包括若 干指令用以使得一台终端设备（可以是手机， 个人计算机， 服务器， 或 者网络设备等）执行本发明各个实施例所述的方法。
以上所述仅是本发明的优选实施方式， 应当指出， 对于本技术领域 的普通技术人员来说， 在不脱离本发明原理的前提下， 还可以做出若干 改进和润饰， 这些改进和润饰也应视本发明的保护范围。
本领域技术人员可以理解实施例中的装置中的模块可以按照实施例 描述进行分布于实施例的装置中， 也可以进行相应变化位于不同于本实 施例的一个或多个装置中。 上述实施例的模块可以集成于一体， 也可以 分离部署； 可以合并为一个模块， 也可以进一步拆分成多个子模块。
上述本发明实施例序号仅仅为了描述， 不代表实施例的优劣。
以上公开的仅为本发明的几个具体实施例， 但是， 本发明并非局限于 此， 任何本领域的技术人员能思之的变化都应落入本发明的保护范围。

Claims

权利要求书
1、 一种用户界面的生成方法， 其特征在于， 该方法包括： 获取待绘制图层和待绘制的图层样式；
根据所述图层样式， 提取图层的属性信息， 并根据所提取的属性信 息绘制所述待绘制图层， 生成绘制后图层；
将所述绘制后图层进行组合， 生成用户界面。
2、 如权利要求 1所述的方法， 其特征在于，
所述绘制后图层包括以下中的一种或多种： 背景层； 质感层； 控件 层； 遮罩层；
所述属性信息包括： 图像内容； 透明度； 绘制模式； 混合模式。
3、如权利要求 2所述的方法，其特征在于，所述根据所述图层样式， 提取图层的属性信息具体包括以下中的一种或多种：
根据所述图层样式获取所需加载的图片文件； 根据所述图片文件获 取颜色数据， 所述颜色数据为所述待绘制图层的图像内容属性信息； 根据所述图层样式与其他图层层叠效果提取所述待绘制图层的透明 度属性信息；
根据所述图层样式和所述图层所在的会话窗口提取所述待绘制图层 的绘制模式属性信息， 所述绘制模式属性用于确定所述待绘制图层填充 所述会话窗口的方式；
根据所述图层样式和不同图层层叠后的图层样式提取所述待绘制图 层的混合模式属性信息， 所述混合模式属性用于获取所述待绘制图层的 图层边框的颜色数据。
4、如权利要求 3所述的方法， 其特征在于， 所述根据所述图片文件 获取颜色数据包括： 根据所述图片文件获取所述图片文件自身的第一颜色数据； 根据所述图片文件获取与所述第一颜色数据匹配的第二颜色数据。
5、如权利要求 1所述的方法， 其特征在于， 所述根据所提取的属性 信息绘制所述待绘制图层包括：
遍历提取的所述属性信息；
当所述属性信息不为空时，根据所述属性信息绘制所述待绘制图层。
6、如权利要求 1所述的方法， 其特征在于， 所述将所述绘制后图层 进行组合， 生成用户界面包括：
对所述绘制后图层的属性信息逐项混合， 生成用户界面。
7、 如权利要求 1至 6中任一项所述的方法， 其特征在于， 还包括： 动态修改所述绘制后图层的属性。
8、 一种用户界面的生成装置， 其特征在于， 该装置包括： 获取模块， 用于获取待绘制图层和待绘制的图层样式；
图层生成模块， 用于根据所述图层样式， 提取图层的属性信息， 并 根据所提取的属性信息绘制所述待绘制图层， 生成绘制后图层；
界面生成模块， 用于将所述绘制后图层进行组合， 生成用户界面。
9、 如权利要求 8所述的装置， 其特征在于，
所述绘制后图层包括以下中的一种或多种： 背景层； 质感层； 控件 层； 遮罩层；
所述属性信息包括： 图像内容； 透明度； 绘制模式； 混合模式。
10、 如权利要求 9所述的装置， 其特征在于， 所述图层生成模块包 括提取子模块， 用于：
根据所述图层样式获取所需加载的图片文件； 根据所述图片文件获 取颜色数据， 所述颜色数据为所述待绘制图层的图像内容属性信息； 或者， 根据所述图层样式与其他图层层叠效果提取所述待绘制图层 的透明度属性信息；
或者， 根据所述图层样式和所述图层所在的会话窗口提取所述待绘 制图层的绘制模式属性信息， 所述绘制模式属性用于确定所述待绘制图 层填充所述会话窗口的方式；
或者， 根据所述图层样式和不同图层层叠后的图层样式提取所述待 绘制图层的混合模式属性信息， 所述混合模式属性用于获取所述待绘制 图层的图层边框的颜色数据。
11、如权利要求 10所述的装置，其特征在于，所述提取子模块用于： 根据所述图片文件获取所述图片文件自身的第一颜色数据； 根据所述图片文件获取与所述第一颜色数据匹配的第二颜色数据。
12、 如权利要求 8所述的装置， 其特征在于， 所述图层生成模块包 括绘制子模块， 用于：
遍历提取的所述属性信息， 当所述属性信息不为空时， 根据所述属 性信息绘制所述待绘制图层。
13、 如权利要求 8所述的装置， 其特征在于， 所述界面生成模块用 于对所述绘制后图层的属性信息逐项混合来进行所述组合。
14、如权利要求 8至 13中任一项所述的装置， 其特征在于， 该装置 进一步包括：
修改模块， 用于动态修改所述绘制后图层的属性。
15、 一种用户界面的生成方法， 其特征在于， 该用户界面包括多个 图层， 该方法包括以下步骤：
绘制背景层；
绘制控件层；
将包括所述背景层和所述控件层在内的所述多个图层进行组合， 生 成该用户界面。
16、如权利要求 15所述的方法， 其特征在于， 所述背景层包括图片 图层和颜色图层， 并且
绘制背景层包括：
加载该图片以绘制所述图片图层；
统计该图片中出现频率最高的颜色， 得出接近于整体色调的平均颜 色， 并利用该平均颜色绘制所述颜色图层。
17、 如权利要求 15所述的方法， 其特征在于， 该方法进一步包括： 在所述背景层上绘制质感层。
18、 如权利要求 15所述的方法， 其特征在于， 该方法进一步包括： 在所述控件层上绘制遮罩层。
19、如权利要求 18所述的方法， 其特征在于， 所述遮罩层包括边框 形状图层和边框阴影图层。
20、如权利要求 15所述的方法， 其特征在于， 所述将包括所述背景 层和所述控件层在内的所述多个图层进行组合， 生成该用户界面包括： 对包括所述背景层和所述控件层在内的所述多个图层的属性信息逐 项混合， 生成该用户界面。
21、 如权利要求 15所述的方法， 其特征在于， 该方法进一步包括： 动态修改部分图层的透明度。
PCT/CN2011/070068 2010-02-11 2011-01-07 一种用户界面的生成方法和装置 WO2011097965A1 (zh)

Priority Applications (5)

Application Number Priority Date Filing Date Title
CA2789684A CA2789684C (en) 2010-02-11 2011-01-07 Method and apparatus for generating a user interface
MX2012009334A MX2012009334A (es) 2010-02-11 2011-01-07 Metodo y aparato para generar una interfaz de usuario.
RU2012137767/08A RU2530272C2 (ru) 2010-02-11 2011-01-07 Способ и устройство создания пользовательского интерфейса
BR112012020136-0A BR112012020136B1 (pt) 2010-02-11 2011-01-07 Método e aparelho para gerar uma interface de usuário
US13/571,543 US20120313956A1 (en) 2010-02-11 2012-08-10 Method And Apparatus For Generating A User Interface

Applications Claiming Priority (2)

Application Number Priority Date Filing Date Title
CN201010109033.1A CN102156999B (zh) 2010-02-11 2010-02-11 一种用户界面的生成方法和装置
CN201010109033.1 2010-02-11

Related Child Applications (1)

Application Number Title Priority Date Filing Date
US13/571,543 Continuation US20120313956A1 (en) 2010-02-11 2012-08-10 Method And Apparatus For Generating A User Interface

Publications (1)

Publication Number Publication Date
WO2011097965A1 true WO2011097965A1 (zh) 2011-08-18

Family

ID=44367247

Family Applications (1)

Application Number Title Priority Date Filing Date
PCT/CN2011/070068 WO2011097965A1 (zh) 2010-02-11 2011-01-07 一种用户界面的生成方法和装置

Country Status (7)

Country Link
US (1) US20120313956A1 (zh)
CN (1) CN102156999B (zh)
BR (1) BR112012020136B1 (zh)
CA (1) CA2789684C (zh)
MX (1) MX2012009334A (zh)
RU (1) RU2530272C2 (zh)
WO (1) WO2011097965A1 (zh)

Families Citing this family (32)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN103150150A (zh) * 2011-12-06 2013-06-12 腾讯科技（深圳）有限公司 一种展示天气信息的方法及装置
CN102541601B (zh) * 2011-12-28 2014-09-24 深圳万兴信息科技股份有限公司 一种软件安装包安装界面美化的方法和装置
CN102929617A (zh) * 2012-10-18 2013-02-13 广东威创视讯科技股份有限公司 一种Web软件UI界面的换肤方法
US9292264B2 (en) 2013-03-15 2016-03-22 Paschar Llc Mobile device user interface advertising software development kit
US20140325437A1 (en) * 2013-04-25 2014-10-30 Samsung Electronics Co., Ltd. Content delivery system with user interface mechanism and method of operation thereof
CN104331527B (zh) * 2013-07-22 2018-10-02 腾讯科技（深圳）有限公司 图片生成方法及装置
TW201504969A (zh) * 2013-07-24 2015-02-01 Rui-Xiang Tian 多層圖像疊合後之擬真及預覽系統
CN103544263B (zh) * 2013-10-16 2017-05-10 广东欧珀移动通信有限公司 一种移动终端的渲染方法及装置
CN105094775B (zh) * 2014-05-13 2020-08-04 腾讯科技（深圳）有限公司 网页生成方法和装置
CN105278795B (zh) * 2014-06-06 2019-12-03 腾讯科技（北京）有限公司 一种显示功能栏的方法和装置
CN104866755B (zh) * 2015-06-11 2018-03-30 北京金山安全软件有限公司 应用程序解锁界面背景图片的设置方法、装置及电子设备
CN104866323B (zh) * 2015-06-11 2018-03-30 北京金山安全软件有限公司 一种解锁界面的生成方法、装置及电子设备
CN105094847B (zh) * 2015-08-24 2018-09-07 佛吉亚好帮手电子科技有限公司 基于安卓系统的多图层可定制的按钮控件实现方法及系统
CN105608141A (zh) * 2015-12-17 2016-05-25 北京金山安全软件有限公司 云端图片加载方法、装置及电子设备
CN105786506A (zh) * 2016-02-26 2016-07-20 珠海金山网络游戏科技有限公司 一种用户界面自动生成的系统及方法
CN106204733B (zh) * 2016-07-22 2024-04-19 青岛大学附属医院 肝脏和肾脏ct图像联合三维构建系统
CN107767838B (zh) * 2016-08-16 2020-06-02 北京小米移动软件有限公司 色域映射方法及装置
CN106341574B (zh) * 2016-08-24 2019-04-16 北京小米移动软件有限公司 色域映射方法及装置
CN106484432B (zh) * 2016-11-01 2023-10-31 武汉斗鱼网络科技有限公司 一种进度条定制方法、装置及进度条
CN108255523A (zh) * 2016-12-28 2018-07-06 北京普源精电科技有限公司 图形用户界面创建方法、装置、系统及fpga
CN108304169B (zh) * 2017-01-11 2021-09-21 阿里巴巴集团控股有限公司 针对html5应用的实现方法、装置和设备
CN106933587B (zh) * 2017-03-10 2019-12-31 Oppo广东移动通信有限公司 一种图层绘制控制方法、装置及移动终端
CN108965975B (zh) * 2017-05-24 2021-03-23 阿里巴巴集团控股有限公司 一种绘制方法及装置
CN110020336B (zh) * 2017-08-01 2021-07-30 北京国双科技有限公司 遮罩层控制方法及装置
CN107577514A (zh) * 2017-09-20 2018-01-12 广州市千钧网络科技有限公司 一种不规则图层裁剪拼接方法和系统
CN108777783A (zh) * 2018-07-09 2018-11-09 广东交通职业技术学院 一种图像处理方法及装置
CN109808406A (zh) * 2019-04-09 2019-05-28 广州真迹文化有限公司 书画作品在线装裱方法、系统及存储介质
CN112204619A (zh) * 2019-04-23 2021-01-08 华为技术有限公司 处理图层的方法和装置
CN111522520B (zh) * 2020-04-03 2024-04-19 广东小天才科技有限公司 软件仿类纸的处理方法、装置、设备和存储介质
CN113791706A (zh) * 2020-09-04 2021-12-14 荣耀终端有限公司 显示处理方法及电子设备
CN113778304B (zh) * 2021-11-11 2022-04-01 北京达佳互联信息技术有限公司 显示图层的方法、装置、电子设备及计算机可读存储介质
CN116954409A (zh) * 2022-04-19 2023-10-27 华为技术有限公司 应用的显示方法、装置及存储介质

Citations (2)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN101021790A (zh) * 2007-03-09 2007-08-22 华为技术有限公司 一种用户界面变换方法及系统
US20080018665A1 (en) * 2006-07-24 2008-01-24 Jay Behr System and method for visualizing drawing style layer combinations

Family Cites Families (16)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US6091505A (en) * 1998-01-30 2000-07-18 Apple Computer, Inc. Method and system for achieving enhanced glyphs in a font
US7092495B2 (en) * 2001-12-13 2006-08-15 Nokia Corporation Communication terminal
CN1501712A (zh) * 2002-11-12 2004-06-02 北京中视联数字系统有限公司 一种实现图文混合显示的方法
US7106343B1 (en) * 2003-04-08 2006-09-12 Carter Hickman Method and process for virtual paint application
US7817163B2 (en) * 2003-10-23 2010-10-19 Microsoft Corporation Dynamic window anatomy
US8631347B2 (en) * 2004-11-15 2014-01-14 Microsoft Corporation Electronic document style matrix
US7663637B2 (en) * 2007-01-31 2010-02-16 Autodesk, Inc. Overriding layer properties in computer aided design viewports
US9638022B2 (en) * 2007-03-27 2017-05-02 Halliburton Energy Services, Inc. Systems and methods for displaying logging data
US20110307801A1 (en) * 2007-12-21 2011-12-15 Wikiatlas Corp. Contributor compensation system and method
US8044973B2 (en) * 2008-01-18 2011-10-25 Autodesk, Inc. Auto sorting of geometry based on graphic styles
US8144251B2 (en) * 2008-04-18 2012-03-27 Sony Corporation Overlaid images on TV
CN101321240B (zh) * 2008-06-25 2010-06-09 华为技术有限公司 多图层叠加的方法及其装置
JP5583127B2 (ja) * 2008-09-25 2014-09-03 コーニンクレッカ フィリップス エヌ ヴェ 三次元画像データ処理
KR101502598B1 (ko) * 2008-11-12 2015-03-16 삼성전자주식회사 깊이감 인지 향상을 위한 영상 처리 장치 및 방법
US20100231590A1 (en) * 2009-03-10 2010-09-16 Yogurt Bilgi Teknolojileri A.S. Creating and modifying 3d object textures
JP4808267B2 (ja) * 2009-05-27 2011-11-02 シャープ株式会社 画像処理装置、画像形成装置、画像処理方法、コンピュータプログラム及び記録媒体

Patent Citations (2)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US20080018665A1 (en) * 2006-07-24 2008-01-24 Jay Behr System and method for visualizing drawing style layer combinations
CN101021790A (zh) * 2007-03-09 2007-08-22 华为技术有限公司 一种用户界面变换方法及系统

Also Published As

Publication number Publication date
CA2789684A1 (en) 2011-08-18
CN102156999B (zh) 2015-06-10
BR112012020136A2 (pt) 2020-08-18
RU2012137767A (ru) 2014-03-20
CN102156999A (zh) 2011-08-17
BR112012020136B1 (pt) 2021-09-21
RU2530272C2 (ru) 2014-10-10
MX2012009334A (es) 2012-09-07
CA2789684C (en) 2016-03-01
US20120313956A1 (en) 2012-12-13

Similar Documents

Publication Publication Date Title
WO2011097965A1 (zh) 一种用户界面的生成方法和装置
US10885677B2 (en) Method and system for setting interface element colors
WO2021135887A1 (zh) 页面配色的方法、装置、存储介质和芯片
US9547427B2 (en) User interface with color themes based on input image data
JP4398726B2 (ja) １つまたは複数の画像の自動フレーム選択およびレイアウトならびにフレームによって境界付けされた画像の生成
US20130207994A1 (en) System and method for generating and applying a color theme to a user interface
WO2022042180A1 (zh) 壁纸生成方法、装置、终端及存储介质
US11601618B1 (en) Method of using online, real-time, interactive, multiplane camera view to enhance videoconferencing platforms
JP6210474B2 (ja) 写真シール作成装置、写真シール作成装置の制御方法、及び写真シール作成装置の制御プログラム
TW201510741A (zh) 渲染設備、其之渲染方法、程式和記錄媒體
CN110136087B (zh) 显示终端的边框自适应调整方法及相关设备
JP6614644B2 (ja) 写真撮影遊戯装置、写真シール作成装置、写真撮影遊戯装置の制御方法、及び写真撮影遊戯装置の制御プログラム
WO2020125009A1 (zh) 一种视频处理方法及电视
CN108846881A (zh) 一种表情图像的生成方法及装置
CN107765943A (zh) 一种在双屏智能终端上实现双app同时运行的方法
JP2015210424A (ja) 写真撮影遊戯機及びその制御プログラム
JP2014206611A (ja) 写真撮影遊戯装置、写真撮影遊戯装置の制御方法、及び写真撮影遊戯装置の制御プログラム
JP2012185306A (ja) 自動写真作成装置
US20240135602A1 (en) Image generation method and apparatus, electronic device, and readable storage medium
US20240233209A9 (en) Image generation method and apparatus, electronic device, and readable storage medium
JP6578476B2 (ja) 写真撮影遊戯装置、写真シール作成装置、写真撮影遊戯装置の制御方法、及び写真撮影遊戯装置の制御プログラム
JP5930351B2 (ja) 写真撮影遊戯装置、写真シール作成装置、写真撮影遊戯装置の制御方法、及び写真撮影遊戯装置の制御プログラム
CN115729661A (zh) 基于元素颜色的页面皮肤生成方法及存储介质
JP2023016585A (ja) 室内装飾プランの可視提案システム
JP5594401B1 (ja) 撮影装置、撮影方法、およびプログラム

Legal Events

Date Code Title Description
121 Ep: the epo has been informed by wipo that ep was designated in this application

Ref document number: 11741836

Country of ref document: EP

Kind code of ref document: A1

ENP Entry into the national phase

Ref document number: 2789684

Country of ref document: CA

WWE Wipo information: entry into national phase

Ref document number: MX/A/2012/009334

Country of ref document: MX

WWE Wipo information: entry into national phase

Ref document number: 1201004077

Country of ref document: TH

NENP Non-entry into the national phase

Ref country code: DE

WWE Wipo information: entry into national phase

Ref document number: 7206/DELNP/2012

Country of ref document: IN

WWE Wipo information: entry into national phase

Ref document number: 2012137767

Country of ref document: RU

32PN Ep: public notification in the ep bulletin as address of the adressee cannot be established

Free format text: NOTING OF LOSS OF RIGHTS PURSUANT TO RULE 112(1) EPC

REG Reference to national code

Ref country code: BR

Ref legal event code: B01A

Ref document number: 112012020136

Country of ref document: BR

122 Ep: pct application non-entry in european phase

Ref document number: 11741836

Country of ref document: EP

Kind code of ref document: A1

ENP Entry into the national phase

Ref document number: 112012020136

Country of ref document: BR

Kind code of ref document: A2

Effective date: 20120810