CN116991294A

CN116991294A - Application program interface synchronization method and device, electronic equipment and storage medium

Info

Publication number: CN116991294A
Application number: CN202210601504.3A
Authority: CN
Inventors: 张云
Original assignee: Tencent Technology Shenzhen Co Ltd
Current assignee: Tencent Technology Shenzhen Co Ltd
Priority date: 2022-05-30
Filing date: 2022-05-30
Publication date: 2023-11-03

Abstract

The application provides a synchronization method, a synchronization device, an electronic device, a computer readable storage medium and a computer program product of an application program interface; the method comprises the following steps: displaying an application program interface, wherein the application program interface comprises a plurality of elements; highlighting the selected at least one target element of the plurality of elements and displaying a graphical representation including the at least one target element in response to an element selection operation; wherein the graphical representation is for being embedded into other interface displays and synchronously updating the at least one target element in the graphical representation in response to the at least one target element in the application interface being updated. The method and the system can generate the graphic which is updated synchronously with the application program interface in an efficient mode, and are convenient to be embedded into other interfaces for use.

Description

Application program interface synchronization method and device, electronic equipment and storage medium

Technical Field

The present application relates to the field of internet technologies, and in particular, to a method and apparatus for synchronizing an application program interface, an electronic device, and a computer readable storage medium.

Background

In the related art, the use of content such as novice guidance, instructions for use, game play, etc. is usually presented to a user by means of a screenshot, for example, by taking a game as an example, and displaying the captured picture (for example, a certain game character) as a graphic embedded in the game play interface.

However, since the update iteration speed of the product/game is faster, it is difficult for the update of the content such as the novice guide, the use guide, the game attack and the like to follow the update of the product/game in time, for example, the product/game is updated iteratively according to the version, and the content of the novice guide and the use guide is updated according to the period of three months or half a year, that is, the update time of the product/game is inconsistent with the update time of the novice guide and the use guide, so that the content such as the novice guide, the use guide, the game attack and the like is invalid, or the situation that the content and the product/game are not numbered is caused, which causes misunderstanding and confusion to the user.

Disclosure of Invention

The embodiment of the application provides a synchronization method, a synchronization device, electronic equipment, a computer readable storage medium and a computer program product of an application program interface, which can generate a diagram updated synchronously with the application program interface in an efficient manner and are convenient to embed into other interfaces for use.

The technical scheme of the embodiment of the application is realized as follows:

the embodiment of the application provides a method for synchronizing an application program interface, which comprises the following steps:

displaying an application program interface, wherein the application program interface comprises a plurality of elements;

highlighting the selected at least one target element of the plurality of elements and displaying a graphical representation including the at least one target element in response to an element selection operation;

wherein the graphical representation is for being embedded into other interface displays and synchronously updating the at least one target element in the graphical representation in response to the at least one target element in the application interface being updated.

The embodiment of the application provides a synchronization device of an application program interface, which comprises the following components: .

The display module is used for displaying an application program interface, wherein the application program interface comprises a plurality of elements;

the display module is further used for responding to element selection operation, highlighting at least one selected target element in the plurality of elements and displaying a diagram comprising the at least one target element;

An embodiment of the present application provides an electronic device, including:

a memory for storing executable instructions;

and the processor is used for realizing the synchronization method of the application program interface provided by the embodiment of the application when executing the executable instructions stored in the memory.

The embodiment of the application provides a computer readable storage medium which stores executable instructions for realizing the method for synchronizing the application program interface provided by the embodiment of the application when being executed by a processor.

The embodiment of the application provides a computer program product, which comprises a computer program or instructions for realizing the method for synchronizing the application program interface provided by the embodiment of the application when being executed by a processor.

The embodiment of the application has the following beneficial effects:

the target elements which are needed to be embedded in other interfaces and updated can be selected from the multiple elements included in the application program interface as required, so that the graphic which can be updated synchronously with the application program interface can be generated, the required graphic can be quickly manufactured without professional operation skills, the operation is intuitive and convenient, the purpose of generating the graphic updated synchronously with the application program interface in an efficient mode and conveniently embedding the graphic into the other interfaces is achieved.

Drawings

FIG. 1 is a schematic diagram of an architecture of a synchronization system 100 of an application program interface according to an embodiment of the present application;

FIG. 2 is a schematic diagram of an architecture of a synchronization system 101 of an application program interface according to an embodiment of the present application;

fig. 3 is a schematic structural diagram of a terminal device 400 according to an embodiment of the present application;

FIG. 4 is a flowchart illustrating a method for synchronizing an application program interface according to an embodiment of the present application;

fig. 5A to fig. 5C are schematic flow diagrams of a synchronization method of an application program interface according to an embodiment of the present application;

fig. 6A to fig. 6C are schematic application scenarios of a synchronization method of an application program interface according to an embodiment of the present application;

fig. 7 is an application scenario schematic diagram of a synchronization method of an application program interface according to an embodiment of the present application;

fig. 8 is an application scenario schematic diagram of a synchronization method of an application program interface according to an embodiment of the present application;

FIG. 9 is a schematic diagram showing a comparison between before and after updating a game character according to an embodiment of the present application;

fig. 10 is an application scenario diagram of a synchronization method of an application program interface provided by the related art;

fig. 11 is an application scenario schematic diagram of a synchronization method of an application program interface according to an embodiment of the present application;

FIG. 12 is a flowchart of a method for synchronizing an application program interface according to an embodiment of the present application;

FIG. 13 is a flowchart illustrating a method for synchronizing an application program interface according to an embodiment of the present application;

fig. 14 is a flowchart of a synchronization method of an application program interface according to an embodiment of the present application.

Detailed Description

The present application will be further described in detail with reference to the accompanying drawings, for the purpose of making the objects, technical solutions and advantages of the present application more apparent, and the described embodiments should not be construed as limiting the present application, and all other embodiments obtained by those skilled in the art without making any inventive effort are within the scope of the present application.

In the following description, reference is made to "some embodiments" which describe a subset of all possible embodiments, but it is to be understood that "some embodiments" can be the same subset or different subsets of all possible embodiments and can be combined with one another without conflict.

It will be appreciated that in the embodiments of the present application, related data such as user information is involved, and when the embodiments of the present application are applied to specific products or technologies, user permissions or agreements need to be obtained, and the collection, use and processing of related data need to comply with relevant laws and regulations and standards of relevant countries and regions.

Unless defined otherwise, all technical and scientific terms used herein have the same meaning as commonly understood by one of ordinary skill in the art to which this application belongs. The terminology used herein is for the purpose of describing embodiments of the application only and is not intended to be limiting of the application.

Before describing embodiments of the present application in further detail, the terms and terminology involved in the embodiments of the present application will be described, and the terms and terminology involved in the embodiments of the present application will be used in the following explanation.

1) Application program interface: the application presents graphical status on the display screen in front of the user, including for example a game interface, an office system interface, etc.

2) Element (b): the basic elements constituting the application interface include, for example, text, buttons, charts, etc.

3) The diagram is: that is, a graphic is used to represent or describe something, which is relatively intuitive, shallow and easy to understand, and is convenient to memorize, for example, a graphic (such as a certain game character) obtained by framing a game interface can be embedded into a game attack interface to help a player memorize the skill, attribute, etc. of the game character.

4) In response to: for representing a condition or state upon which an operation is performed, one or more operations performed may be in real-time or with a set delay when the condition or state upon which the operation is dependent is satisfied; without being specifically described, there is no limitation in the execution sequence of the plurality of operations performed.

5) Extensible application markup language (XAML, eXtensible Application Markup Language): a new descriptive language created for building application interfaces. XAML provides an application program interface which is convenient for expanding and positioning grammar to define and separate from program logic, is a analytic language and can simplify the user creation process on programming, and codes and configurations are added during application.

Embodiments of the present application provide a synchronization method, apparatus, electronic device, computer readable storage medium, and computer program product for an application program interface, which can generate a graphic updated synchronously with the application program interface in an efficient manner, and is convenient to be embedded into other interfaces for use. An exemplary application of the electronic device provided by the embodiment of the present application is described below, where the electronic device provided by the embodiment of the present application may be implemented as a terminal device, or may be implemented cooperatively by the terminal device and a server. The following describes an example of a synchronization method of an application program interface provided by the embodiment of the present application implemented by a terminal device and a server in cooperation.

Referring to fig. 1, fig. 1 is a schematic architecture diagram of a synchronization system 100 of an application program interface according to an embodiment of the present application, in order to support a graphic capable of generating updates synchronously with the application program interface in an efficient manner, so as to facilitate embedding into an application used in another interface, a terminal device 400 is connected to a server 200 through a network 300, where the network 300 may be a wide area network or a local area network, or a combination of the two.

As shown in fig. 1, a client 410 (e.g., a client having functions of creating a novice guide, a game attack, a use guide, or the like, or a browser) is run on a terminal device 400, and an application interface (e.g., a game interface, an office system interface, or the like, for example, when a game attack corresponding to a certain game needs to be created, the game interface may be imported into the client 410) is displayed on a man-machine interaction interface of the client 410, where the application interface includes a plurality of elements (e.g., a game interface, in which elements such as game characters and skill buttons may be displayed, for example). The client 410 highlights at least one selected target element of the plurality of elements (e.g., as exemplified by a game interface, may highlight a game character selected by a user in the game interface) in response to an element selection operation triggered by the user (e.g., a setter) for the application interface. The client 410 may then send the at least one target element selected by the user in the application interface to the server 200 over the network 300 to cause the server to generate a graphical representation comprising the at least one target element. Subsequently, after the client 410 receives the graphic returned by the server 200, it may be displayed in the human-computer interaction interface (i.e., the installer may preview the generated graphic in the client 410, and when the installer is not satisfied with the currently generated graphic, it may re-perform the above operations to cause the server 200 to generate a new graphic). Finally, after the client 410 receives the confirmation operation triggered by the user for the graphic (e.g., the client 410 receives the click operation of the user for the save button displayed in the man-machine interaction interface), the graphic may be embedded in other interfaces (e.g., the novice guide interface, the use guide interface, the game attack interface, etc.), and when the client 410 detects that at least one target element in the application interface is updated, at least one target element in the graphic displayed in the other interfaces may be updated synchronously (e.g., when the game interface is exemplified by the game interface, when the client 410 detects that the style of the game character a previously selected as the graphic in the game interface is updated, the graphic embedded in the game attack interface may be updated synchronously, that is, the style of the game character a included in the updated graphic is the same as the style of the game character a in the updated game interface), so that the graphic updated synchronously with the application interface may be generated in an efficient manner, and the graphic updated synchronously may be conveniently embedded in the other interfaces.

In other embodiments, the illustrated setup and illustrated user may also be different users. For example, referring to fig. 2, fig. 2 is a schematic architecture diagram of an application interface synchronization system 101 provided in an embodiment of the present application, and as shown in fig. 2, the application interface synchronization system 101 includes: server 200, network 300, terminal device 500 associated with the illustrated user (e.g., user a), and terminal device 600 associated with the illustrated user (e.g., user B). That is, in fig. 2, after receiving the confirmation operation of the user a for the graphic, the client 510 may transmit the graphic to the server 200 through the network 300, so that the server 200 forwards the graphic to the terminal device 600 associated with the user B, thereby displaying an interface (e.g., a game attack interface, a novice guide interface, a use guide interface, etc.) of the client 610 (e.g., browser) running in the terminal device 600. In addition, when the client 510 detects that at least one target element in the application program interface (such as a game interface, an office system interface, etc.) is updated, an update instruction may be sent to the server 200, so that the server 200 synchronously updates at least one target element in the graphic, and sends the updated graphic to the terminal device 600, so that the updated graphic is displayed in the interface of the client 610.

In some embodiments, the embodiments of the present application may also be implemented by means of Cloud Technology (Cloud Technology), which refers to a hosting Technology that unifies serial resources such as hardware, software, networks, etc. in a wide area network or a local area network, so as to implement calculation, storage, processing, and sharing of data.

The cloud technology is a generic term of network technology, information technology, integration technology, management platform technology, application technology and the like based on cloud computing business model application, can form a resource pool, and is flexible and convenient as required. Cloud computing technology will become an important support. Background services of technical network systems require a large amount of computing and storage resources.

By way of example, the server 200 shown in fig. 1 or fig. 2 may be an independent physical server, or may be a server cluster or a distributed system formed by a plurality of physical servers, or may be a cloud server that provides cloud services, cloud databases, cloud computing, cloud functions, cloud storage, network services, cloud communication, middleware services, domain name services, security services, CDNs, and basic cloud computing services such as big data and artificial intelligence platforms. The terminal device (e.g., terminal device 400 shown in fig. 1, or terminal device 500 and terminal device 600 shown in fig. 2) may be a smart phone, a tablet computer, a notebook computer, a desktop computer, a smart speaker, a smart watch, a vehicle-mounted terminal, or the like, but is not limited thereto. The terminal device and the server may be directly or indirectly connected through wired or wireless communication, which is not limited in the embodiment of the present application.

In other embodiments, the terminal device or the server may also implement the method for synchronizing the application program interface provided by the embodiment of the present application by running a computer program. For example, the computer program may be a native program or a software module in an operating system; the Application may be a local (Native) Application program (APP), i.e., a program that needs to be installed in an operating system to be run, such as APP having functions of making game attacks, new hand guides, instructions for use, etc.; the method can also be an applet, namely a program which can be run only by being downloaded into a browser environment; but also an applet that can be embedded in any APP. In general, the computer programs described above may be any form of application, module or plug-in.

The following continues the description of the structure of the terminal device 400 shown in fig. 1. Referring to fig. 3, fig. 3 is a schematic structural diagram of a terminal device 400 provided in an embodiment of the present application, and the terminal device 400 shown in fig. 3 includes: at least one processor 420, a memory 460, at least one network interface 430, and a user interface 440. The various components in terminal device 400 are coupled together by bus system 450. It is understood that bus system 450 is used to implement the connected communications between these components. The bus system 450 includes a power bus, a control bus, and a status signal bus in addition to a data bus. But for clarity of illustration the various buses are labeled as bus system 450 in fig. 3.

The processor 420 may be an integrated circuit chip with signal processing capabilities such as a general purpose processor, such as a microprocessor or any conventional processor, or the like, a digital signal processor (DSP, digital Signal Processor), or other programmable logic device, discrete gate or transistor logic, discrete hardware components, or the like.

The user interface 440 includes one or more output devices 441 that enable presentation of media content, including one or more speakers and/or one or more visual displays. The user interface 440 also includes one or more input devices 442, including user interface components that facilitate user input, such as a keyboard, mouse, microphone, touch screen display, camera, other input buttons and controls.

Memory 460 may be removable, non-removable, or a combination thereof. Exemplary hardware devices include solid state memory, hard drives, optical drives, and the like. Memory 460 optionally includes one or more storage devices physically remote from processor 420.

Memory 460 includes volatile memory or nonvolatile memory, and may also include both volatile and nonvolatile memory. The nonvolatile Memory may be a Read Only Memory (ROM), and the volatile Memory may be a random access Memory (RAM, random Access Memory). The memory 460 described in embodiments of the present application is intended to comprise any suitable type of memory.

In some embodiments, memory 460 is capable of storing data to support various operations, examples of which include programs, modules and data structures, or subsets or supersets thereof, as exemplified below.

An operating system 461 including system programs for handling various basic system services and performing hardware-related tasks, such as a framework layer, a core library layer, a driver layer, etc., for implementing various basic services and handling hardware-based tasks;

network communication module 462 for reaching other computing devices via one or more (wired or wireless) network interfaces 430, the exemplary network interfaces 430 comprising: bluetooth, wireless compatibility authentication (WiFi), and universal serial bus (USB, universal Serial Bus), etc.;

a presentation module 463 for enabling presentation of information (e.g., a user interface for operating peripheral devices and displaying content and information) via one or more output devices 441 (e.g., a display screen, speakers, etc.) associated with the user interface 440;

an input processing module 464 for detecting one or more user inputs or interactions from one of the one or more input devices 442 and translating the detected inputs or interactions.

In some embodiments, the synchronization device of the application program interface provided in the embodiments of the present application may be implemented in software, and fig. 3 shows the synchronization device 465 of the application program interface stored in the memory 460, which may be software in the form of a program and a plug-in, and includes the following software modules: the display module 4651, the determination module 4652, the transmission module 4653, the reception module 4654 and the switching module 4655 are logical, and thus may be arbitrarily combined or further split according to the implemented functions. It should be noted that in fig. 3, all the above modules are shown at once for convenience of expression, but the synchronization apparatus 465 at the application interface should not be regarded as excluding the implementation that may include only the display module 4651, and the functions of the respective modules will be described below.

The following will describe an application program interface synchronization method provided by the embodiment of the present application in conjunction with exemplary applications and implementations of a terminal device provided by the embodiment of the present application.

Referring to fig. 4, fig. 4 is a flowchart of a synchronization method of an application program interface according to an embodiment of the present application, and will be described with reference to the steps shown in fig. 4.

It should be noted that the method shown in fig. 4 may be performed by various forms of computer programs executed by the terminal device 400 shown in fig. 1, and is not limited to the client 410 executed by the terminal device 400, but may also be the operating system 461, software modules, scripts and applets described above, so that the following examples of the client should not be considered as limiting the embodiments of the present application. In addition, the steps executed by the terminal device are specifically executed by the client running on the terminal device, and for convenience of description, the embodiment of the application does not distinguish between the terminal device and the client running on the terminal device.

In step 101, an application program interface is displayed.

Here, the application program interface may include a plurality of elements. For example, when the application program interface is a game interface, a plurality of elements of different types such as a game character and an operation button may be displayed in the game interface; when the application program interface is an office system interface, a plurality of elements such as operation buttons, tables, graphics and texts of different types can be displayed in the office system interface.

For example, taking an application program interface as a game interface (for example, an interface of a game a), when a corresponding game attack needs to be made for the game a, the interface of the game a may be imported into a client having a function of making the game attack, so as to display the interface of the game a in a man-machine interaction interface of the client.

In step 102, at least one selected target element of the plurality of elements is highlighted in response to the element selection operation.

In some embodiments, the terminal device may implement step 102 by: in response to an element selection operation triggered for the application program interface, at least one element included in a target area framed in the application program interface by the element selection operation is determined as the selected at least one target element of the plurality of elements, and the at least one target element is displayed in a selected state (e.g., highlighted).

By way of example, the terminal device may implement the above-mentioned display of at least one target element in the selected state by: transmitting the target area selected by the element selection operation in the application program interface to the server so that the server adjusts the target area to be in a selected state; and receiving the target area in the selected state returned by the server so as to display the target area in the selected state in the application program interface, wherein the target area comprises at least one target element.

For example, taking an application program interface as a game interface, after importing a game interface to be edited in response to an import operation triggered by a user, the client may display the game interface in a man-machine interaction interface, then the client may continue to respond to an element selection operation triggered by the user for the game interface (for example, a box selection operation), determine at least one element (for example, a game role a) included in a target area selected by the user in the game interface as at least one target element selected by a plurality of elements included in the game interface, and send the element selection operation to a server in the target area selected by the box selection operation in the game interface, so that the server adjusts the target area to be in a selected state, and finally after receiving the target area in the selected state returned by the server, the client may highlight the game role a in the game interface in a highlighting manner, thereby effectively reminding the user.

In other embodiments, the terminal device may also perform the following: in response to the validation operation for the target area, a validation instruction is sent to the server to cause the server to perform the following processing: copying the application program interface, determining a corresponding frame selection range in the copied application program interface based on the target area selected in the application program interface by element selection operation, and applying a selected state in the frame selection range to form the target area in the selected state.

For example, taking an application program interface as a game interface, after responding to an element selection operation triggered by a user for the game interface and displaying a target area selected by the element selection operation in a selected state in the game interface, the client may further respond to a confirmation operation triggered by the user for the target area (for example, receiving a click operation of a confirmation button displayed in a man-machine interaction interface by the user), send a confirmation instruction to the server, so that the server performs the following processing: copying a game interface (for example, a server can firstly acquire a Blueprint (Blueprint) file and a mapping resource corresponding to the game interface, then call a third party component (for example, a ueloader. Dll) to convert the Blueprint file into an XAML file, then carry out packing processing on the XAML file and the mapping resource to obtain a compressed package file (for example, a UIPak file), finally carry out unpacking processing and rendering processing on the UIPak file to obtain the game interface which is the same as that displayed in a client side), operate a target area framed in the game interface based on elements, determine a corresponding framing range in the copied game interface, and apply a selected state in the framing range to form the target area in the selected state.

In other embodiments, referring to fig. 5A, fig. 5A is a flowchart of a synchronization method of an application program interface according to an embodiment of the present application, as shown in fig. 5A, before step 102 shown in fig. 4 is performed, steps 104 to 106 shown in fig. 5A may also be performed, and will be described in connection with the steps shown in fig. 5A.

In step 104, a pictorial boot portal is displayed.

In some embodiments, besides displaying the application program interface needing editing, the graphical production guiding entry can also be displayed in the man-machine interaction interface of the client, wherein the graphical production guiding entry can be displayed on the application program interface in a floating mode, and of course, the graphical production guiding entry can also be displayed in a split screen mode in the man-machine interaction interface and independent of the application program interface.

For example, taking an application program interface as a game interface, in addition to displaying a game interface to be edited, a graphical making guide entry (for example, making a game attack button) may be displayed in a man-machine interaction interface of the client, where the making game attack button may be suspended in the game interface for display, and of course, the making game attack button may also be displayed in a split screen manner in the man-machine interaction interface independently of the game interface.

In step 105, in response to a trigger operation for the graphic production guidance portal, a graphic editing area is displayed.

Here, the pictorial editing area may include a pictorial addition control, and the pictorial editing area may be displayed in hover over the application interface, e.g., a floating layer may be displayed on the application interface, and the pictorial editing area may be displayed on the floating layer; of course, the graphical editing area may be displayed in a split screen manner in the man-machine interaction interface independently of the application program interface, for example, the man-machine interaction interface may be divided into two areas in advance, wherein one area is used for displaying the application program interface, and the other area is used for displaying the graphical editing area.

In other embodiments, the pictorial editing area may further include a text description input control, and the terminal device may further perform the following: the input descriptive text used for introducing the graphic is received through the text descriptive input control, wherein the descriptive text is used for being embedded into other interface displays together with the graphic.

For example, referring to fig. 6A, fig. 6A is an application scenario schematic diagram of a synchronization method of an application program interface provided by an embodiment of the present application, as shown in fig. 6A, in addition to displaying a graphic adding control, for example, clicking a section view button 607, a text description input control, for example, a text description input box 606 is displayed in a graphic editing area 605, where the text description input box 606 is used to receive a description text input by a user for introducing a graphic 609, for example, the user may input a description text such as a characteristic related to a mechanical spider in the text description input box 606, and the description text input by the user in the text description input box 606 may be embedded into other interfaces (for example, a game attack interface) together with the graphic 609, so that the user may better understand related information of the mechanical spider in cooperation with the description text when browsing the game attack interface.

In step 106, in response to a trigger operation for the pictorial add control, the application interface is switched to a state that can be framed to receive an element selection operation that frames a target area in the application interface.

In some embodiments, the terminal device may implement switching the application interface to a state that can be framed by: sending a trigger operation (namely, a trigger operation of a user for a graphical addition control displayed in a graphical editing area) to a server; receiving an edit-in command returned by the server in response to the triggering operation, where the edit-in command is used to cause the client to switch the application program interface to a state capable of being selected by a frame (for example, a corresponding prompt text may be displayed on the application program interface to prompt the user that the application program interface has been switched to the state capable of being selected by a frame currently, or, as shown in fig. 6A, a shadow floating layer is displayed on the application program interface to indicate that the application program interface has been switched to the state capable of being selected by a frame currently, or, of course, the application program interface may also be displayed in a highlighted manner to indicate that the application program interface has been switched to the state capable of being selected by a frame currently.

The graphic production guide entry and the graphic editing area may be displayed in a manner of being suspended in the application program interface; or, the graphic production guide entry and the graphic editing area may be displayed independently of the application program interface in a split screen manner, for example, for a terminal device (for example, a smart television) with a size greater than a size threshold (for example, 50 inches), the human-computer interaction interface may be divided into two areas in advance, for example, into a first area and a second area, where the first area is used for displaying the application program interface to be edited, and the second area is used for displaying the graphic production guide entry and the graphic editing area.

That is, before displaying the application interface, the graphic production guide entry, and the graphic editing region in the human-computer interaction interface, the size of the display screen may be detected first, and the display may be performed in a corresponding display manner according to the detection result, for example, when the size of the display screen is smaller than the size threshold, the graphic production guide entry and the graphic editing region may be displayed in a floating manner on the application interface; when the size of the display screen is larger than the size threshold, the human-computer interaction interface can be divided into two areas, wherein one area is used for displaying the application program interface, and the other area is used for displaying the graphic production guide entrance and the graphic editing area.

The following description is made for the case where the size of the display screen is larger than the size threshold.

For example, referring to fig. 6A, fig. 6A is an application scenario schematic diagram of a synchronization method of an application program interface provided by an embodiment of the present application, as shown in fig. 6A, two areas, a first area 602 and a second area 603, are displayed in a man-machine interaction interface 601, a game interface to be edited is displayed in the first area 602, and a graphic production guiding entry, for example, a "production game attack" button 604 is displayed in the second area 603. When a click operation by a user (e.g., a pictured setter) on the "make game play" button 604 displayed in the second area 603 is received, a pictured editing area 605 is displayed in the second area 603, wherein the pictured editing area 605 includes a literal description input control, such as a literal description input box 606, and a pictured addition control, such as a "click pictured" button 607. Upon receiving a click operation by the user on the "click section view" button 607 displayed in the view editing area 605, the game interface displayed in the first area 602 may be switched to a state that can be framed (for example, a shadow float may be displayed on the game interface to characterize that the game interface is currently in a state that can be framed). Subsequently, when an element selection operation triggered by the user for the game interface in a state capable of being framed is received, at least one selected target game character among a plurality of game characters included in the game interface is highlighted, for example, the game character 608 selected by the user is displayed in a highlighted manner in the game interface. Finally, the client can also send the game character 608 selected by the user in the game interface to the server to cause the server to generate a diagram including the game character 608 (the generation process of the diagram will be described in more detail below). After receiving the graphic returned by the server, the client may also display the graphic in the graphic editing area 605 displayed in the second area 603, for example, the graphic in the graphic editing area 605 includes a graphic 609 including the game character 608 selected by the user, so that the user can preview.

In other embodiments, after the user selects at least one target element from the plurality of elements included in the application program interface, the terminal device may further perform the following processing: highlighting (e.g., highlighting, or blinking) other elements of the plurality of elements that have a similarity with the user-selected target element that is greater than a similarity threshold, i.e., after the user selects a certain element in the application interface, other elements that are relevant to the selected target element or that may be of interest to the user may be recommended to the user (e.g., after the user selects element 1 of the plurality of elements included in the application interface, element 2 that is functionally similar to element 1 may be highlighted in the application interface, e.g., element 2 may be highlighted to make a recommendation to the user), thereby saving the time the user needs to spend selecting an element and further improving the efficiency of making the illustration. Of course, elements that may be of interest, or elements that are used more frequently than a frequency threshold, may also be recommended to the user prior to receiving the user's element selection operation triggered for the application interface. For example, the machine learning model may be invoked to perform prediction processing based on features (such as names, functions, etc.) respectively corresponding to a plurality of elements included in the application program interface, so as to obtain interest scores respectively corresponding to each element (the interest scores are used for characterizing the interest degree of the user in the element, that is, the higher the interest score is, the more interest the user is interested in the element), then, a part of the elements with interest scores greater than an interest score threshold value are selected from the plurality of elements included in the application program interface, and the selected part of the elements are highlighted in the application program interface, for example, the selected part of the elements are displayed in a highlighting manner, so as to recommend to the user.

Note that, the machine learning model described above may be a Neural Network (NN) model, a deep Neural Network (DNN, deep Neural Network) model, or the like, and the machine learning model may be trained by: training the machine learning model based on the sample elements and the tag data to obtain a trained machine learning model, wherein the sample comprises the following forms: features of the element, such as the function, name, etc. of the element; the tag data includes: interest scores (e.g., may be manually annotated, i.e., for each sample element, its corresponding interest score is manually annotated).

For example, taking an application program interface as an example of a game interface, a plurality of game characters, including, for example, a game character a, a game character B, a game character C and a game character D, are displayed in the game interface, and after the user selects the game character a in the game interface, the client may calculate the similarity between the game character a and the game character B, the game character C and the game character D (for example, the feature extraction model may be called first to extract the features corresponding to the game characters a to D, for example, the names, the styles, the skills of the game characters, and the like, respectively, and then calculate the similarity between the features corresponding to the game character a and the features corresponding to the game characters B to D, for example, the cosine similarity, the pearson correlation coefficient, and the like, for example, and assuming that the similarity between the game character a and the game character C is greater than a similarity threshold, the game character C in the game interface may be considered to be interested by the user, the game character C may be highlighted, i.e., the game character C may be recommended to the user, and the user may be prompted to select the game character C, thereby saving the user and improving the efficiency of making the game when the user selects the game character.

It should be noted that, the highlighting mode of the target element selected by the user in the application program interface of the client may be the same as the highlighting mode of other elements to be recommended to the user, for example, highlighting; of course, the target elements selected by the user can be displayed in a highlighting manner, and other elements which need to be recommended to the user in the application program interface can be displayed in a flashing manner, so that the user can distinguish the target elements.

For example, referring to fig. 6B, fig. 6B is an application scenario schematic diagram of a synchronization method of an application program interface provided by an embodiment of the present application, as shown in fig. 6B, in the game interface 610, a plurality of game characters including, for example, a game character 611, a game character 612, a game character 613 and a game character 614 are displayed, and when a user selects the game character 613 in the game interface 610, a client may calculate a similarity between the game character 613 and the game character 611, the game character 612 and the game character 614 (of course, the client may also request the server to calculate the similarity between the game character 613 and the game character 611, the game character 612 and the game character 614 and receive a calculation result returned by the server), and assuming that the similarity between the game character 612 and the game character 613 is greater than a similarity threshold, the game character 612 may also be a game character of interest to the user, and the game character 612 may be highlighted in a blinking manner in the game interface 610, thereby making a recommendation to the user, so that the time required for the user to select the game character can be saved and the efficiency of making the graphic can be improved.

In step 103, a graphic representation including at least one target element is displayed.

Here, the illustrations may be used for other interfaces that are embedded into the same terminal device (i.e., the illustrations generated based on terminal device 400 are embedded into other interface displays of terminal device 400 in fig. 1, for example), or other interface displays of other terminal devices (i.e., the illustrations generated based on terminal device 500 are embedded into other interface displays of terminal device 600 in fig. 2, for example), and in response to an update of at least one target element in the application interface, the update of at least one target element in the illustrations is synchronized.

By way of example, taking an application program interface as a game interface, a game interface to be edited is displayed in a terminal device (e.g., terminal device 1) associated with a graphic setter (e.g., user a), and after the terminal device 1 receives an element selection operation triggered by the user a for the game interface, a target element (e.g., game character a) selected by the user a in the game interface is sent to a server, so that the server generates a graphic including the game character a, and returns the generated graphic to the terminal device 1. Then, when the terminal device 1 receives the confirmation operation triggered by the user a for the graphic, a confirmation instruction is sent to the server to enable the server to acquire the code corresponding to the game attack interface, and the graphic storage address, such as the uniform resource locator (URL, uniform Resource Locator), is inserted into the code corresponding to the game attack interface, and then the server sends the code corresponding to the game attack interface inserted with the graphic URL to the terminal device (such as the terminal device 2) associated with the graphic user (such as the user B), so that the terminal device 2 can acquire the corresponding graphic from the server based on the graphic URL and display the corresponding graphic in the game attack interface when the game attack interface is displayed based on the code corresponding to the game attack interface. In some embodiments, the types of other interfaces may include: novice guidance interfaces, instructions for use interfaces, game play interfaces, and the like. For example, taking an application program interface as a game interface, after receiving an element selection operation triggered by a user for the game interface to obtain a graphic including at least one selected target element (for example, assuming that a game character a is selected in the game interface by the user, the server may generate a graphic including the game character a), the generated graphic may be embedded into the game attack interface to be displayed (for example, the server may insert a storage address of the graphic, for example, a URL of the graphic, in a code corresponding to the game attack interface, so that when the game attack interface is displayed, the client may obtain the corresponding graphic based on the URL of the graphic and display the obtained graphic in the game attack interface), and when the game character a in the game interface is updated (for example, as the game version is updated, the style of the game character a is changed), the game character a in the graphic displayed in the game attack interface may be synchronously updated (that is updated to be the same as the style of the game character a in the game interface corresponding to the updated game character a), so that the game attack is always corresponding to the game attack, and the situation that the user is not browsed by the game interface is avoided.

The following describes the generation process of the drawing.

In some embodiments, the graphical representation may be formed by copying the selected at least one target element, and the code and data interfaces corresponding to the target element, and overlapping and combining to scale.

For example, referring to fig. 5B, fig. 5B is a flowchart of a synchronization method of an application program interface according to an embodiment of the present application, as shown in fig. 5B, before step 103 shown in fig. 4 is performed, step 107A and step 108A shown in fig. 5B may also be performed, and the description will be made with reference to the steps shown in fig. 5B.

In step 107A, at least one target element is sent to a server.

In some embodiments, after determining, in response to an element selection operation triggered by a user for an application program interface, a target area framed in the application program interface by the element selection operation, the terminal device may send at least one target element included in the target area to the server.

In step 108A, a diagram returned by the server including at least one target element is received.

Here, the illustration may be obtained by the server by: and recombining at least one target element, codes corresponding to the target element and data interfaces according to the proportion to obtain a diagram comprising the at least one target element.

For example, taking an application program interface as a game interface, after receiving at least one target element (for example, a game role a) selected from the game interface and sent by the terminal device, the server may perform superposition and combination processing on the game role a and codes and data interfaces corresponding to the game role a according to a proportion, so as to obtain a diagram including the game role a.

In other embodiments, the illustrations may also be obtained by replicating an application program interface.

For example, referring to fig. 5C, fig. 5C is a flowchart of a synchronization method of an application program interface according to an embodiment of the present application, as shown in fig. 5C, before step 103 shown in fig. 4 is performed, steps 107B and 108B shown in fig. 5C may also be performed, and the description will be made with reference to the steps shown in fig. 5C.

In step 107B, at least one target element is sent to the server.

In step 108B, a graphical representation, including at least one target element, returned by the server, is received, along with a graphical representation style.

Here, the illustration may be obtained by the server by: performing format conversion processing on the blueprint file corresponding to the application program interface through a third party component to obtain an extensible application program markup language file; packaging the extensible application markup language file and the map resources to obtain a compressed package file; rendering processing is carried out on the basis of the compressed package file to obtain a diagram comprising at least one target element, so that after receiving the diagram returned by the server and the diagram style, the terminal equipment can display the diagram conforming to the diagram style and comprising at least one target element in a diagram editing area for a user to preview; when the user is not satisfied with the currently generated illustration, the operations described above may be re-performed to generate a new illustration.

In some embodiments, the server may implement the rendering process based on the compressed package file, to obtain the graphic representation including at least one target element, by: unpacking the compressed package file to obtain an extensible application markup language file and a map resource, wherein the extensible application markup language file comprises at least one of the following information: static resources (e.g., pictures in a game scene as background, which can be referenced in XAML), editable elements (e.g., text, buttons, charts, etc., containing elements of a document), structural information (e.g., nested relationships including static resources and editable elements, and layer coverage relationships, etc.); rendering processing is carried out based on the extensible application markup language file and the map resource, and an application program interface is obtained; and hiding or hiding other elements except at least one target element in the application program interface to obtain a diagram comprising the at least one target element.

By way of example, taking an application program Interface as a game Interface, games are typically developed using a UE4 engine, so that a component of a User Interface (UI) blumerint may be used to draw the game Interface, and further, since the UI blumerint file is in a binary format, a third party component, such as ueloader. The XAML file may include, among other things, the following information: static resources, such as game scenes, can be referenced in XAML as background pictures; editable elements, including, for example, text, buttons, charts, etc., containing elements of a document; the structure information includes, for example, nested relationships of static resources and editable elements, layer coverage relationships, and the like. Taking a game interface a as an example, after receiving a target element (for example, a game role 1) selected by a user from the game interface a and sent by a terminal device, the server may first obtain a UI blurrint file and a map resource corresponding to the game interface a, then may perform format conversion processing on the UI blurrint file corresponding to the game interface a by calling a third party component ueloader.

It should be noted that Pak is a special compressed file format, and multiple files may be compressed into one file. In addition, since Pak is a file structure adopted for the design and use of games, it is characterized as follows, unlike a general compressed file format: 1. files such as sound, map, 3D model, texture map and the like are compressed into Pak files in a manner of preserving directory path structures; 2. the compression can be performed at a certain compression rate. That is, the use of Pak has great convenience and plasticity for both the game developer and the player, such as convenient resource calling for the program developer and easy management; in addition, because of the special structure, shielding effect is prevented from being changed randomly for beginners, and the shielding effect is easy to modify and convenient for experienced users.

In other embodiments, the at least one target element in the terminal device synchronization update diagram may be implemented by: responding to the update of at least one target element in the application program interface, and sending an update instruction to a server so that the server synchronously updates the at least one target element in the graphic to obtain an updated graphic style; and receiving the updated graphic pattern returned by the server, and displaying the graphic conforming to the updated graphic pattern in other interfaces.

By way of example, the server may implement the above-described synchronous update of at least one target element in the graph by: performing format conversion processing on the blueprint file corresponding to the updated application program interface through a third party component to obtain a new extensible application program markup language file (namely a new XAML file); unpacking the compressed package file to obtain an old extensible application markup language file (namely an old XAML file), wherein the compressed package file is obtained based on an application program interface before updating; comparing the new extensible application markup language file with the old extensible application markup language file to obtain a difference part (diff); based on the difference portion, at least one target element in the graph is synchronously updated.

For example, the difference portion may include at least one of a difference in static resources (e.g., a background picture of a game scene is replaced with an update in a game version), a difference in editable elements (e.g., a difference in text), and a difference in structural information (e.g., the same element is moved to a new location); the server may implement the above-described difference-based portion to update synchronously at least one target element in the graph by: and based on at least one of the difference of the static resources, the difference of the editable elements and the difference of the structural information, correspondingly adjusting at least one target element in the graphic representation in sequence, and re-rendering to obtain the updated graphic representation.

It should be noted that XAML is a self-descriptive text format, that is, the XAML file may include UI elements such as grids, rectangular boxes, text blocks, and picture boxes, so in an actual application scenario, the XAML file may be used to define a nested relationship between static resources and editable elements, a layer coverage relationship, and the like, so that a 3D game scenario may be described in a 2D manner, so as to implement a graphic that may be updated in real time. That is, unlike the rendering of the game 3D scene provided by the related art, which needs vertex rendering and map rendering pipeline, the embodiment of the application is relatively simple in rendering based on the XAML file and map resource, and only needs to perform 2D rendering according to the hierarchy of the structural information, so that the stability is high, and meanwhile, the requirement that the graphic is updated in real time along with the change of the game UI can be met.

In other embodiments, the method for synchronizing application program interfaces provided in the embodiments of the present application may be applied to a scene involving presentation of interface content, such as a new hand guidance, a use guide, a game attack, etc., a scene involving a drawing such as a game activity, a scene related to a screenshot in a game, or a scene of video introduced by a game, an augmented Reality (AR, augmented Reality), a Virtual Reality (VR), etc.

The following description will be given by taking, as an example, a case where a graphic representation (for example, a graphic representation obtained by performing an element selection operation on a game interface) is embedded in a game introduction video.

For example, referring to fig. 6C, fig. 6C is a schematic view of an application scenario of a synchronization method of an application program interface provided by an embodiment of the present application, as shown in fig. 6C, in which a plurality of game characters are displayed in a game interface 615, when a user selects a game character 616 in the game interface 615, a server may generate a graphic 618 including the game character 616, and embed the graphic 618 into a game introduction video 617 for display; then, with the update of the game version, the style of the game character 616 displayed in the game interface 615 changes, after receiving the update command sent by the client, the server may update the previously generated graphic 618 synchronously, return the updated graphic 619 to the client, and embed the updated graphic 619 into the game introduction video 617 for display, so that when the user views the game introduction video, the graphic displayed in the game introduction video always corresponds to the game interface, and misunderstanding and confusion to the user can be avoided.

In addition, it should be further noted that, before displaying or just about to display the graphic, the terminal device may actively request the update from the server (for example, the client may actively send an update instruction to the server and receive the latest graphic returned by the server), or passively receive the latest graphic pushed by the server in real time, so as to ensure that the graphic that is embedded into other interface displays always corresponds to the application program interface.

According to the method for synchronizing the application program interfaces, provided by the embodiment of the application, the graphical representation which comprises at least one selected target element and can be updated in a linkage way is formed through the selection of the plurality of elements included in the application program interfaces, so that the aim that the graphical representation which comprises at least one target element can be updated synchronously is fulfilled, and therefore, the graphical representation which is embedded into other interfaces and displayed always corresponds to the application program interfaces is ensured, and misunderstanding and confusion caused to a user are avoided.

In the following, an exemplary application of the embodiment of the present application in a practical application scenario will be described.

In the related art, the use of content such as novice guidance, use guidance, game play and the like is presented to the user by means of screenshot. However, since the update iteration speed of the product/game is high, the update of the content such as the novice guide, the use guide and the game attack is difficult to follow the update of the product/game in time, so that the content such as the novice guide, the use guide and the game attack is invalid, or the situation that the content and the product/game are not marked up is caused. For example, in the related art, the interface content is updated iteratively according to the version, and the contents such as the use guide, the game attack, etc. are updated according to the period of three months or half a year, that is, the update time of the interface content is inconsistent with the update time of the use guide content, so that the user is easy to misunderstand and confuse because the use guide content and the interface content are not corresponding.

As can be seen, the scheme provided by the related art has the following problems:

1. cannot be updated in real time;

2. periodically screenshot and updating by manpower;

3. updating points are maintained by manpower, so that omission is easy;

4. after the game/product is updated, the updated interface content and content such as novice guidance, use guidance, game attack and the like are disjointed, and the corresponding content is not on the way, so that the user is misunderstood and confused.

In view of this, an embodiment of the present application provides a method for synchronizing an application program interface, by framing interface elements, to form a graphic which includes framed elements and can be updated in a linkage manner, so as to achieve the purpose of synchronizing and updating the content of the interface in a graphic synchronization manner.

The following specifically describes a method for synchronizing an application program interface provided by an embodiment of the present application.

For example, referring to fig. 7, fig. 7 is a schematic view of an application scenario of a synchronization method of an application program interface provided in an embodiment of the present application, and as shown in fig. 7, taking a production and use guide as an example, a "production and use guide" button 702 is displayed in a man-machine interaction interface 701, and when a click operation of a user on the "production and use guide" button 702 is received, an editing state of content creation is entered. For example, most of the area of the man-machine interface 701 may be the main body of the content interface, that is, the content box 703 (corresponding to the above-mentioned application interface, hereinafter also simply referred to as interface a); the portion of the float layer is an edit section 704 (corresponding to the pictorial edit section described above), wherein the edit section 704 includes a textual description input module, such as a textual description input box 705, and a pictorial addition module, such as a "click section" button 706. Upon receiving a click operation by the user on the "click section" button 706 displayed in the editing area 704, the content box selection area 703 may be switched to a state that can be box-selected (i.e., after the user clicks the "click section" button 706 shown in fig. 7, the human-computer interaction interface 701 may enter a state in which the content of the interface a allows box-selected). In addition, after the user frames the content in interface a (e.g., a target element of the plurality of elements included in interface a), the framed content is highlighted. For example, assuming the user has framed content 707 in interface a (i.e., content framing area 703), content 707 may be highlighted. Then, the content 707 selected by the user in the interface a may be sent to the server, so that the server generates a graphic capable of being updated in a linkage manner, and after receiving the graphic returned by the server, the graphic is displayed in the editing area 704, for example, the graphic 708 corresponding to the content 707 is displayed in the editing area 704, so that when any data in the content 707 selected in the interface a changes, the graphic 708 is synchronized, so that the graphic 708 can be updated in time, and thus, the graphic and the content such as new-hand guidance, use guidance and the like related to the product/game can be updated in real time along with the change of the product/game content.

For example, referring to fig. 8, fig. 8 is an application scenario schematic diagram of a synchronization method of an application program interface provided by an embodiment of the present application, as shown in fig. 8, which illustrates that after editing of content is completed by adopting the method provided by the embodiment of the present application, display effects of image-text contents such as new hand guidance, use guidance, game attack and the like are presented, for example, a graphic 803 displayed in a man-machine interaction interface 801 is updated synchronously with updating of a content frame selection area 802, so as to avoid invalidation of content such as new hand guidance, use guidance, game attack and the like.

In other embodiments, the method for synchronizing application program interfaces provided in the embodiments of the present application may also be applied to scenes such as game attack, game novice guidance, and game official networks.

For example, referring to fig. 9, fig. 9 is a schematic diagram showing a comparison of the before and after updating of a game character according to an embodiment of the present application, as shown in fig. 9, with updating of a game version, a style of a mechanical spider 902 displayed in a game interface 901 is updated.

For example, referring to fig. 10, fig. 10 is a schematic view of an application scenario of a synchronization method of an application program interface provided by the related art, as shown in fig. 10, after a style of a mechanical spider 1002 displayed in a game interface 1001 is updated, the mechanical spider 1002 displayed in an interface 1003 of a drawing and metallocene content module is still a style before update, that is, in a case where the drawing and metallocene content module is not updated, that is, in a scheme provided by the related art, content cannot be updated synchronously following a game.

For example, referring to fig. 11, fig. 11 is a schematic application scenario of the method for synchronizing an application program interface provided by the embodiment of the present application, as shown in fig. 11, after a style of a mechanical spider 1102 displayed in a game interface 1101 is updated, the style of the mechanical spider 1102 displayed in an interface 1103 of a drawing and context module is the updated style of the mechanical spider 1102 displayed in the game interface 1101, that is, when an element in the game interface is updated, after the method provided by the embodiment of the present application is adopted, the graphic in a game attack interface is updated in synchronization with the update of the game interface, so as to avoid misunderstanding and confusion of a user.

The process of synchronizing the content of the drawing text such as game attack, novice guidance, game activity and the like when the elements in the game are updated will be described in detail below.

In some embodiments, after the content editor boxes the content of the game interface (e.g., interface A), the box-selected content is highlighted; meanwhile, the content of the interface A is completely copied at the server side, and the content comprises all elements, codes, data interfaces and the like; the selected portion is highlighted in the copied interface a, and the copied interface a is displayed in the area, and other areas are covered or hidden from the copied interface a, so that the graphic A1 is obtained. In addition, when any data in the interface A changes, the data can be synchronized to the graphic A1, so that the graphic A1 can be updated in time, the effect that the contents of the graphics related to the game, such as the attack, the guidance, the activities and the like, can be updated in real time along with the change of the game contents is realized, the problem that the game and the attack contents are disjointed, not corresponding and not synchronized due to inconsistent updating time in the related technology is solved, and the confusion of a user on the game attack contents is avoided.

The following will describe a method for synchronizing an application program interface according to an embodiment of the present application with reference to fig. 12.

Referring to fig. 12, for example, fig. 12 is a flowchart of a synchronization method of an application program interface according to an embodiment of the present application, and will be described with reference to the steps shown in fig. 12.

In step 201, the client receives a user-triggered selection operation.

In some embodiments, a plurality of identifiers corresponding to the interfaces to be edited may be displayed in a man-machine interaction interface of the client, and when receiving the identifier corresponding to the interface a displayed in the man-machine interaction interface of the client, the user may display the interface a to be edited in the client.

In step 202, the client sends a click operation to the server.

In some embodiments, an edit button, such as "make guide for use" button 702 shown in fig. 7, may also be displayed in the man-machine interaction interface of the client, and after the client receives the click operation triggered by the user for the edit button, the click operation triggered by the user may be transmitted to the server.

In step 203, the server returns an instruction to enter an edit state to the client.

In some embodiments, the server may return an instruction to the client to enter the edit state of interface a after receiving the click operation sent by the client.

In step 204, the client presents an interface A editable state allowing the user to box the content.

In some embodiments, after receiving the command returned by the server to enter the editing state, the client may present the user with an interface state that is editable by the interface a, allowing the user to click on the graphical content that the box selects to be presented.

In step 205, the client receives user selection of content in interface a box in an edited state.

In step 206, the client sends the server the area framed by the user at interface A.

In some embodiments, after the user frames the content in interface a, the client may send the user's operations to the server, including the interface copy instruction and the user's scope of the area framed in interface a.

In step 207, the server replicates interface a and determines the display range of interface a resulting from the replication based on the framed area.

In step 208, the server returns the highlighted result of the framed area to the client.

In some embodiments, the server may return to the client a highlighted result of the framed area based on the user's framed area coverage in interface a.

In step 209, the client highlights the framed area in interface a in the edit state.

In some embodiments, the user may see in the client in the edit state interface a with the framed area in a highlighted state.

In step 210, the client receives a confirmation operation triggered by the user for the box selection area.

In step 211, the client sends an instruction to the server confirming the box selection area.

In some embodiments, after confirming the scope to be framed, the user may perform a double-click confirmation operation, and after receiving the double-click confirmation operation triggered by the user, the client may send an instruction for confirming the framed area to the server.

In step 212, the server confirms the interface a obtained by the save copy, and obtains a dynamically updatable graphic A1 based on the display range determined in step 207.

In some embodiments, after receiving the instruction sent by the client to confirm the box selection area, the server may confirm the interface a copied in step 207, and generate a dynamically updatable graphic A1 based on the display range of the interface a copied determined in step 207, for example, only the area selected by the user may be displayed in the interface a copied, and other areas may be covered or hidden and not displayed in the interface a copied.

In step 213, the server sends a dynamically updatable pictorial style to the client.

In step 214, the client exposes a dynamically updateable illustration A1 in the edit section.

In some embodiments, the server may return a dynamically updateable pictorial style to the client to present the dynamically updateable pictorial A1 in the editing area of the client so that the user may see the framed pictorial A1 in the editing area of the client.

In step 215, the client sends an update instruction to the server.

In some embodiments, the client may send update instructions to the server when any data/element updates are available in the framed area in interface a.

In step 216, the server performs a synchronization update on diagram A1.

In step 217, the server sends the updated pictorial style to the client.

In step 218, the client displays the updated content of diagram A1.

In some embodiments, after receiving the update instruction sent by the client, the server may update the graphic A1 synchronously, and return the updated graphic style to the client, so that updated content of the graphic A1 may be displayed in the client, and thus, the user may see the content included in the updated graphic A1 in the client.

It can be seen that in the above flow, the core is the conversion and update of the interface a and the graphic A1, and the update process of the conversion from the interface a to the graphic A1 and the graphic A1 will be specifically described with reference to fig. 13 and 14, respectively.

For example, referring to fig. 13, fig. 13 is a flowchart of a synchronization method of an application program interface provided by an embodiment of the present application, as shown in fig. 13, a server first obtains a UI blumerint file and a mapping resource corresponding to an interface a, and since a game is usually developed by using a UE4 engine, the interface a is drawn by using a component of the UI blumerint, and the UI blumerint is in a binary format, where a third party component, such as ueloader. Dll, is required to convert the UI blumerint file in the binary format into a file in the XAML format that can be understood by a program, where the XAML format may include the following information: static resources, such as game scenes as background pictures, are referenced in XAML; editable elements, including, for example, text, buttons, charts, etc., containing elements of a document; the structure information includes, for example, nested relationships of static resources and editable elements, layer coverage relationships, and the like. After obtaining the XAML file, the server may package the XAML file and the map resource to obtain a file in UIPak format, and finally may render the graphic A1 based on the file.

For example, referring to fig. 14, fig. 14 is a flowchart of a synchronization method of an application program interface provided by an embodiment of the present application, as shown in fig. 14, when any data/element in a framed area of an interface a is updated, a server may obtain a UI blurrint file corresponding to the updated interface a, then perform format conversion processing by means of a third party component ueloader. Dll to obtain a new XAML file, then unwrap the new XAML file from a UIPak file containing information of the graphic A1 to obtain an old XAML file for describing the UI interface, and then compare the new XAML file with the old XAML file to obtain a difference portion, where the difference portion mainly includes: differences in static resources, differences in editable elements, such as text, and differences in structural information, such as the same element being moved to a new location. Finally, the server may adjust the graphic A1 accordingly in order based on these differences, re-render, and thereby obtain an updated graphic A1.

It should be noted that XAML is a self-descriptive text format, which may include UI elements such as grids, rectangular boxes, text blocks, and picture boxes, and in an actual application scenario, XAML may be used to define static resources, editable elements, and inclusion relationships between the static resources and the editable elements included in the interface, so that a 3D scenario can be described in a 2D manner, thereby implementing a graphical representation that can be updated in real time.

In addition, it should be noted that, the method provided by the embodiment of the application can be applied to not only the scenes related to interface content display such as novice guidance, use guidance, game attack and the like, but also the scenes of drawing and closing in game activities and the like, the scenes related to screenshot in the game and the like. In addition to the above-described obtaining of the graphic A1 through the copy interface a, the contents of the selected element in the copy interface a, the code corresponding to the element, the data interface, and the like may be recombined in proportion to form the graphic A1, thereby synchronizing data.

In summary, the method for synchronizing application program interfaces provided by the embodiment of the application has the following beneficial effects:

1. aiming at scenes related to interface content display such as novice guidance, use guidance, game attack and the like, the graphic can be updated along with the update of the interface;

2. the content such as novice guidance, use guidance, game attack and the like is prevented from being corresponding to the product/game itself;

3. misunderstanding and confusion to the user are avoided;

4. unlike the rendering of the game 3D scene in the related art, which needs vertex rendering and mapping rendering pipelines, the rendering mode based on the XAML file and mapping resources is relatively simple, the 2D rendering is performed according to the level of the structural information, the stability is high, and meanwhile, the requirement that the graphic is updated in real time along with the change of the UI interface of the game can be met.

Continuing with the description below of an exemplary architecture of the synchronization apparatus 465 of an application program interface provided by embodiments of the present application implemented as software modules, in some embodiments, as shown in fig. 3, the software modules stored in the synchronization apparatus 465 of an application program interface of the memory 460 may include: and a display module 4651.

A display module 4651 for displaying an application program interface, wherein the application program interface includes a plurality of elements; the display module 4651 is further configured to highlight at least one target element selected from the plurality of elements and to display a graphic representation including the at least one target element in response to the element selection operation; wherein the graphical representation is for being embedded into the other interface display and in response to an update of at least one target element in the application interface, the at least one target element in the graphical representation is synchronously updated.

In some embodiments, the synchronization apparatus 465 of the application program interface further includes a determining module 4652 for determining, in response to an element selection operation triggered for the application program interface, at least one element included in a target area framed in the application program interface by the element selection operation as a selected at least one target element of the plurality of elements; the display module 4651 is further configured to display at least one target element in a selected state.

In some embodiments, the synchronizing device 465 of the application interface further includes a sending module 4653 and a receiving module 4654, where the sending module 4653 is configured to send the target area framed in the application interface by the element selection operation to the server, so that the server adjusts the target area to a selected state; and the receiving module 4654 is configured to receive the target area in the selected state returned by the server, so as to display the target area in the selected state in the application program interface, where the target area includes at least one target element.

In some embodiments, the sending module 4653 is further configured to send, in response to an acknowledgement operation for the target area, an acknowledgement instruction to the server to cause the server to: copying the application program interface, determining a corresponding frame selection range in the copied application program interface based on the target area selected in the application program interface by element selection operation, and applying a selected state in the frame selection range to form the target area in the selected state.

In some embodiments, the display module 4651 is also used to display a pictorial guide entry; and displaying a graphic editing area in response to a trigger operation for the graphic production guide entry, wherein the graphic editing area comprises a graphic addition control; the synchronization apparatus 465 of the application interface further includes a switching module 4655 for switching the application interface to a state capable of being framed in response to a trigger operation for the pictorial addition control to receive an element selection operation for framing a target region in the application interface.

In some embodiments, the sending module 4653 is further configured to send a trigger operation to a server; the receiving module 4654 is further configured to receive an edit-state entering instruction returned by the server in response to the triggering operation, where the edit-state entering instruction is used to cause the client to switch the application interface to a state that can be framed.

In some embodiments, the pictorial editing area further includes a textual description input control; the receiving module 4654 is further configured to receive, through the text description input control, the inputted descriptive text for introducing the graphic, where the descriptive text is used to be embedded into other interface displays along with the graphic.

In some embodiments, the pictorial bootstrap entry and the pictorial editing region are displayed in a manner that is suspended from the application interface, or the pictorial bootstrap entry and the pictorial editing region are displayed independently of the application interface in a split screen manner.

In some embodiments, the sending module 4653 is further configured to send at least one target element to a server; the receiving module 4654 is further configured to receive a graphic representation including at least one target element and a graphic representation style returned by the server, where the graphic representation is obtained by the server by: performing format conversion processing on the blueprint file corresponding to the application program interface through a third party component to obtain an extensible application program markup language file; packaging the extensible application markup language file and the map resources to obtain a compressed package file; rendering processing is carried out based on the compressed package file, so that a diagram comprising at least one target element is obtained; the display module 4651 is further configured to display a graphic representation in the graphic representation editing area that conforms to the graphic representation style and includes at least one target element.

In some embodiments, the server is further configured to perform the following: unpacking the compressed package file to obtain an extensible application markup language file and a mapping resource; rendering processing is carried out based on the extensible application markup language file and the map resource, and an application program interface is obtained; and hiding or hiding other elements except at least one target element in the application program interface to obtain a diagram comprising the at least one target element.

In some embodiments, the extensible application markup language file includes at least one of the following information: static resources, editable elements and structure information, wherein the structure information comprises at least one of nested relationships and layer coverage relationships of the static resources and the editable elements.

In some embodiments, the sending module 4653 is further configured to send at least one target element to a server; the receiving module 4654 is further configured to receive a graph returned by the server and including at least one target element, where the graph is obtained by the server by: and recombining at least one target element, codes corresponding to the target element and data interfaces according to the proportion to obtain a diagram comprising the at least one target element.

In some embodiments, the sending module 4653 is further configured to send an update instruction to the server, so that the server synchronously updates at least one target element in the graphic to obtain an updated graphic style; the receiving module 4654 is further configured to receive an updated graphic style returned by the server, so as to display a graphic that conforms to the updated graphic style in another interface.

In some embodiments, the server synchronously updates at least one target element in the graph by: performing format conversion processing on the blueprint file corresponding to the updated application program interface through a third party component to obtain a new extensible application program markup language file; unpacking the compressed package file to obtain an old extensible application program markup language file, wherein the compressed package file is obtained based on an application program interface before updating; comparing the new extensible application program markup language file with the old extensible application program markup language file to obtain a difference part; based on the difference portion, at least one target element in the graph is synchronously updated.

In some embodiments, the difference portion includes at least one of a difference in static resources, a difference in editable elements, a difference in structural information; the server is also configured to perform the following: based on at least one of the differences in the static resources, the differences in the editable elements, and the differences in the structural information, at least one target element in the illustration is adjusted accordingly in order.

In some embodiments, the types of other interfaces include: a novice guidance interface, a directions for use interface, and a game play interface.

It should be noted that, the description of the apparatus according to the embodiment of the present application is similar to the description of the embodiment of the method described above, and has similar beneficial effects as the embodiment of the method, so that a detailed description is omitted. The technical details of the synchronization device of the application program interface provided in the embodiment of the present application may be understood according to the description of fig. 4, or any one of fig. 5A to 5C.

Embodiments of the present application provide a computer program product or computer program comprising computer instructions stored in a computer readable storage medium. The processor of the computer device reads the computer instructions from the computer readable storage medium, and the processor executes the computer instructions, so that the computer device executes the synchronization method of the application program interface according to the embodiment of the present application.

Embodiments of the present application provide a computer readable storage medium having stored therein executable instructions that, when executed by a processor, cause the processor to perform a method of synchronizing an application program interface provided by embodiments of the present application, for example, as illustrated in fig. 4, or any of fig. 5A to 5C.

In some embodiments, the computer readable storage medium may be FRAM, ROM, PROM, EPROM, EEPROM, flash memory, magnetic surface memory, optical disk, or CD-ROM; but may be a variety of devices including one or any combination of the above memories.

In some embodiments, the executable instructions may be in the form of programs, software modules, scripts, or code, written in any form of programming language (including compiled or interpreted languages, or declarative or procedural languages), and they may be deployed in any form, including as stand-alone programs or as modules, components, subroutines, or other units suitable for use in a computing environment.

As an example, the executable instructions may, but need not, correspond to files in a file system, may be stored as part of a file that holds other programs or data, for example, in one or more scripts in a hypertext markup language (HTML, hyper Text Markup Language) document, in a single file dedicated to the program in question, or in multiple coordinated files (e.g., files that store one or more modules, sub-programs, or portions of code).

As an example, executable instructions may be deployed to be executed on one computing device or on multiple computing devices located at one site or, alternatively, distributed across multiple sites and interconnected by a communication network.

The foregoing is merely exemplary embodiments of the present application and is not intended to limit the scope of the present application. Any modification, equivalent replacement, improvement, etc. made within the spirit and scope of the present application are included in the protection scope of the present application.

Claims

1. A method for synchronizing an application program interface, the method comprising:

2. The method of claim 1, wherein the highlighting the selected at least one target element of the plurality of elements in response to an element selection operation comprises:

And responding to the element selection operation triggered by the application program interface, determining at least one element included in the target area, which is framed in the application program interface, of the element selection operation as at least one selected target element in the plurality of elements, and displaying the at least one target element in a selected state.

3. The method of claim 2, wherein the step of determining the position of the substrate comprises,

the displaying the at least one target element in the selected state includes:

sending the target area selected by the element selection operation in the application program interface to a server so that the server adjusts the target area to be in a selected state;

and receiving the target area in the selected state returned by the server so as to display the target area in the selected state in the application program interface, wherein the target area comprises the at least one target element.

4. The method of claim 3, wherein the step of,

the method further comprises the steps of:

in response to a confirmation operation for the target area, sending a confirmation instruction to the server to cause the server to perform the following processing:

Copying the application program interface, and based on the element selection operation, the target area framed in the application program interface, determining a corresponding framing range in the copied application program interface, and applying the selected state in the framing range to form the target area in the selected state.

5. The method of any one of claims 1 to 4, wherein prior to responding to the element selection operation, the method further comprises:

displaying the graphic to manufacture a guide inlet;

responsive to a trigger operation for the pictorial production boot portal, displaying a pictorial editing area, wherein the pictorial editing area includes a pictorial addition control;

and responding to the triggering operation of the graphical addition control, switching the application program interface to a state capable of being framed so as to receive the element selection operation of framing a target area in the application program interface.

6. The method of claim 5, wherein said switching the application interface to a state that can be framed comprises:

sending the triggering operation to a server;

and receiving an edit-entering instruction returned by the server in response to the trigger operation, wherein the edit-entering instruction is used for enabling the client to switch the application program interface to a state capable of being selected by a frame.

7. The method of claim 5, wherein the pictorial editing area further comprises a literal description input control;

the method further comprises the steps of:

and receiving the input descriptive text for introducing the graphic through the text descriptive input control, wherein the descriptive text is used for being embedded into the other interface display together with the graphic.

8. The method of claim 5, wherein the step of determining the position of the probe is performed,

the graphic production guide entry and the graphic editing area are displayed in a manner of being suspended in the application program interface, or the graphic production guide entry and the graphic editing area are displayed independently of the application program interface in a manner of being split screen.

9. The method of claim 1, wherein prior to displaying the graphical representation comprising the at least one target element, the method further comprises:

transmitting the at least one target element to a server;

receiving a diagram and a diagram style returned by the server, wherein the diagram comprises at least one target element, and the diagram style is obtained by the server through the following modes:

performing format conversion processing on the blueprint file corresponding to the application program interface through a third party component to obtain an extensible application program markup language file;

Packaging the extensible application program markup language file and the map resources to obtain a compressed package file;

rendering processing is carried out on the basis of the compressed package file, and a diagram comprising at least one target element is obtained;

the display includes a representation of the at least one target element, including:

the illustration conforming to the illustration style and including the at least one target element is displayed in an illustration editing area.

10. The method of claim 9, wherein the rendering based on the compressed package file results in a diagram including the at least one target element, comprising:

unpacking the compressed package file to obtain the extensible application markup language file and the map resource;

rendering processing is carried out based on the extensible application program markup language file and the map resource, so that the application program interface is obtained;

and hiding or hiding other elements except the at least one target element in the application program interface to obtain a diagram comprising the at least one target element.

11. The method according to claim 9 or 10, wherein,

The extensible application markup language file includes at least one of the following information:

static resources, editable elements and structural information, wherein the structural information comprises at least one of nested relationships and layer coverage relationships of the static resources and the editable elements.

12. The method of any one of claims 1 to 4, wherein prior to displaying the graphical representation comprising the at least one target element, the method further comprises:

transmitting the at least one target element to a server;

receiving a diagram returned by the server and comprising the at least one target element, wherein the diagram is obtained by the server through the following modes:

and recombining the at least one target element, the codes corresponding to the target element and the data interfaces according to the proportion to obtain a diagram comprising the at least one target element.

13. The method according to any one of claims 1 to 4, wherein said synchronously updating said at least one target element in said illustration is achieved by:

sending an update instruction to a server so that the server synchronously updates at least one target element in the graphic to obtain an updated graphic style;

And receiving the updated graphic style returned by the server, and displaying the graphic conforming to the updated graphic style in the other interfaces.

14. The method of claim 13, wherein the server synchronously updates the at least one target element in the illustration by:

performing format conversion processing on the updated blueprint file corresponding to the application program interface through a third party component to obtain a new extensible application program markup language file;

unpacking the compressed package file to obtain an old extensible application program markup language file, wherein the compressed package file is obtained based on the application program interface before updating;

comparing the new extensible application program markup language file with the old extensible application program markup language file to obtain a difference part;

based on the difference portion, the at least one target element in the illustration is synchronously updated.

15. The method of claim 14, wherein the step of providing the first information comprises,

the difference part comprises at least one of a difference of static resources, a difference of editable elements and a difference of structure information;

The synchronously updating the at least one target element in the graph based on the difference portion includes:

the at least one target element in the illustration is sequentially adjusted based on at least one of the differences in the static resources, the differences in the editable elements, and the differences in the structural information.

16. The method of claim 1, wherein the step of determining the position of the substrate comprises,

the types of the other interfaces include: a novice guidance interface, a directions for use interface, and a game play interface.

17. A synchronization apparatus for an application program interface, the apparatus comprising:

18. An electronic device, the electronic device comprising:

a memory for storing executable instructions;

a processor for implementing the method of synchronizing application program interfaces according to any of claims 1 to 16 when executing executable instructions stored in said memory.

19. A computer readable storage medium storing executable instructions which when executed by a processor implement the method of synchronizing an application program interface of any one of claims 1 to 16.

20. A computer program product comprising a computer program or instructions which, when executed by a processor, implements the method of synchronizing an application program interface of any of claims 1 to 16.