WO2024061064A1 - 展示效果处理方法、装置、电子设备及存储介质 - Google Patents

展示效果处理方法、装置、电子设备及存储介质 Download PDF

Info

Publication number
WO2024061064A1
WO2024061064A1 PCT/CN2023/118433 CN2023118433W WO2024061064A1 WO 2024061064 A1 WO2024061064 A1 WO 2024061064A1 CN 2023118433 W CN2023118433 W CN 2023118433W WO 2024061064 A1 WO2024061064 A1 WO 2024061064A1
Authority
WO
WIPO (PCT)
Prior art keywords
target
display effect
constraint
editing
associated element
Prior art date
Application number
PCT/CN2023/118433
Other languages
English (en)
French (fr)
Inventor
宁华龙
孙文鹏
Original Assignee
北京字跳网络技术有限公司
Priority date (The priority date is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the date listed.)
Filing date
Publication date
Application filed by 北京字跳网络技术有限公司 filed Critical 北京字跳网络技术有限公司
Publication of WO2024061064A1 publication Critical patent/WO2024061064A1/zh

Links

Classifications

    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00—Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
    • G06F3/01—Input arrangements or combined input and output arrangements for interaction between user and computer
    • G06F3/048—Interaction techniques based on graphical user interfaces [GUI]
    • G06F3/0484—Interaction techniques based on graphical user interfaces [GUI] for the control of specific functions or operations, e.g. selecting or manipulating an object, an image or a displayed text element, setting a parameter value or selecting a range
    • G06F3/04842—Selection of displayed objects or displayed text elements
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00—Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
    • G06F3/01—Input arrangements or combined input and output arrangements for interaction between user and computer
    • G06F3/048—Interaction techniques based on graphical user interfaces [GUI]
    • G06F3/0484—Interaction techniques based on graphical user interfaces [GUI] for the control of specific functions or operations, e.g. selecting or manipulating an object, an image or a displayed text element, setting a parameter value or selecting a range
    • G06F3/04845—Interaction techniques based on graphical user interfaces [GUI] for the control of specific functions or operations, e.g. selecting or manipulating an object, an image or a displayed text element, setting a parameter value or selecting a range for image manipulation, e.g. dragging, rotation, expansion or change of colour
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06T—IMAGE DATA PROCESSING OR GENERATION, IN GENERAL
    • G06T11/00—2D [Two Dimensional] image generation
    • G06T11/60—Editing figures and text; Combining figures or text

Definitions

  • Embodiments of the present disclosure relate to the field of text editing technology, for example, to a display effect processing method, device, electronic device, and storage medium.
  • Embodiments of the present disclosure provide a display effect processing method, device, electronic device, and storage medium.
  • embodiments of the present disclosure provide a display effect processing method, which method includes:
  • the current display effect of the at least one associated element in the interactive interface is adjusted based on the target display effect, so that the target display effect of the at least one associated element is adjusted according to the editing operation of the target element.
  • embodiments of the present disclosure also provide a display effect processing device, which includes:
  • a display effect determination module configured to determine at least one associated element corresponding to the target element and the target display effect of the at least one associated element in response to an editing operation on the target element
  • a display effect display module configured to adjust the current display effect of the at least one associated element in the interactive interface based on the target display effect, so that the target display effect of the at least one associated element is adjusted according to the editing operation of the target element.
  • embodiments of the present disclosure also provide an electronic device, where the electronic device includes:
  • processors one or more processors
  • a storage device configured to store one or more programs
  • the one or more processors When the one or more programs are executed by the one or more processors, the one or more processors are caused to implement the display effect processing method as described in any one of the embodiments of the present disclosure.
  • embodiments of the present disclosure also provide a storage medium containing computer-executable instructions, which when executed by a computer processor are used to perform the display effect as described in any of the embodiments of the present disclosure. Approach.
  • Figure 1A is a schematic flowchart of a display effect processing method provided by an embodiment of the present disclosure
  • Figure 1B is a schematic diagram of a text editing interface provided by an embodiment of the present disclosure.
  • Figure 1C is a schematic diagram of another text editing interface provided by an embodiment of the present disclosure.
  • Figure 2A is a schematic flowchart of yet another display effect processing method provided by an embodiment of the present disclosure.
  • Figure 2B is a schematic diagram showing constraint relationships between elements through a directed acyclic graph provided by an embodiment of the present disclosure
  • Figure 2C is a schematic diagram of a type of constraint logic provided by an embodiment of the present disclosure.
  • Figure 2D is a schematic diagram of a method for determining position constraints provided by an embodiment of the present disclosure
  • Figure 3 is a schematic flowchart of a text template display effect processing method provided by an embodiment of the present disclosure
  • Figure 4 is a structural block diagram of a display effect processing device provided by an embodiment of the present disclosure.
  • FIG. 5 is a schematic structural diagram of an electronic device provided by an embodiment of the present disclosure.
  • the term “include” and its variations are open-ended, ie, “including but not limited to.”
  • the term “based on” means “based at least in part on.”
  • the term “one embodiment” means “at least one embodiment”; the term “another The term “embodiments” means “at least one additional embodiment”; the term “some embodiments” means “at least some embodiments”. Relevant definitions of other terms will be given in the description below.
  • an exemplary description of the application scenario can be provided.
  • the embodiments of the present disclosure can be applied to any interactive interface that needs to display effects.
  • it can be used in the video shooting process to display effects on images or videos corresponding to the user being photographed, such as short video shooting or editing. scene.
  • FIG. 1A is a schematic flowchart of a display effect processing method provided by an embodiment of the present disclosure.
  • This embodiment can be applied to adjust the display effect in any editing scenario supported by the Internet, such as a text editing scenario. , adjust the text display effect, or be used in image editing scenarios to adjust the image display effect, etc.
  • the method can be executed by a display effect processing device, which can be implemented in the form of software and/or hardware.
  • the hardware can be an electronic device, such as a mobile terminal, a personal computer (Personal Computer, PC) or a server.
  • Arbitrary text editing scenarios are usually implemented by the cooperation of the client and the server.
  • the method provided in this embodiment can be executed by the server, the client, or the client and the server.
  • the method of this embodiment includes:
  • the device for executing the display effect processing method provided by the embodiment of the present disclosure can be integrated in the application software that supports the text editing function, and the software can be installed in the electronic device, for example, the electronic device can be a mobile terminal or a PC.
  • the application software can be a type of software for image/video processing, and its application software will not be described one by one here, as long as the image/video processing can be realized. It can also be a specially developed application program to realize the software for adding special effects and displaying special effects, or it can be integrated in the corresponding page, and the user can realize the special effect adding processing through the page integrated in the PC.
  • the target element is the element currently edited by the user, and the associated element can be understood as an element whose display effect is associated with the target element.
  • the target element can be the currently edited image, and the associated elements can be the special effects, fill, background, etc. of the image.
  • the target element can be the currently edited text or text box, and the associated element can be the background of the text.
  • text editing can use images as the background for text editing, or use videos as the background for text editing, or you can directly edit text without background.
  • the background of text editing can be obtained through real-time processing, or It can be obtained by retrieving from stored images or videos.
  • the background image can be either a static image or a dynamic image, which is not limited in the embodiments of the present disclosure.
  • association relationship between elements can be set in advance according to the association relationship between elements, the associated element corresponding to the target element can be determined through the preset association relationship, and the target display effect of the associated element can be determined according to the adjustment of the target element, so that the element display The effect is more flexible.
  • the editing operation on the target element includes: detecting a resizing operation on the target element; or detecting an editing operation on the element content of the target element.
  • the target element can be text content or a text box.
  • the font size of the text content or the size adjustment of the text box is detected, it can be determined that the resizing operation of the target element is detected; when the editing of the text content is detected During operations, such as adding text content, deleting text content, etc., the editing operation of the element content of the target element can be determined.
  • the target element can be a picture.
  • the resizing of the picture it can be determined that the resizing operation of the target element is detected; when the editing operation of the picture is detected, such as adding pictures, deleting pictures, etc., it can Determines if an editing operation on the element content of the target element has been detected. When any of the above operations is detected, it can be determined that an editing operation on the target element has been detected.
  • the currently edited text content or associated text box in the text editing template is used as the target element
  • the background element in the text editing template is used as the associated element.
  • the editing of the text box determines the target display effect of the background element, allowing the background to change with the text, simplifying the complexity of using the text editing template, and improving the efficiency of text editing using the text editing template.
  • background elements can include multiple types (such as backgrounds with highlighted patterns or backgrounds with filled patterns, etc.).
  • the adjusted display effect can be the same as the previous adjustment. be consistent.
  • the current display effect is adjusted to the target display effect on the interactive interface, so that the display effect of the associated elements changes with the adjustment of the target element.
  • the coverage area of the text content may exceed the coverage area of the text content before text editing. If the coverage area of the previous background and the coverage of the text content are adjusted, If the areas are the same, after the text content is increased, the coverage area of the text content will exceed the coverage area of the background, resulting in part of the displayed text content having no corresponding background. In order to improve the display effect, as the text content increases, the coverage area of the background can be adjusted so that it can correspond to the coverage area of the text content.
  • adjusting the current display effect of associated elements in the interactive interface based on the target display effect includes: determining a target display image according to the target display effect, and displaying the targeted display on the interactive interface image.
  • the target display image corresponding to the target display effect can be directly rendered, and the current display effect can be directly adjusted to the target display image on the interactive interface.
  • multiple intermediate display effects between the current display effect and the target display effect can also be determined as multiple display effect change frames, and multiple display effect changes can be displayed sequentially on the interactive interface.
  • a display effect change frame is used to adjust the current display effect in the interactive interface to the target display effect through multiple display effect change frames displayed in sequence.
  • Determining multiple intermediate display effects between the current display effect and the target display effect as multiple display effect change frames may be: determining at least one intermediate through the difference between the pixel values of each pixel in the current display effect and the target display effect.
  • the pixel value of the pixel in the display effect, and the corresponding display effect change frame is determined based on the pixel value of the pixel.
  • FIG. 1B is a schematic diagram of a text editing interface provided by an embodiment of the present disclosure.
  • Figure 1B schematically shows a schematic diagram of a text editing template.
  • the text editing template includes a text box and a background.
  • the coverage area of the text box matches the coverage area of the background.
  • FIG. 1C is a schematic diagram of another text editing interface provided by an embodiment of the present disclosure. Compared with the content of the text box in Figure 1C, "right" has been added in Figure 1B, resulting in the length and side length of the text box and the coverage area becoming larger. In order to avoid the text display caused by the text box coverage area being larger than the background coverage area when the text in Figure 1B is increased. The effect is poor.
  • the coverage area of the background is adaptively adjusted with the coverage area after editing of the text box, so that after the text content increases, the coverage area of the background still matches the coverage area of the text content, so that the coverage area of the background
  • the display effect can change with the editing of the text box, which improves the application flexibility of text editing templates.
  • At least one associated element corresponding to the target element and the target display effect of the associated element are determined; based on the target display effect, the current display effect of the associated element in the interactive interface is adjusted to make the association
  • the display effect of the element and the target element are adjusted in association, so that when the target element is edited and adjusted, the display effect of the associated element can be adaptively adjusted, so that the display effect of other elements can be adjusted adaptively with the editing of template elements, improving the flexibility of editing applications.
  • FIG. 2A is a schematic flowchart of another display effect processing method provided by an embodiment of the present disclosure. On the basis of the foregoing embodiments, further adjustments are made to the determination of the target display effect. The technical terms that are the same as or corresponding to the above embodiments will not be described again here.
  • the method includes the following steps:
  • the constraint logic is constructed in advance according to the dependency relationship between elements. After detecting the editing operation on the target element, the associated elements related to the target element are determined according to the pre-constructed constraint logic.
  • the number of associated elements can be one or more, and an associated element is an element that has a direct or indirect constraint relationship with the target element.
  • the direct constraint relationship can be understood as the associated element is directly dependent on the target element
  • the indirect constraint relationship can be understood as the associated element is dependent on the target element through one or more other associated elements. That is to say, there is a constraint relationship between the associated element and the target element, and/or there is a constraint relationship between the associated elements. For example, assuming that the target element is element A, element B depends on element A, and element C depends on element B, then element B and element A have a direct constraint relationship, and element C and element A have an indirect constraint relationship.
  • the constraint relationship may be a position and/or size constraint relationship.
  • element B and element A may be a position constraint relationship, a size constraint relationship, or a position and size constraint relationship.
  • position constraint relationship it means that the position of element B changes with the change of the position of element A; assuming that element B and element A have a size constraint relationship, it means that the size of element B changes with the change of the size of element A.
  • Change assuming that element B and element A have a position and size constraint relationship, it means that the position and size of element B change as the position and size of element A change.
  • the elements that have a direct constraint relationship with the target element can be first determined as associated elements, and then based on the associated elements, the elements that have a direct constraint relationship with the associated elements can also be determined as associated elements, and the above operations are iteratively performed until there are no more elements. There is a direct constraint relationship between the element and the associated element, and the associated element determined above is used as the associated element corresponding to the target element.
  • constraint logic can be represented by a directed acyclic graph.
  • graph theory if a directed graph cannot start from a vertex and return to that point through several edges, then the graph is a directed acyclic graph.
  • FIG. 2B is a schematic diagram showing a constraint relationship between elements through a directed acyclic graph provided by an embodiment of the present disclosure.
  • the direction of the arrow indicates dependence.
  • the arrow points from node 1 to node 2, then node 1 depends on node 2.
  • both element B and element C depend on element A, that is, there is a direct constraint relationship with element A respectively.
  • Element C also depends on element B, that is, there is a direct constraint relationship between element C and element B.
  • Element D Depends on element B, that is, there is a direct constraint relationship between element D and element B System, there is an indirect constraint relationship between element D and element A, and element E does not depend on any element.
  • element A is the target element, then element B, element C and element D are associated elements.
  • S220 Determine the target display effect of the associated element according to the editing target of the target element and the constraint relationship between the associated element and the target element.
  • the target display effect of the associated element is determined based on the editing target of the target element based on the constraint relationship related to the associated element.
  • the editing target is the target of the editing operation. For example, assuming that the editing operation is to adjust the size of the target element, the editing target is the adjusted size of the target element; assuming that the editing operation is to edit the element content of the target element, the editing target is the edited element content.
  • the display constraint relationship between the associated element and the target element can be determined based on the constraint relationship between the associated element and the target element, and the display constraint relationship is determined based on the editing target of the target element and the above display constraint relationship.
  • the target display effect of this associated element For example, assuming that the target element is element A, the associated elements are element B and element C, and element C depends on element B, and element B depends on element A, then according to the constraint relationship between element B and element A, and The constraint relationship between element C and element B determines the display constraint relationship between element C and element A, and the display constraint relationship between element B and element A is determined based on the constraint relationship between element B and element A.
  • the target display effect of each associated element can also be determined sequentially based on the constraint relationship between the associated elements. Based on this, there are multiple associated elements, and the target display effect of the associated element is determined based on the editing target of the target element and the constraint relationship between the associated element and the target element, including: based on the editing target of the target element, based on the constraints between associated elements The relationship and the constraint relationship between the associated elements and the target element determine the element display effect of each associated element in turn; the element display effects of each associated element are combined to obtain the target display effect.
  • the order in which the display effects are determined can be determined based on the constraint relationship between elements, and the element display effects of each associated element can be determined sequentially based on the order in which the display effects are determined. For example, you can start with associated elements that have a direct constraint relationship with the target element, determine the element display effect of each associated element in turn based on the constraint relationship, and finally determine the target display effect.
  • the constraint relationship between the element and the target element determines the element display effect of each associated element in turn, including: determining an associated element as a baseline adjustment element based on the constraint relationship between the associated elements and the constraint relationship between the associated element and the target element; The element adjustment sequence is determined based on the constraint relationship between associated elements; based on the baseline adjustment element, the element display effect of each associated element is determined in turn based on the editing target of the target element and the element adjustment sequence. For example, you can use the associated elements that directly depend on the target element as the baseline adjustment element, or you can use the associated elements that have no dependency as the baseline adjustment element.
  • the element adjustment sequence is determined based on the constraint relationship between the elements, and the adjustment order of each associated element is determined in turn.
  • Element display effect Assume that the target element is element A, the associated elements are element B, element C, and element D, and element D depends on element C, element C depends on element B, and element B depends on element A. Then element D or element B can be used as the base adjustment element. When element D is the base adjustment element, the order of element D, element C and element B can be used as the element adjustment sequence; when element B is the base adjustment element, the order of element D, element C and element B can be used as the element adjustment sequence. The order of element B, element C and element D is used as the element adjustment order. Determining the element display effect of each element sequentially based on the dependency relationship between elements simplifies the relationship determination operation compared to determining the display effect of each element individually.
  • the constraint logic is represented by a directed acyclic graph. Any node in the directed acyclic graph is a target element or an associated element. According to the constraint relationship between the associated elements and the constraints between the associated element and the target element The relationship determines an associated element as a base adjustment element, including: determining the in-degree parameter of each node in the directed acyclic graph, and using the element corresponding to the node with an in-degree parameter of 0 as the base adjustment element.
  • the number of edges starting with a node is called the in-degree of the vertex
  • the number of edges starting with a node is called the out-degree of the vertex.
  • nodes can be divided into two groups: unadjusted and adjusted, and then the nodes are sorted based on their in-degree, and nodes with in-degree and out-degree of 0 are divided For the adjusted group, adjust the out-degree value after other nodes are adjusted and divide them into the adjusted group until there is no node with an out-degree of 0, and stop traversing.
  • the element display effect is the size of the element
  • the element display effect of the associated element to be adjusted is determined based on the element display effect of the dependent associated element, including: determining the associated constraint size based on the element size of the dependent associated element; determining the dependent associated element and The fixed constraint size between the associated elements to be adjusted; determine the size of the associated element to be adjusted based on the associated constraint size and the fixed constraint size.
  • the size of the background needs to be adjusted so that it corresponds to the size of the text content. Based on this, the background display effect is achieved by adjusting the background size.
  • the size of the elements to be adjusted can be determined by combining fixed constraints and floating constraints. Taking element B as the associated element to be adjusted and element A as the dependent associated element as an example, you can pre-set the fixed constraint size between element B and element A (such as the center position distance, the distance between a corresponding side, etc.), After the size of element A is adjusted, the associated constraint size of element A is determined based on the adjusted size of element A, and the size of element B is determined based on the associated constraint size and the fixed constraint size.
  • FIG. 2C is a schematic diagram of a type of constraint logic provided by an embodiment of the present disclosure.
  • Figure 2C takes text editing as an example to schematically illustrate the constraint logic types between elements.
  • element A and element B in the text template can have different types of constraint logic, such as position constraint relationships, horizontal scaling constraint relationships, vertical scaling constraint relationships, surrounding scaling constraint relationships, etc.
  • the position constraint relationship can be that element B changes with the position change (movement) of element A
  • the horizontal scaling constraint relationship can be that the horizontal size of element B changes with the change of the horizontal size of element A
  • the vertical scaling constraint relationship can be that the element The vertical size of B changes with the change of the vertical size of element A.
  • the surrounding scaling constraint relationship can be that the overall size of element B changes with the change of the overall size of element A.
  • the size of the associated element to be adjusted can be determined from the horizontal direction and/or the vertical direction based on different constraint logic, and the size in each direction can be determined in the above manner. For example, assuming that the constraints between elements are positional relationship constraints, the coordinates of the associated elements to be adjusted can be determined based on the position coordinates (such as center point coordinates) of the dependent associated elements; assuming that the constraints between elements are horizontal scaling constraints, the coordinates of the associated elements to be adjusted can be determined based on the direction of the dependent associated elements.
  • the horizontal size determines the horizontal size of the associated element to be adjusted; assuming that the constraints between elements are vertical scaling constraints, the vertical size of the associated elements to be adjusted can be determined based on the vertical size of the dependent associated elements; assuming that the constraints between elements are For the surrounding scaling constraints, the horizontal size of the associated element to be adjusted can be determined based on the horizontal size of the dependent associated element, and the vertical size of the associated element to be adjusted can be determined based on the vertical size of the dependent associated element.
  • FIG. 2D is a schematic diagram of a method for determining position constraints provided by an embodiment of the present disclosure.
  • the left side is the dependent association element
  • the right side is the association element to be adjusted.
  • UI represents user interface (UI).
  • the position of the associated element to be adjusted can be determined by The fixed distance between the right sides of the associated elements, Y is the adjusted proportion of the dependent associated element, and Z is the width of the dependent associated element.
  • the element display effect of the associated element to be adjusted can be directly determined based on the multiple dependent associated elements, or the element display effect to be adjusted can be determined based on each dependent element relationship. Element display effect of associated elements.
  • the associated element is determined according to the preset constraint logic, and the target display effect of the associated element is determined according to the editing target of the target element and the constraint relationship between the associated element and the target element, so that the target display effect of the associated element is determined. It is more accurate, thus making the related display effect of related elements and target elements better.
  • Figure 3 is a schematic flowchart of a text template display effect processing method provided by an embodiment of the present disclosure.
  • Figure 3 takes text as the target element in the text editing scene as an example, which provides a preferred example of adjusting the text display effect.
  • dependencies are built in advance based on the relationships between elements, which can be displayed in the form of a directed acyclic graph.
  • Each element stores the information of its dependent object correspondingly, so that when the dependent object changes, it can change along with it.
  • element attributes are updated, as in the above embodiment, it can be implemented in horizontal and/or vertical directions.
  • updating element attributes in the horizontal direction can be: (1) Establish a dependency graph for the constraint nodes and divide them into two groups: unconstrained and constrained. Fixed-size controls require special size constraints on the left and right. Size constraints only count the in-degree but not the out-degree. (2) Sort the in-degree of the nodes and extract all nodes with in-degree and out-degree of 0. Nodes (independent nodes) are placed in the constrained group; traverse the node dependencies with out-degree 0, place them in the constrained group, and decrement the out-degree of the target node by 1; loop until the unconstrained group is empty. If no node with out-degree 0 is found, it means there is a dependency cycle, and stop traversing.
  • Updating element attributes in the vertical direction can also update element attributes in the horizontal direction.
  • updating the attributes in the vertical direction may destroy the dependence on the horizontal direction and need to be recalculated.
  • the text template display effect processing method provided in this embodiment can be implemented by a text template editing system.
  • Logicalizing the constraints between different elements replaces the framework logic of the text template editing system using the rendering engine Entity Component System (ECS) architecture in the original text template, which enables a more flexible implementation of logical design between elements.
  • the overall framework of the design solution can include the business interface calling layer, Software Development Kit (SDK) script layer (scenario business logic layer) and SDK basic functional architecture layer.
  • SDK basic functional architecture layer also includes the JS script framework layer and the SDK rendering engine.
  • the JS script layer can implement the creation, deletion, and dynamic expansion framework of each basic element, etc.
  • the SDK script layer can set up all business logic, such as element constraint updates, position changes, etc.
  • framework logic such as constraint logic and element creation attribute update are all implemented using script solutions. If users want to expand more design template functions, they can directly change the script and dynamically issue scripts with new functions through the background. to the client to achieve the purpose of hot update.
  • Figure 4 is a structural block diagram of a display effect processing device provided by an embodiment of the present disclosure. It can execute the display effect processing method provided by any embodiment of the present disclosure, and has corresponding functional modules and beneficial effects of the execution method. As shown in FIG. 4 , the device includes: a display effect determination module 410 and a display effect display module 420 .
  • the display effect determination module 410 is configured to determine at least one associated element corresponding to the target element and the target display effect of the associated element in response to an editing operation on the target element;
  • the display effect display module 420 is configured to adjust the current display effect of the associated elements in the interactive interface based on the target display effect, so that the target display effect of the associated elements is adjusted and displayed according to the editing operation of the target element.
  • the editing operation on the target element includes: detecting the resizing operation of the target element; or detecting the editing operation of the element content of the target element.
  • adjusting the current display effect of associated elements in the interactive interface based on the target display effect includes:
  • a target display image is determined according to the target display effect, and the target display image is displayed on the interactive interface.
  • determining at least one associated element corresponding to the target element and the target display effect of the associated element include:
  • the target display effect of the associated element is determined according to the editing target of the target element and the constraint relationship between the associated element and the target element, wherein the editing target is the target of the editing operation.
  • the target display effect of the associated element is determined according to the editing target of the target element and the constraint relationship between the associated element and the target element, including:
  • the element display effect of each associated element is determined in turn according to the constraint relationship between the associated elements and the constraint relationship between the associated element and the target element;
  • the element display effects of each associated element are combined to obtain the target display effect.
  • the element display effect of each associated element is determined sequentially according to the constraint relationship between the associated elements and the constraint relationship between the associated element and the target element, including:
  • the element display effect of each associated element is determined in turn based on the editing target of the target element and the element adjustment sequence.
  • determining the element display effect of each associated element in turn based on the element adjustment order includes:
  • the element display effect of the associated element to be adjusted is determined based on the element display effect of the dependent associated element.
  • the element display effect is the size of the element
  • the element display effect of the associated element to be adjusted is determined based on the element display effect of the dependent associated element, including:
  • the constraint logic is represented by a directed acyclic graph, any node in the directed acyclic graph is a target element or an associated element, and an associated element is determined as a reference adjustment element according to the constraint relationship between the associated elements and the constraint relationship between the associated element and the target element, including:
  • the target element is a text box
  • the associated element is the background of the text box.
  • At least one associated element corresponding to the target element and the target display effect of the associated element are determined; based on the target display effect, the current display effect of the associated element in the interactive interface is adjusted, so that the associated element
  • the target display effect is adjusted according to the editing operation of the target element, so that when the target element is edited and adjusted, the display effect of the associated element can be adaptively adjusted, so that the display effect can be adjusted adaptively with text editing, and the application of text editing templates has been improved. flexibility.
  • the display effect processing device provided by the embodiment of the present disclosure can execute the display effect processing method provided by any embodiment of the present disclosure, and has functional modules and beneficial effects corresponding to the execution method.
  • FIG. 5 is a schematic structural diagram of an electronic device provided by an embodiment of the present disclosure.
  • Terminal devices in embodiments of the present disclosure may include, but are not limited to, mobile phones, notebook computers, digital broadcast receivers, personal digital assistants (Personal Digital Assistant, PDA), tablet computers (PAD), portable multimedia players (Portable Media Player , PMP), mobile terminals such as vehicle-mounted terminals (such as vehicle-mounted navigation terminals), and fixed terminals such as digital televisions (Television, TV), desktop computers, etc.
  • PDA Personal Digital Assistant
  • PMP portable multimedia players
  • PMP Portable Media Player
  • mobile terminals such as vehicle-mounted terminals (such as vehicle-mounted navigation terminals)
  • fixed terminals such as digital televisions (Television, TV), desktop computers, etc.
  • the electronic device shown in FIG. 5 is only an example and should not impose any limitations on the functions and scope of use of the embodiments of the present disclosure.
  • the electronic device 500 may include a processing device (such as a central processing unit, a graphics processor, etc.) 501 , which may process data according to a program stored in a read-only memory (Read-Only Memory, ROM) 502 or from a storage device. 508 loads the program in the random access memory (Random Access Memory, RAM) 503 to perform various appropriate actions and processes. In RAM 503, there is also stored Various programs and data required for the operation of the electronic device 500.
  • the processing device 501, the ROM 502 and the RAM 503 are connected to each other via a bus 504.
  • An input/output (I/O) interface 505 is also connected to bus 504.
  • input devices 506 including, for example, a touch screen, touch pad, keyboard, mouse, camera, microphone, accelerometer, gyroscope, etc.; including, for example, a Liquid Crystal Display (LCD) , an output device 507 such as a speaker, a vibrator, etc.; a storage device 508 including a magnetic tape, a hard disk, etc.; and a communication device 509.
  • Communication device 509 may allow electronic device 500 to communicate wirelessly or wiredly with other devices to exchange data.
  • FIG. 5 illustrates electronic device 500 with various means, it should be understood that implementation or availability of all illustrated means is not required. More or fewer means may alternatively be implemented or provided.
  • embodiments of the present disclosure include a computer program product including a computer program carried on a non-transitory computer-readable medium, the computer program containing program code for performing the method illustrated in the flowchart.
  • the computer program may be downloaded and installed from the network via communication device 509, or from storage device 508, or from ROM 502.
  • the processing device 501 When the computer program is executed by the processing device 501, the above-mentioned functions defined in the method of the embodiment of the present disclosure are performed.
  • the electronic device provided by the embodiments of the present disclosure and the display effect processing method provided by the above embodiments belong to the same inventive concept.
  • Technical details that are not described in detail in this embodiment can be referred to the above embodiments, and this embodiment has the same features as the above embodiments. beneficial effects.
  • Embodiments of the present disclosure provide a computer storage medium on which a computer program is stored.
  • the program is executed by a processor, the display effect processing method provided by the above embodiments is implemented.
  • the computer-readable medium mentioned above in the present disclosure may be a computer-readable signal medium or a computer-readable storage medium, or any combination of the above two.
  • the computer-readable storage medium may be, for example, but is not limited to, an electrical, magnetic, optical, electromagnetic, infrared, or semiconductor system, apparatus or device, or any combination thereof.
  • Examples of computer readable storage media may include, but are not limited to: an electrical connection having one or more wires, a portable computer disk, a hard drive, random access memory (RAM), read only memory (ROM), erasable programmable read only memory Memory (Erasable Programmable Read-Only Memory, EPROM) or flash memory, optical fiber, portable compact disk read-only memory (Compact Disc Read-Only Memory, CD-ROM), optical storage device, magnetic storage device, or any suitable combination of the above.
  • a computer-readable storage medium may be any tangible medium that contains or stores a program for use by or in connection with an instruction execution system, apparatus, or device.
  • a computer-readable signal medium may include a data signal propagated in baseband or as part of a carrier wave, carrying computer-readable program code therein. Such propagated data signals may take many forms, including but not limited to electromagnetic signals, optical signals, or any suitable combination of the above.
  • a computer-readable signal medium may also be any computer-readable medium other than a computer-readable storage medium that can send, propagate, or transmit a program for use by or in connection with an instruction execution system, apparatus, or device .
  • Program code contained on a computer-readable medium can be transmitted using any appropriate medium, including but not limited to: wires, optical cables, radio frequency (Radio Frequency, RF), etc., or any suitable combination of the above.
  • the client and server can communicate using any currently known or future developed network protocol such as HTTP (HyperText Transfer Protocol), and can communicate with digital data in any form or medium.
  • Communications e.g., communications network
  • Examples of communication networks include Local Area Networks (LANs), Wide Area Networks (WANs), the Internet (e.g., the Internet), and end-to-end networks (e.g., ad hoc end-to-end networks), as well as any current network for knowledge or future research and development.
  • LANs Local Area Networks
  • WANs Wide Area Networks
  • the Internet e.g., the Internet
  • end-to-end networks e.g., ad hoc end-to-end networks
  • the above-mentioned computer-readable medium may be included in the above-mentioned electronic device; it may also exist independently without being assembled into the electronic device.
  • the above-mentioned computer-readable medium carries one or more programs.
  • the electronic device executes the above-mentioned one or more programs.
  • the current display effect of the associated element in the interactive interface is adjusted based on the target display effect, so that the target display effect of the associated element is adjusted and displayed according to the editing operation of the target element.
  • the storage medium may be a non-transitory storage medium.
  • Computer program code for performing the operations of the present disclosure may be written in one or more programming languages, including but not limited to object-oriented programming languages—such as Java, Smalltalk, C++, and Includes conventional procedural programming languages—such as "C” or similar programming languages.
  • the program code may execute entirely on the user's computer, partly on the user's computer, as a stand-alone software package, partly on the user's computer and partly on a remote computer or entirely on the remote computer or server.
  • the remote computers can be connected over any kind of network—including a local area network (LAN) or a wide area network.
  • each square box in the flow chart or block diagram can represent a module, a program segment or a part of a code, and the module, the program segment or a part of the code contains one or more executable instructions for realizing the specified logical function.
  • the functions marked in the square box can also occur in a sequence different from that marked in the accompanying drawings. For example, two square boxes represented in succession can actually be executed substantially in parallel, and they can sometimes be executed in the opposite order, depending on the functions involved.
  • each square box in the block diagram and/or flow chart, and the combination of the square boxes in the block diagram and/or flow chart can be implemented with a dedicated hardware-based system that performs a specified function or operation, or can be implemented with a combination of dedicated hardware and computer instructions.
  • the units involved in the embodiments of the present disclosure can be implemented in software or hardware.
  • the name of the unit does not constitute a limitation on the unit itself under certain circumstances.
  • the first acquisition unit can also be described as "the unit that acquires at least two Internet Protocol addresses.”
  • FPGA Field Programmable Gate Array
  • ASIC Application Specific Integrated Circuit
  • ASSP Application Specific Standard Product
  • SOC System on Chip
  • CPLD Complex Programmable Logic Device
  • a machine-readable medium may be a tangible medium that may contain or store a program for use by or in connection with an instruction execution system, apparatus, or device.
  • the machine-readable medium may be a machine-readable signal medium or a machine-readable storage medium.
  • Machine-readable media may include, but are not limited to, electronic, magnetic, optical, electromagnetic, infrared, or semiconductor systems, devices or devices, or any suitable combination of the foregoing.
  • machine-readable storage media examples include one or more wire-based electrical connections, laptop disks, hard drives, random access memory (RAM), read only memory (ROM), erasable programmable read only memory (EPROM) ) or flash memory, optical fiber, portable compact disk read-only memory (CD-ROM), optical storage device, magnetic storage device, or any suitable combination of the foregoing.
  • RAM random access memory
  • ROM read only memory
  • EPROM erasable programmable read only memory
  • flash memory optical fiber
  • CD-ROM portable compact disk read-only memory
  • magnetic storage device or any suitable combination of the foregoing.
  • Example 1 provides a display effect processing method, The method includes:
  • the current display effect of the associated element in the interactive interface is adjusted based on the target display effect, so that the target display effect of the associated element is adjusted and displayed according to the editing operation of the target element.
  • Example 2 provides a display effect processing method
  • the editing operations on the target element include:
  • a resizing operation on the target element is detected
  • Example 3 provides a display effect processing method, which also includes:
  • a target display image is determined according to the target display effect, and the target display image is displayed on the interactive interface.
  • Example 4 provides a display effect processing method, which also includes:
  • the associated element is determined according to the preset constraint logic, wherein there is a constraint relationship between the associated element and the target element, and/or there is a constraint relationship between the associated elements, and the constraint relationship is position and/or or size constraints;
  • the target display effect of the associated element is determined according to the editing target of the target element and the constraint relationship between the associated element and the target element, where the editing target is the target of the editing operation.
  • Example 5 provides a display effect processing method
  • determining the target display effect of the associated elements according to the editing target of the target element and the constraint relationship between the associated elements and the target element includes:
  • the target display effect is obtained by combining the element display effects of each associated element.
  • Example 6 provides a display effect processing method, which also includes:
  • the editing target based on the target element determining the element display effect of each of the associated elements in turn according to the constraint relationship between the associated elements and the constraint relationship between the associated element and the target element, includes:
  • the element display effect of each of the associated elements is determined in sequence based on the editing target of the target element and the element adjustment order.
  • Example 7 provides a display effect processing method, which also includes:
  • the element display effect of the associated element to be adjusted is determined according to the element display effect of the dependent associated element.
  • Example 8 provides a display effect processing method
  • the element display effect is the size of the element, and determining the element display effect of the associated element to be adjusted based on the element display effect of the dependent associated element includes:
  • the size of the associated element to be adjusted is determined according to the associated constraint size and the fixed constraint size.
  • Example 9 provides a display effect processing method
  • the constraint logic is represented by a directed acyclic graph
  • any node in the directed acyclic graph is The target element or the associated element
  • determining an associated element as a benchmark adjustment element based on the constraint relationship between the associated elements and the constraint relationship between the associated element and the target element includes:
  • the in-degree parameter of each node in the directed acyclic graph is determined, and the element corresponding to the node with an in-degree parameter of 0 is used as the reference adjustment element.
  • Example 10 provides a display effect processing method
  • the target element is a text box
  • the associated element is the background of the text box.

Landscapes

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

Abstract

一种展示效果处理方法、装置、电子设备及存储介质，该方法包括：响应于对目标元素的编辑操作，确定所述目标元素对应的至少一个关联元素以及所述至少一个关联元素的目标展示效果(S110)；基于所述目标展示效果调整交互界面中所述至少一个关联元素的当前展示效果，以使所述至少一个关联元素的目标展示效果根据所述目标元素的编辑操作调整展示(S120)。

Description

展示效果处理方法、装置、电子设备及存储介质
本申请要求在2022年09月21日提交中国专利局、申请号为202211153804.6的中国专利申请的优先权，以上申请的全部内容通过引用结合在本申请中。
技术领域
本公开实施例涉及文本编辑技术领域，例如涉及一种展示效果处理方法、装置、电子设备及存储介质。
背景技术
随着网络技术的发展，越来越多的应用程序进入了用户的生活，尤其是一系列可以发布图片或视频的软件，深受用户的喜爱。
为了提高图片/视频发布的丰富性，软件开发商可以研发各种各样的文本编辑模板，用于对图片/视频进行文字编辑，以提高图片/视频的展示效果。然而，目前研发的文本编辑模板应用不够灵活，无法满足不同文本编辑的需求。
发明内容
本公开实施例提供一种展示效果处理方法、装置、电子设备及存储介质。
第一方面，本公开实施例提供了一种展示效果处理方法，该方法包括：
响应于对目标元素的编辑操作，确定所述目标元素对应的至少一个关联元素以及所述至少一个关联元素的目标展示效果；
基于所述目标展示效果调整交互界面中所述至少一个关联元素的当前展示效果，以使所述至少一个关联元素的目标展示效果根据所目标元素的编辑操作调整展示。
第二方面，本公开实施例还提供了一种展示效果处理装置，该装置包括：
展示效果确定模块，设置为响应于对目标元素的编辑操作，确定所述目标元素对应的至少一个关联元素以及所述至少一个关联元素的目标展示效果；
展示效果展示模块，设置为基于所述目标展示效果调整交互界面中所述至少一个关联元素的当前展示效果，以使所述至少一个关联元素的目标展示效果根据所述目标元素的编辑操作调整展示。
第三方面，本公开实施例还提供了一种电子设备，所述电子设备包括：
一个或多个处理器；
存储装置，设置为存储一个或多个程序，
当所述一个或多个程序被所述一个或多个处理器执行，使得所述一个或多个处理器实现如本公开实施例任一所述的展示效果处理方法。
第四方面，本公开实施例还提供了一种包含计算机可执行指令的存储介质，所述计算机可执行指令在由计算机处理器执行时用于执行如本公开实施例任一所述的展示效果处理方法。
附图说明
贯穿附图中，相同或相似的附图标记表示相同或相似的元素。应当理解附图是示意性的，原件和元素不一定按照比例绘制。
图1A为本公开实施例所提供的一种展示效果处理方法的流程示意图；
图1B是本公开实施例提供的一种文本编辑界面示意图；
图1C是本公开实施例提供的又一种文本编辑界面示意图；
图2A为本公开实施例所提供的又一种展示效果处理方法的流程示意图；
图2B为本公开实施例提供的一种通过有向无环图表示元素之间约束关系的示意图；
图2C是本公开实施例提供的一种约束逻辑的类型示意图；
图2D是本公开实施例提供的一种位置约束的确定方式示意图；
图3是本公开实施例提供的一种文本模板展示效果处理方法的流程示意图；
图4为本公开实施例所提供的一种展示效果处理装置的结构框图；
图5为本公开实施例所提供的一种电子设备的结构示意图。
具体实施方式
下面将参照附图描述本公开的实施例。虽然附图中显示了本公开的某些实施例，然而应当理解的是，本公开可以通过各种形式来实现，而且不应该被解释为限于这里阐述的实施例，相反提供这些实施例是为了更加透彻和完整地理解本公开。应当理解的是，本公开的附图及实施例仅用于示例性作用，并非用于限制本公开的保护范围。
应当理解，本公开的方法实施方式中记载的各个步骤可以按照不同的顺序执行，和/或并行执行。此外，方法实施方式可以包括附加的步骤和/或省略执行示出的步骤。本公开的范围在此方面不受限制。
本文使用的术语“包括”及其变形是开放性包括，即“包括但不限于”。术语“基于”是“至少部分地基于”。术语“一个实施例”表示“至少一个实施例”；术语“另一 实施例”表示“至少一个另外的实施例”；术语“一些实施例”表示“至少一些实施例”。其他术语的相关定义将在下文描述中给出。
需要注意，本公开中提及的“第一”、“第二”等概念仅用于对不同的装置、模块或单元进行区分，并非用于限定这些装置、模块或单元所执行的功能的顺序或者相互依存关系。
需要注意，本公开中提及的“一个”、“多个”的修饰是示意性而非限制性的，本领域技术人员应当理解，除非在上下文另有明确指出，否则应该理解为“一个或多个”。
在介绍本实施例之前，可以先对应用场景进行示例性说明。可以将本公开实施例应用在任意需要展示效果的交互界面中，例如可以是应用在视频拍摄过程中，可以对被拍摄用户所对应的图像或视频进行效果展示的情况，如短视频拍摄或编辑场景下。
图1A为本公开实施例所提供的一种展示效果处理方法的流程示意图，本实施例可适用于在互联网所支持的任意编辑场景中，用于调整展示效果的情形，如适用于文本编辑场景中，调整文本展示效果，或用于图像编辑场景中，调整图像展示效果等。该方法可以由展示效果处理装置来执行，该装置可以通过软件和/或硬件的形式实现，该硬件可以是电子设备，如移动终端、个人计算机(Personal Computer，PC)端或服务器等。任意文本编辑的场景通常是由客户端和服务器来配合实现的，本实施例所提供的方法可以由服务端来执行，客户端来执行，或者是客户端和服务端的配合来执行。
如图1A，本实施例的方法包括：
S110、响应于对目标元素的编辑操作，确定目标元素对应的至少一个关联元素以及至少一个关联元素的目标展示效果。
其中，执行本公开实施例提供的展示效果处理方法的装置，可以集成在支持文本编辑功能的应用软件中，且该软件可以安装至电子设备中，例如，电子设备可以是移动终端或者PC端等。应用软件可以是对图像/视频处理的一类软件，其应用软件在此不再一一赘述，只要可以实现图像/视频处理即可。还可以是专门研发的应用程序，来实现添加特效并特效展示的软件中，亦或是集成在相应的页面中，用户可以通过PC端中集成的页面来实现特效添加处理。
在本实施例中，目标元素为用户当前编辑的元素，关联元素可以理解为展示效果与目标元素关联的元素。以图像编辑为例，目标元素可以为当前编辑的图像，关联元素可以为图像的特效、填充、背景等。以文本编辑为例，目标元 素可以为当前编辑的文本或文本框，关联元素可以为文本的背景。其中，文本编辑可以以图像为背景进行文本编辑，或以视频为背景进行文本编辑，也可以直接无背景进行文本编辑，在此不做限制；文本编辑的背景可以通过实时处理的方式得到，也可以通过从存储的图像或视频中进行调取的方式得到，同时，背景图像既可以是静态图像，也可以是动态图像，本公开实施例对此并未限定。
例如，可以预先根据元素之间的关联关系设置元素之间的关联关系，通过预先设置的关联关系确定目标元素对应的关联元素，并根据目标元素的调整确定关联元素的目标展示效果，使得元素展示效果更加灵活。
在本公开的一种实施方式中，对目标元素的编辑操作包括：检测到目标元素的大小调整操作；或检测到目标元素的元素内容的编辑操作。以文本编辑为例，目标元素可以为文本内容或文本框，当检测到文本内容的字体大小或文本框的大小调整时，可以判定检测到目标元素的大小调整操作；当检测到文本内容的编辑操作时，如增加文本内容、删除文本内容等，可以判定检测到目标元素的元素内容的编辑操作。以图片编辑为例，目标元素可以为图片，当检测到图片的大小调整时，可以判定检测到目标元素的大小调整操作；当检测到图片的编辑操作时，如增加图片、删除图片等，可以判定检测到目标元素的元素内容的编辑操作。当检测到上述任一操作时，可以判定检测到了对目标元素的编辑操作。
示例性的，当用户使用文本编辑目标对文本进行编辑时，将文本编辑模板中当前编辑的文本内容或关联文本框作为目标元素，将文本编辑模板中的背景元素作为关联元素，通过文本内容或文本框的编辑确定背景元素的目标展示效果，使得背景能够随文本变化，简化了文本编辑模板的使用复杂度，提高了文本编辑模板进行文本编辑的效率。
在文本编辑场景中，背景元素可以包含多种类型(如标亮图案的背景或填充图案的背景等)，在背景元素的展示效果调整过程中，调整变化的展示效果可以和调整之前的展示效果保持一致。
S120、基于目标展示效果调整交互界面中至少一个关联元素的当前展示效果，以使至少一个关联元素的目标展示效果根据目标元素的编辑操作调整展示。
确定目标展示效果后，在交互界面上将当前展示效果调整为目标展示效果，使得关联元素展示效果随目标元素的调整而改变。
以文本编辑为例，当文本内容增加时，文本内容的覆盖区域可能超过文本编辑之前文本内容的覆盖区域，若调整之前背景的覆盖区域和文本内容的覆盖 区域相同，则文本内容增加后，文本内容的覆盖区域会超过背景的覆盖区域，导致展示的部分文本内容没有对应的背景。为了提高展示效果，可以随文本内容的增加，调整背景的覆盖区域使其能够和文本内容的覆盖区域对应。
在本公开的一种实施方式中，基于目标展示效果调整交互界面中关联元素的当前展示效果，包括：根据所述目标展示效果确定目标展示图像，在所述交互界面上展示所述定目标展示图像。
例如，可以直接渲染出目标展示效果对应的目标展示图像，在交互界面上直接将当前展示效果调整为目标展示图像。为了进一步确定效果变化的过程，提高效果变化的展示效果，还可以确定当前展示效果和目标展示效果之间的多个中间展示效果作为多个展示效果变化帧，并在交互界面上顺次展示多个展示效果变化帧，将交互界面中的当前展示效果通过顺次展示的多个展示效果变化帧调整为目标展示效果。
其中，确定当前展示效果和目标展示效果之间的多个中间展示效果作为多个展示效果变化帧，可以为：通过当前展示效果和目标展示效果中各像素点的像素值之差确定至少一个中间展示效果中像素点的像素值，基于像素点的像素值确定对应的展示效果变化帧。
图1B是本公开实施例提供的一种文本编辑界面示意图。图1B中示意性的示出了一种文本编辑模板的示意图，文本编辑模板包括文本框与背景，图1B中文本框的覆盖区域和背景的覆盖区域相匹配。图1C是本公开实施例提供的又一种文本编辑界面示意图。图1C中文本框内容相较于图1B中增加了“对的”导致文本框长度边长，覆盖区域变大，为了避免图1B中文本增加时文本框覆盖区域大于背景覆盖区域导致的文字展示效果差，本实施例在图1C中将背景的覆盖区域随文本框编辑后的覆盖区域进行适应性调整，使得文本内容增多后背景的覆盖区域仍与文本内容的覆盖区域相匹配，使得背景的展示效果能够随文本框的编辑而变化，提高了文本编辑模板的应用灵活性。
本公开实施例，通过响应于对目标元素的编辑操作，确定目标元素对应的至少一个关联元素以及关联元素的目标展示效果；基于目标展示效果调整交互界面中关联元素的当前展示效果，以使关联元素和目标元素的展示效果关联调整展示，使得目标元素编辑调整时，能够适应性调整关联元素的展示效果，实现随模板元素的编辑适应性调整其他元素的展示效果，提高了编辑应用的灵活性。
图2A为本公开实施例所提供的又一种展示效果处理方法的流程示意图，在 前述实施例的基础上，对目标展示效果的确定进行了进一步调整。其中，与上述实施例相同或者相应的技术术语在此不再赘述。
如图2A所示，该方法包括如下步骤：
S210、响应于对目标元素的编辑操作，根据预先设置的约束逻辑，确定关联元素。
在本实施例中，预先根据元素之间的依赖关系构建约束逻辑，在检测到对目标元素的编辑操作后，根据预先构建的约束逻辑确定与目标元素相关的关联元素。
需要说明的是，关联元素的个数可以为一个或多个，关联元素为与目标元素存在直接约束关系或间接约束关系的元素。其中，直接约束关系可以理解为关联元素直接依赖于目标元素，间接约束关系可以理解为关联元素通过一个或多个其他关联元素依赖于目标元素。也就是说，其中，关联元素与目标元素存在约束关系，和/或，关联元素之间存在约束关系。示例性的，假设目标元素为元素A，元素B依赖元素A，元素C依赖元素B，则元素B和元素A为直接约束关系，元素C和元素A为间接约束关系。其中，约束关系可以为位置和/或尺寸的约束关系，仍以元素B依赖元素A为例，元素B和元素A可以为位置约束关系、尺寸约束关系、或位置和尺寸约束关系。假设元素B和元素A为位置约束关系，则表示元素B的位置随元素A位置的变化而变化；假设元素B和元素A为尺寸约束关系，则表示元素B的尺寸随元素A尺寸的变化而变化；假设元素B和元素A为位置和尺寸约束关系，则表示元素B的位置和尺寸随元素A位置和尺寸的变化而变化。
一个实施方式中，可以先确定与目标元素存在直接约束关系的元素作为关联元素，然后以关联元素为基准，确定与关联元素存在直接约束关系的元素也作为关联元素，迭代执行上述操作，直到没有元素与关联元素存在直接约束关系，将上述确定的关联元素作为目标元素对应的关联元素。
例如，约束逻辑可以通过有向无环图表示。在图论中，如果一个有向图无法从某个顶点出发经过若干条边回到该点，则这个图是一个有向无环图。图2B为本公开实施例提供的一种通过有向无环图表示元素之间约束关系的示意图。有向无环图中，箭头方向表示依赖关系，假设箭头由节点1指向节点2，则节点1依赖于节点2。如图2B所示，元素B和元素C均依赖于元素A，即分别与元素A存在直接约束关系，元素C还依赖于元素B，即元素C和元素B之间存在直接约束关系，元素D依赖于元素B，即元素D和元素B之间存在直接约束关 系，元素D和元素A之间存在间接约束关系，元素E不依赖于任何元素。假设元素A为目标元素，则元素B、元素C和元素D为关联元素。
S220、根据目标元素的编辑目标以及关联元素和目标元素之间的约束关系确定关联元素的目标展示效果。
确定关联元素后，针对每一个关联元素，根据该关联元素相关的约束关系，基于目标元素的编辑目标确定该关联元素的目标展示效果。其中，编辑目标为编辑操作的目标。示例性的，假设编辑操作为调整目标元素的大小，则编辑目标为目标元素调整后的大小；假设编辑操作为编辑目标元素的元素内容，则编辑目标为编辑后的元素内容。
一种实施方式中，可以针对每个关联元素，根据关联元素和目标元素之间的约束关系，确定关联元素和目标元素之间的展示约束关系，基于目标元素的编辑目标和上述展示约束关系确定该关联元素的目标展示效果。示例性的，假设目标元素为元素A，关联元素为元素B和元素C，且元素C依赖于元素B，元素B依赖于元素A，则可以根据元素B和元素A之间的约束关系，以及元素C和元素B之间的约束关系确定元素C和元素A之间的展示约束关系，根据元素B和元素A之间的约束关系确定元素B和元素A之间的展示约束关系。然后根据元素C和元素A之间的展示约束关系和元素A的编辑目标确定元素C的元素展示效果，根据元素B和元素A之间的展示约束关系和元素A的编辑目标确定元素B的元素展示效果，最终根据各元素展示效果确定目标展示效果。直接确定关联元素和目标元素之间的展示约束关系能够使得每个关联元素的元素展示效果不受其他关联元素的元素展示效果的影响，可以实现每个关联元素的目标展示效果的并行处理，提高关联元素的目标展示效果的效率及准确性。
另一种实施方式中，还可以根据关联元素之间的约束关系依次确定每个关联元素的目标展示效果。基于此，关联元素为多个，根据目标元素的编辑目标以及关联元素和目标元素之间的约束关系确定关联元素的目标展示效果，包括：基于目标元素的编辑目标，根据关联元素之间的约束关系和关联元素和目标元素之间的约束关系依次确定每个关联元素的元素展示效果；将各关联元素的元素展示效果组合得到目标展示效果。也就是说，可以根据元素之间的约束关系确定展示效果的确定顺序，基于展示效果的确定顺序依次确定每个关联元素的元素展示效果。例如，可以以与目标元素存在直接约束关系的关联元素开始，根据约束关系依次确定每个关联元素的元素展示效果，最终确定目标展示效果。
例如，基于目标元素的编辑目标，根据关联元素之间的约束关系和关联元 素和目标元素之间的约束关系依次确定每个关联元素的元素展示效果，包括：根据关联元素之间的约束关系和关联元素和目标元素之间的约束关系确定一关联元素作为基准调整元素；根据关联元素之间的约束关系确定元素调整顺序；以基准调整元素为基准，基于目标元素的编辑目标和元素调整顺序依次确定每个关联元素的元素展示效果。例如，可以将直接依赖于目标元素的关联元素作为基准调整元素，也可以将不存在依赖的关联元素作为基准调整元素，根据元素之间的约束关系确定元素调整顺序，依次确定每个关联元素的元素展示效果。假设目标元素为元素A，关联元素为元素B、元素C和元素D，且元素D依赖于元素C，元素C依赖于元素B，元素B依赖于元素A。则可以将元素D或元素B作为基准调整元素，当元素D为基准调整元素时，可以将元素D、元素C和元素B的顺序作为元素调整顺序；当元素B为基准调整元素时，可以将元素B、元素C和元素D的顺序作为元素调整顺序。基于元素之间的依赖关系依次确定每个元素的元素展示效果相对于单独确定每个元素的展示效果，简化了关系确定操作。
一个实现方式中，约束逻辑通过有向无环图表示，有向无环图中的任一节点为目标元素或关联元素，根据关联元素之间的约束关系和关联元素和目标元素之间的约束关系确定一关联元素作为基准调整元素，包括：确定有向无环图中各节点的入度参数，将入度参数为0的节点对应的元素作为基准调整元素。有向无环图中，以节点为头的边的数目称为该顶点的入度，以节点为尾的边的数目称为该顶点的出度，当节点的入度为0时，说明没有节点依赖于该节点，为了减少调整次数，避免多次对同一个关联元素进行调整，可以以该节点对应的元素作为基准调整元素。基于此，在确定关联元素的元素展示效果的过程中，可以将节点划分为未调整和调整后两组，然后基于节点的入度对节点进行排序，将入度和出度为0的节点划分为调整后的组，在其他节点调整后调整出度值并将其划分至调整后的组，直到不存在出度为0的节点，停止遍历。
在上述实施例的基础上，以基准调整元素为基准，基于元素调整顺序依次确定每个关联元素的元素展示效果，包括：针对任一待调整关联元素，根据约束逻辑确定待调整关联元素的依赖关联元素；根据依赖关联元素的元素展示效果确定待调整关联元素的元素展示效果。可以将当前顺序遍历到的关联元素作为待调整关联元素，假设关联元素之间的约束关系如图2B所示，待调整关联元素为元素C，根据图2B可知，元素C分别依赖于元素A和元素B，则将元素A和元素B作为依赖关联元素，根据元素A和元素B的元素展示效果确定元素C 的元素展示效果。
一个实现方式中，元素展示效果为元素的尺寸，根据依赖关联元素的元素展示效果确定待调整关联元素的元素展示效果，包括：根据依赖关联元素的元素尺寸确定关联约束尺寸；确定依赖关联元素和待调整关联元素之间的固定约束尺寸；根据关联约束尺寸和固定约束尺寸确定待调整关联元素的尺寸。以文本编辑为例，为了使文本编辑时，文本的背景能够与文本内容对应，需要调整背景的尺寸使其与文本内容的尺寸对应。基于此，通过调整背景尺寸实现背景的展示效果。为了使得调整后的元素之间的位置关系和尺寸关系与调整前对应，可以通过固定约束和浮动约束结合的方式确定待调整元素的尺寸。以元素B为待调整关联元素，元素A为依赖关联元素为例，可以预先设定元素B和元素A之间的固定约束尺寸(如中心位置距离，某个对应边之间的距离等)，在元素A尺寸调整后，再根据元素A调整后的尺寸确定元素A的关联约束尺寸，基于关联约束尺寸和固定约束尺寸确定元素B的尺寸。
需要说明的是，固定约束尺寸和关联约束尺寸的确定方式与元素之间的约束逻辑类型关联。图2C是本公开实施例提供的一种约束逻辑的类型示意图。图2C中以文本编辑为例，对元素之间的约束逻辑类型进行了示意性说明。图2C中，文本模板中的元素A和元素B可以为不同类型的约束逻辑，如位置约束关系、横向缩放约束关系、纵向缩放约束关系、四周缩放约束关系等。其中，位置约束关系可以为元素B随元素A的位置变化(移动)而变化，横向缩放约束关系可以为元素B的横向尺寸随元素A的横向尺寸的变化而变化，纵向缩放约束关系可以为元素B的纵向尺寸随元素A的纵向尺寸的变化而变化，四周缩放约束关系可以为元素B的整体尺寸随元素A的整体尺寸的变化而变化。
在确定待调整关联元素的尺寸时，可以基于不同的约束逻辑从水平方向和/或竖直方向确定待调整关联元素的尺寸，每个方向的尺寸均可以通过上述方式确定。如假设元素间的约束为位置关系约束，可以基于依赖关联元素的位置坐标(如中心点坐标)方向确定待调整关联元素的坐标；假设元素间的约束为横向缩放约束，可以基于依赖关联元素的水平方向尺寸确定待调整关联元素的水平方向尺寸；假设元素间的约束为纵向缩放约束，可以基于依赖关联元素的竖直方向尺寸确定待调整关联元素的竖直方向尺寸；假设元素间的约束为四周缩放约束，可以基于依赖关联元素的水平方向尺寸确定待调整关联元素的水平方向尺寸，基于依赖关联元素的竖直方向尺寸确定待调整关联元素的竖直方向尺寸。
以位置约束为例，对关联元素的尺寸更新进行示例性说明。图2D是本公开实施例提供的一种位置约束的确定方式示意图。图2D中左侧为依赖关联元素，右侧为待调整关联元素。
图2D中，UI表示用户界面(User interface，UI)。
如图2D所示，可以通过X＝Y*Z+M确定待调整关联元素的位置，其中,M为待调整关联元素和依赖关联元素的固定约束尺寸，表示待调整关联元素左侧边和依赖关联元素右侧边之间的固定距离，Y为依赖关联元素调整后的比例，Z为依赖关联元素的宽度。
需要说明的是，当待调整关联元素存在多个对应的依赖关联元素时，可以直接基于多个依赖关联元素确定待调整关联元素的元素展示效果，也可以分别基于每个依赖元素关系确定待调整关联元素的元素展示效果。
S230、基于目标展示效果调整交互界面中关联元素的当前展示效果，以使关联元素的目标展示效果根据目标元素的编辑操作调整展示。
本实施例，通过根据预先设置的约束逻辑，确定关联元素，根据目标元素的编辑目标以及关联元素和目标元素之间的约束关系确定关联元素的目标展示效果，使得关联元素的目标展示效果的确定更加准确，进而使得关联元素与目标元素的关联展示效果更佳。
图3是本公开实施例提供的一种文本模板展示效果处理方法的流程示意图。图3中以文本编辑场景中文本为目标元素为例，对文本展示效果的调整提供了一种优选示例。
本示例中，预先根据元素之间的关系构建依赖关系，可以通过有向无环图的方式展示。在每个元素对应存储其依赖对象的信息，以便于依赖对象发生变化时，自身能够随之一起发生改变。
如图3所示，在文本编辑时，通过遍历当前文本模板的元素，判断当前遍历到的元素是否有依赖对象，并在存在依赖对象时，将依赖对象作为新的遍历元素进行判断，直到遍历元素不存在依赖对象，根据文本编辑目标更新当前遍历到的元素的元素属性，再进一步更新该元素被依赖对象的元素属性，直到元素遍历更新完成，完成对所有关联元素的属性的更新。
在元素属性的更新时，如上述实施例，可以通过水平和/竖直方向实现。
示例性的，水平方向更新元素属性可以为：(1)对约束节点建立依赖图，分成两组：未约束，约束后。固定大小的控件需要对左右建立大小的特殊约束,大小约束只计入度不计出度。(2)对节点入度排序，取出所有入度和出度为0 的节点(独立节点)，放入约束后的组；遍历出度为0节点依赖，放入约束后的组，并对target节点出度-1；循环到未约束的组为空。如果找不到出度为0的节点，说明存在依赖环，停止遍历。
竖直方向更新元素属性可以同水平方向更新元素属性。另外，如果有保持高宽比的元素，竖直方向更新属性后可能会破坏水平方向的依赖，需要重新计算一次。
本实施例提供的文本模板展示效果处理方法可以由文本模板编辑系统实现。将不同元素间的约束逻辑化替代原本文字模板中使用渲染引擎Entity Component System(ECS)架构方式实现文本模板编辑系统的框架逻辑，能够更灵活的实现元素与元素间的逻辑设计。设计方案的整体框架可以包括业务接口调用层、软件开发工具包(Software Development Kit，SDK)脚本层(场景业务逻辑层)和SDK基础功能架构层。其中，SDK基础功能架构层又包括JS脚本框架层和SDK渲染引擎。JS脚本层可以实现每个基础元素的创建、删除、元素的动态扩展的框架等，SDK脚本层可以设置所有的业务逻辑，如元素的约束更新、位置变化等。需要说明的是，约束逻辑和元素的创建属性更新等框架逻辑全部使用脚本方案实现，对于用户想拓展更多的设计模板功能，可以直接通过更改脚本，通过后台动态下发带有新功能的脚本到客户端，达到热更新的目的。
本实施例通过建立不同元素间能够对应的约束关系，在检测到当前元素发生改变时，依赖当前元素的其他元素跟随改变，如当文字不断输入时，文本后面的背景贴图会随着文本一起改变，能够更好地满足用户对于文字模板的多样化设计需求，使得文本模板的应用更加灵活。
图4为本公开实施例所提供的一种展示效果处理装置的结构框图，可执行本公开任意实施例所提供的展示效果处理方法，具备执行方法相应的功能模块和有益效果。如图4所示，该装置包括：展示效果确定模块410以及展示效果展示模块420。
展示效果确定模块410，设置为响应于对目标元素的编辑操作，确定目标元素对应的至少一个关联元素以及关联元素的目标展示效果；
展示效果展示模块420，设置为基于目标展示效果调整交互界面中关联元素的当前展示效果，以使关联元素的目标展示效果根据所述目标元素的编辑操作调整展示。
在上述各实施例的基础上，对目标元素的编辑操作包括：检测到目标元素的大小调整操作；或检测到目标元素的元素内容的编辑操作。
在上述各实施例的基础上，基于目标展示效果调整交互界面中关联元素的当前展示效果，包括：
根据所述目标展示效果确定目标展示图像，在所述交互界面上展示所述定目标展示图像。
在上述各实施例的基础上，确定目标元素对应的至少一个关联元素以及关联元素的目标展示效果，包括：
根据预先设置的约束逻辑，确定关联元素，其中，关联元素与目标元素存在约束关系，和/或，关联元素之间存在约束关系，所述约束关系为位置和/或尺寸的约束关系；
根据目标元素的编辑目标以及关联元素和目标元素之间的约束关系确定关联元素的目标展示效果，其中，所述编辑目标为所述编辑操作的目标。
在上述各实施例的基础上，关联元素为多个，根据目标元素的编辑目标以及关联元素和目标元素之间的约束关系确定关联元素的目标展示效果，包括：
基于目标元素的编辑目标，根据关联元素之间的约束关系和关联元素和目标元素之间的约束关系依次确定每个关联元素的元素展示效果；
将各关联元素的元素展示效果组合得到目标展示效果。
在上述各实施例的基础上，基于目标元素的编辑目标，根据关联元素之间的约束关系和关联元素和目标元素之间的约束关系依次确定每个关联元素的元素展示效果，包括：
根据关联元素之间的约束关系和关联元素和目标元素之间的约束关系确定一关联元素作为基准调整元素；
根据关联元素之间的约束关系确定元素调整顺序；
以基准调整元素为基准，基于目标元素的编辑目标和元素调整顺序依次确定每个关联元素的元素展示效果。
在上述各实施例的基础上，以基准调整元素为基准，基于元素调整顺序依次确定每个关联元素的元素展示效果，包括：
针对任一待调整关联元素，根据约束逻辑确定待调整关联元素的依赖关联元素；
根据依赖关联元素的元素展示效果确定待调整关联元素的元素展示效果。
在上述各实施例的基础上，元素展示效果为元素的尺寸，根据依赖关联元素的元素展示效果确定待调整关联元素的元素展示效果，包括：
根据依赖关联元素的元素尺寸确定关联约束尺寸；
确定依赖关联元素和待调整关联元素之间的固定约束尺寸；
根据关联约束尺寸和固定约束尺寸确定待调整关联元素的尺寸。
在上述各实施例的基础上，约束逻辑通过有向无环图表示，有向无环图中的任一节点为目标元素或关联元素，根据关联元素之间的约束关系和关联元素和目标元素之间的约束关系确定一关联元素作为基准调整元素，包括：
确定有向无环图中各节点的入度参数，将入度参数为0的节点对应的元素作为基准调整元素。
在上述各实施例的基础上，目标元素为文本框，关联元素为文本框的背景。
本实施例，通过响应于对目标元素的编辑操作，确定目标元素对应的至少一个关联元素以及关联元素的目标展示效果；基于目标展示效果调整交互界面中关联元素的当前展示效果，以使关联元素的目标展示效果根据所述目标元素的编辑操作调整展示，使得目标元素编辑调整时，能够适应性调整关联元素的展示效果，实现随文本编辑适应性调整其展示效果，提高了文本编辑模板的应用灵活性。
本公开实施例所提供的展示效果处理装置可执行本公开任意实施例所提供的展示效果处理方法，具备执行方法相应的功能模块和有益效果。
值得注意的是，上述装置所包括的各个单元和模块只是按照功能逻辑进行划分的，但并不局限于上述的划分，只要能够实现相应的功能即可；另外，各功能单元的名称也只是为了便于相互区分，并不用于限制本公开实施例的保护范围。
图5为本公开实施例所提供的一种电子设备的结构示意图。下面参考图5，其示出了适于用来实现本公开实施例的电子设备(例如图5中的终端设备或服务器)500的结构示意图。本公开实施例中的终端设备可以包括但不限于诸如移动电话、笔记本电脑、数字广播接收器、个人数字助理(Personal Digital Assistant，PDA)、平板电脑(PAD)、便携式多媒体播放器(Portable Media Player，PMP)、车载终端(例如车载导航终端)等等的移动终端以及诸如数字电视(Television，TV)、台式计算机等等的固定终端。图5示出的电子设备仅仅是一个示例，不应对本公开实施例的功能和使用范围带来任何限制。
如图5所示，电子设备500可以包括处理装置(例如中央处理器、图形处理器等)501，其可以根据存储在只读存储器(Read-Only Memory，ROM)502中的程序或者从存储装置508加载到随机访问存储器(Random Access Memory，RAM)503中的程序而执行各种适当的动作和处理。在RAM 503中，还存储有 电子设备500操作所需的各种程序和数据。处理装置501、ROM 502以及RAM 503通过总线504彼此相连。输入/输出(Input/Output，I/O)接口505也连接至总线504。
通常，以下装置可以连接至I/O接口505：包括例如触摸屏、触摸板、键盘、鼠标、摄像头、麦克风、加速度计、陀螺仪等的输入装置506；包括例如液晶显示器(Liquid Crystal Display，LCD)、扬声器、振动器等的输出装置507；包括例如磁带、硬盘等的存储装置508；以及通信装置509。通信装置509可以允许电子设备500与其他设备进行无线或有线通信以交换数据。虽然图5示出了具有各种装置的电子设备500，但是应理解的是，并不要求实施或具备所有示出的装置。可以替代地实施或具备更多或更少的装置。
特别地，根据本公开的实施例，上文参考流程图描述的过程可以被实现为计算机软件程序。例如，本公开的实施例包括一种计算机程序产品，其包括承载在非暂态计算机可读介质上的计算机程序，该计算机程序包含用于执行流程图所示的方法的程序代码。在这样的实施例中，该计算机程序可以通过通信装置509从网络上被下载和安装，或者从存储装置508被安装，或者从ROM 502被安装。在该计算机程序被处理装置501执行时，执行本公开实施例的方法中限定的上述功能。
本公开实施方式中的多个装置之间所交互的消息或者信息的名称仅用于说明性的目的，而并不是用于对这些消息或信息的范围进行限制。
本公开实施例提供的电子设备与上述实施例提供的展示效果处理方法属于同一发明构思，未在本实施例中详尽描述的技术细节可参见上述实施例，并且本实施例与上述实施例具有相同的有益效果。
本公开实施例提供了一种计算机存储介质，其上存储有计算机程序，该程序被处理器执行时实现上述实施例所提供的展示效果处理方法。
需要说明的是，本公开上述的计算机可读介质可以是计算机可读信号介质或者计算机可读存储介质或者是上述两者的任意组合。计算机可读存储介质例如可以是——但不限于——电、磁、光、电磁、红外线、或半导体的系统、装置或器件，或者任意以上的组合。计算机可读存储介质的例子可以包括但不限于：具有一个或多个导线的电连接、便携式计算机磁盘、硬盘、随机访问存储器(RAM)、只读存储器(ROM)、可擦式可编程只读存储器(Erasable Programmable Read-Only Memory，EPROM)或闪存、光纤、便携式紧凑磁盘只读存储器(Compact Disc Read-Only Memory，CD-ROM)、光存储器件、磁存储 器件、或者上述的任意合适的组合。在本公开中，计算机可读存储介质可以是任何包含或存储程序的有形介质，该程序可以被指令执行系统、装置或者器件使用或者与其结合使用。而在本公开中，计算机可读信号介质可以包括在基带中或者作为载波一部分传播的数据信号，其中承载了计算机可读的程序代码。这种传播的数据信号可以采用多种形式，包括但不限于电磁信号、光信号或上述的任意合适的组合。计算机可读信号介质还可以是计算机可读存储介质以外的任何计算机可读介质，该计算机可读信号介质可以发送、传播或者传输用于由指令执行系统、装置或者器件使用或者与其结合使用的程序。计算机可读介质上包含的程序代码可以用任何适当的介质传输，包括但不限于：电线、光缆、射频(Radio Frequency，RF)等等，或者上述的任意合适的组合。
在一些实施方式中，客户端、服务器可以利用诸如HTTP(HyperText Transfer Protocol，超文本传输协议)之类的任何当前已知或未来研发的网络协议进行通信，并且可以与任意形式或介质的数字数据通信(例如，通信网络)互连。通信网络的示例包括局域网(Local Area Network，LAN)，广域网(Wide Area Network，WAN)，网际网(例如，互联网)以及端对端网络(例如，ad hoc端对端网络)，以及任何当前已知或未来研发的网络。
上述计算机可读介质可以是上述电子设备中所包含的；也可以是单独存在，而未装配入该电子设备中。
上述计算机可读介质承载有一个或者多个程序，当上述一个或者多个程序被该电子设备执行时，使得该电子设备：
响应于对目标元素的编辑操作，确定所述目标元素对应的至少一个关联元素以及所述关联元素的目标展示效果；
基于所述目标展示效果调整交互界面中所述关联元素的当前展示效果，以使所述关联元素的目标展示效果根据所述目标元素的编辑操作调整展示。
存储介质可以是非暂态(non-transitory)存储介质。
可以以一种或多种程序设计语言或其组合来编写用于执行本公开的操作的计算机程序代码，上述程序设计语言包括但不限于面向对象的程序设计语言—诸如Java、Smalltalk、C++，还包括常规的过程式程序设计语言—诸如“C”语言或类似的程序设计语言。程序代码可以完全地在用户计算机上执行、部分地在用户计算机上执行、作为一个独立的软件包执行、部分在用户计算机上部分在远程计算机上执行、或者完全在远程计算机或服务器上执行。在涉及远程计算机的情形中，远程计算机可以通过任意种类的网络——包括局域网(LAN)或广域 网(WAN)—连接到用户计算机，或者，可以连接到外部计算机(例如利用因特网服务提供商来通过因特网连接)。
附图中的流程图和框图，图示了按照本公开各种实施例的系统、方法和计算机程序产品的可能实现的体系架构、功能和操作。在这点上，流程图或框图中的每个方框可以代表一个模块、程序段、或代码的一部分，该模块、程序段、或代码的一部分包含一个或多个用于实现规定的逻辑功能的可执行指令。也应当注意，在有些作为替换的实现中，方框中所标注的功能也可以以不同于附图中所标注的顺序发生。例如，两个接连地表示的方框实际上可以基本并行地执行，它们有时也可以按相反的顺序执行，这依所涉及的功能而定。也要注意的是，框图和/或流程图中的每个方框、以及框图和/或流程图中的方框的组合，可以用执行规定的功能或操作的专用的基于硬件的系统来实现，或者可以用专用硬件与计算机指令的组合来实现。
描述于本公开实施例中所涉及到的单元可以通过软件的方式实现，也可以通过硬件的方式来实现。其中，单元的名称在某种情况下并不构成对该单元本身的限定，例如，第一获取单元还可以被描述为“获取至少两个网际协议地址的单元”。
本文中以上描述的功能可以至少部分地由一个或多个硬件逻辑部件来执行。例如，非限制性地，可以使用的示范类型的硬件逻辑部件包括：现场可编程门阵列(Field Programmable Gate Array，FPGA)、专用集成电路(Application Specific Integrated Circuit，ASIC)、专用标准产品(Application Specific Standard Product，ASSP)、片上系统(System on Chip，SOC)、复杂可编程逻辑设备(Complex Programmable Logic Device，CPLD)等等。
在本公开的上下文中，机器可读介质可以是有形的介质，其可以包含或存储以供指令执行系统、装置或设备使用或与指令执行系统、装置或设备结合地使用的程序。机器可读介质可以是机器可读信号介质或机器可读储存介质。机器可读介质可以包括但不限于电子的、磁性的、光学的、电磁的、红外的、或半导体系统、装置或设备，或者上述内容的任何合适组合。机器可读存储介质的示例会包括基于一个或多个线的电气连接、便携式计算机盘、硬盘、随机存取存储器(RAM)、只读存储器(ROM)、可擦除可编程只读存储器(EPROM)或快闪存储器、光纤、便捷式紧凑盘只读存储器(CD-ROM)、光学储存设备、磁储存设备、或上述内容的任何合适组合。
根据本公开的一个或多个实施例，【示例一】提供了一种展示效果处理方法， 该方法包括：
响应于对目标元素的编辑操作，确定所述目标元素对应的至少一个关联元素以及所述关联元素的目标展示效果；
基于所述目标展示效果调整交互界面中所述关联元素的当前展示效果，以使所述关联元素的目标展示效果根据所述目标元素的编辑操作调整展示。
根据本公开的一个或多个实施例，【示例二】提供了一种展示效果处理方法，
所述对目标元素的编辑操作包括：
检测到所述目标元素的大小调整操作；或
检测到所述目标元素的元素内容的编辑操作。
根据本公开的一个或多个实施例，【示例三】提供了一种展示效果处理方法，还包括：
所述基于所述目标展示效果调整交互界面中所述关联元素的当前展示效果，包括：
根据所述目标展示效果确定目标展示图像，在所述交互界面上展示所述定目标展示图像。
根据本公开的一个或多个实施例，【示例四】提供了一种展示效果处理方法，还包括：
所述确定所述目标元素对应的至少一个关联元素以及所述关联元素的目标展示效果，包括：
根据预先设置的约束逻辑，确定所述关联元素，其中，所述关联元素与所述目标元素存在约束关系，和/或，所述关联元素之间存在约束关系，所述约束关系为位置和/或尺寸的约束关系；
根据所述目标元素的编辑目标以及所述关联元素和所述目标元素之间的约束关系确定所述关联元素的目标展示效果，其中，所述编辑目标为所述编辑操作的目标。
根据本公开的一个或多个实施例，【示例五】提供了一种展示效果处理方法，
所述关联元素为多个，所述根据所述目标元素的编辑目标以及所述关联元素和所述目标元素之间的约束关系确定所述关联元素的目标展示效果，包括：
基于所述目标元素的编辑目标，根据所述关联元素之间的约束关系和所述关联元素和所述目标元素之间的约束关系依次确定每个所述关联元素的元素展示效果；
将各所述关联元素的元素展示效果组合得到所述目标展示效果。
根据本公开的一个或多个实施例，【示例六】提供了一种展示效果处理方法，还包括：
所述基于所述目标元素的编辑目标，根据所述关联元素之间的约束关系和所述关联元素和所述目标元素之间的约束关系依次确定每个所述关联元素的元素展示效果，包括：
根据所述关联元素之间的约束关系和所述关联元素和所述目标元素之间的约束关系确定一关联元素作为基准调整元素；
根据所述关联元素之间的约束关系确定元素调整顺序；
以所述基准调整元素为基准，基于所述目标元素的编辑目标和所述元素调整顺序依次确定每个所述关联元素的元素展示效果。
根据本公开的一个或多个实施例，【示例七】提供了一种展示效果处理方法，还包括：
所述以所述基准调整元素为基准，基于所述元素调整顺序依次确定每个所述关联元素的元素展示效果，包括：
针对任一所述待调整关联元素，根据所述约束逻辑确定所述待调整关联元素的依赖关联元素；
根据所述依赖关联元素的元素展示效果确定所述待调整关联元素的元素展示效果。
根据本公开的一个或多个实施例，【示例八】提供了一种展示效果处理方法，
所述元素展示效果为所述元素的尺寸，所述根据所述依赖关联元素的元素展示效果确定所述待调整关联元素的元素展示效果，包括：
根据所述依赖关联元素的元素尺寸确定关联约束尺寸；
确定所述依赖关联元素和所述待调整关联元素之间的固定约束尺寸；
根据所述关联约束尺寸和所述固定约束尺寸确定所述待调整关联元素的尺寸。
根据本公开的一个或多个实施例，【示例九】提供了一种展示效果处理方法，所述约束逻辑通过有向无环图表示，所述有向无环图中的任一节点为所述目标元素或所述关联元素，所述根据所述关联元素之间的约束关系和所述关联元素和所述目标元素之间的约束关系确定一关联元素作为基准调整元素，包括：
确定所述有向无环图中各所述节点的入度参数，将入度参数为0的节点对应的元素作为所述基准调整元素。
根据本公开的一个或多个实施例，【示例十】提供了一种展示效果处理方法， 所述目标元素为文本框，所述关联元素为所述文本框的背景。
本领域技术人员应当理解，本公开中所涉及的公开范围，并不限于上述技术特征的特定组合而成的实施例，同时也应涵盖在不脱离上述公开构思的情况下，由上述技术特征或其等同特征进行任意组合而形成的其它实施例。例如上述特征与本公开中公开的(但不限于)具有类似功能的技术特征进行互相替换而形成的实施例。
此外，虽然采用特定次序描绘了各操作，但是这不应当理解为要求这些操作以所示出的特定次序或以顺序次序执行来执行。在一定环境下，多任务和并行处理可能是有利的。同样地，虽然在上面论述中包含了若干具体实现细节，但是这些不应当被解释为对本公开的范围的限制。在单独的实施例的上下文中描述的某些特征还可以组合地实现在单个实施例中。相反地，在单个实施例的上下文中描述的各种特征也可以单独地或以任何合适的子组合的方式实现在多个实施例中。
尽管已经采用特定于结构特征和/或方法逻辑动作的语言描述了本主题，但是应当理解所附权利要求书中所限定的主题未必局限于上面描述的特定特征或动作。相反，上面所描述的特定特征和动作仅仅是实现权利要求书的示例形式。

Claims (13)

  1. 一种展示效果处理方法，包括：
    响应于对目标元素的编辑操作，确定所述目标元素对应的至少一个关联元素以及所述至少一个关联元素的目标展示效果；
    基于所述目标展示效果调整交互界面中所述至少一个关联元素的当前展示效果，以使所述至少一个关联元素的目标展示效果根据所述目标元素的编辑操作调整展示。
  2. 根据权利要求1所述的方法，其中，所述对目标元素的编辑操作包括：
    检测到所述目标元素的大小调整操作；或
    检测到所述目标元素的元素内容的编辑操作。
  3. 根据权利要求1所述的方法，其中，所述基于所述目标展示效果调整交互界面中所述至少一个关联元素的当前展示效果，包括：
    根据所述目标展示效果确定目标展示图像，在所述交互界面上展示所述定目标展示图像。
  4. 根据权利要求1所述的方法，其中，所述确定所述目标元素对应的至少一个关联元素以及所述至少一个关联元素的目标展示效果，包括：
    根据预先设置的约束逻辑，确定所述至少一个关联元素，其中，所述至少一个关联元素与所述目标元素存在约束关系，和/或，所述至少一个关联元素之间存在约束关系，所述约束关系为位置或尺寸中的至少一个的约束关系；
    根据所述目标元素的编辑目标以及所述至少一个关联元素和所述目标元素之间的约束关系确定所述至少一个关联元素的目标展示效果，其中，所述编辑目标为所述编辑操作的目标。
  5. 根据权利要求4所述的方法，其中，所述至少一个关联元素为多个，所述根据所述目标元素的编辑目标以及所述至少一个关联元素和所述目标元素之间的约束关系确定所述至少一个关联元素的目标展示效果，包括：
    基于所述目标元素的编辑目标，根据所述至少一个关联元素之间的约束关系和所述至少一个关联元素和所述目标元素之间的约束关系依次确定每个所述关联元素的元素展示效果；
    将每个所述关联元素的元素展示效果组合得到所述目标展示效果。
  6. 根据权利要求5所述的方法，其中，所述基于所述目标元素的编辑目标，根据所述至少一个关联元素之间的约束关系和所述至少一个关联元素和所述目标元素之间的约束关系依次确定每个所述关联元素的元素展示效果，包括：
    根据所述至少一个关联元素之间的约束关系和所述至少一个关联元素和所 述目标元素之间的约束关系确定一关联元素作为基准调整元素；
    根据所述至少一个关联元素之间的约束关系确定元素调整顺序；
    以所述基准调整元素为基准，基于所述目标元素的编辑目标和所述元素调整顺序依次确定每个所述关联元素的元素展示效果。
  7. 根据权利要求6所述的方法，其中，所述以所述基准调整元素为基准，基于所述目标元素的编辑目标和所述元素调整顺序依次确定每个所述关联元素的元素展示效果，包括：
    针对任一待调整关联元素，根据所述约束逻辑确定所述待调整关联元素的依赖关联元素；
    根据所述依赖关联元素的元素展示效果确定所述待调整关联元素的元素展示效果。
  8. 根据权利要求7所述的方法，其中，所述元素展示效果为所述元素的尺寸，所述根据所述依赖关联元素的元素展示效果确定所述待调整关联元素的元素展示效果，包括：
    根据所述依赖关联元素的元素尺寸确定关联约束尺寸；
    确定所述依赖关联元素和所述待调整关联元素之间的固定约束尺寸；
    根据所述关联约束尺寸和所述固定约束尺寸确定所述待调整关联元素的尺寸。
  9. 根据权利要求6所述的方法，其中，所述约束逻辑通过有向无环图表示，所述有向无环图中的任一节点为所述目标元素或所述关联元素，所述根据所述至少一个关联元素之间的约束关系和所述至少一个关联元素和所述目标元素之间的约束关系确定一关联元素作为基准调整元素，包括：
    确定所述有向无环图中每个所述节点的入度参数，将入度参数为0的节点对应的元素作为所述基准调整元素。
  10. 根据权利要求1-9任一项所述的方法，其中，所述目标元素为文本框，所述至少一个关联元素为所述文本框的背景。
  11. 一种展示效果处理装置，包括：
    展示效果确定模块，设置为响应于对目标元素的编辑操作，确定所述目标元素对应的至少一个关联元素以及所述至少一个关联元素的目标展示效果；
    展示效果展示模块，设置为基于所述目标展示效果调整交互界面中所述至少一个关联元素的当前展示效果，以使所述至少一个关联元素的目标展示效果根据所述目标元素的编辑操作调整展示。
  12. 一种电子设备，包括：
    一个或多个处理器；
    存储装置，设置为存储一个或多个程序，
    当所述一个或多个程序被所述一个或多个处理器执行，使得所述一个或多个处理器实现如权利要求1-10中任一所述的展示效果处理方法。
  13. 一种包含计算机可执行指令的存储介质，所述计算机可执行指令在由计算机处理器执行时用于执行如权利要求1-10中任一所述的展示效果处理方法。
PCT/CN2023/118433 2022-09-21 2023-09-13 展示效果处理方法、装置、电子设备及存储介质 WO2024061064A1 (zh)

Applications Claiming Priority (2)

Application Number Priority Date Filing Date Title
CN202211153804.6 2022-09-21
CN202211153804.6A CN115454306A (zh) 2022-09-21 2022-09-21 展示效果处理方法、装置、电子设备及存储介质

Publications (1)

Publication Number Publication Date
WO2024061064A1 true WO2024061064A1 (zh) 2024-03-28

Family

ID=84307436

Family Applications (1)

Application Number Title Priority Date Filing Date
PCT/CN2023/118433 WO2024061064A1 (zh) 2022-09-21 2023-09-13 展示效果处理方法、装置、电子设备及存储介质

Country Status (2)

Country Link
CN (1) CN115454306A (zh)
WO (1) WO2024061064A1 (zh)

Families Citing this family (1)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN115454306A (zh) * 2022-09-21 2022-12-09 北京字跳网络技术有限公司 展示效果处理方法、装置、电子设备及存储介质

Citations (4)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN110134468A (zh) * 2018-02-08 2019-08-16 广东神马搜索科技有限公司 文本框尺寸调整方法和装置
US20190379943A1 (en) * 2018-06-06 2019-12-12 Home Box Office, Inc. Editing timed-text elements
CN112198998A (zh) * 2020-08-31 2021-01-08 深圳市镜玩科技有限公司 文本输入控制方法、相关装置、设备及介质
CN115454306A (zh) * 2022-09-21 2022-12-09 北京字跳网络技术有限公司 展示效果处理方法、装置、电子设备及存储介质

Patent Citations (4)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN110134468A (zh) * 2018-02-08 2019-08-16 广东神马搜索科技有限公司 文本框尺寸调整方法和装置
US20190379943A1 (en) * 2018-06-06 2019-12-12 Home Box Office, Inc. Editing timed-text elements
CN112198998A (zh) * 2020-08-31 2021-01-08 深圳市镜玩科技有限公司 文本输入控制方法、相关装置、设备及介质
CN115454306A (zh) * 2022-09-21 2022-12-09 北京字跳网络技术有限公司 展示效果处理方法、装置、电子设备及存储介质

Non-Patent Citations (2)

* Cited by examiner, † Cited by third party
Title
CHENGZHIJINKAI 0608: "How to Customize Subtitle Title Background Image by Using PR", BAIDU, 22 April 2020 (2020-04-22), XP093150633, Retrieved from the Internet <URL: https://jingyan.baidu.com/article/2a13832851c2ce464a134f9f.html> [retrieved on 20240411] *
刘金虎2013 (LIU, JINHU 2013): "PremiereCC 2018怎么制作图形随着文字标注的变化而变化 (Non-official translation: How to Make Graphics Change as Text Labels Change by Using PremiereCC 2018)", WWW.JB51.NET, [ONLINE], [SEARCH DATE: 2023-11-08], SEARCH CONDUCTED ON THE INTERNET: HTTPS://WWW.JB51.NET/SOFTJC/603079.HTML, 12 March 2018 (2018-03-12), pages 1 - 3 *

Also Published As

Publication number Publication date
CN115454306A (zh) 2022-12-09

Similar Documents

Publication Publication Date Title
CN109460233B (zh) 页面的原生界面显示更新方法、装置、终端设备及介质
CN111399956B (zh) 应用于显示设备的内容展示方法、装置和电子设备
CN110070593B (zh) 图片预览信息的显示方法、装置、设备及介质
WO2024061064A1 (zh) 展示效果处理方法、装置、电子设备及存储介质
CN111258519B (zh) 屏幕分屏实现方法、装置、终端和介质
WO2024037556A1 (zh) 图像处理方法、装置、设备及存储介质
US11893770B2 (en) Method for converting a picture into a video, device, and storage medium
WO2021197024A1 (zh) 视频特效配置文件生成方法、视频渲染方法及装置
CN110852946A (zh) 图片展示方法、装置和电子设备
CN115600629A (zh) 车辆信息二维码生成方法、电子设备和计算机可读介质
WO2024022179A1 (zh) 媒体内容的显示方法、装置、电子设备和存储介质
WO2024041637A1 (zh) 特效图生成方法、装置、设备及存储介质
CN110134905B (zh) 一种页面更新显示方法、装置、设备及存储介质
WO2023056841A1 (zh) 一种数据服务方法、装置及相关产品
CN114125485B (zh) 图像处理方法、装置、设备及介质
CN113961280B (zh) 视图的展示方法、装置、电子设备及计算机可读存储介质
CN114489910A (zh) 一种视频会议数据显示方法、装置、设备及介质
CN116775174A (zh) 一种基于用户界面框架的处理方法、装置、设备及介质
CN111199519B (zh) 特效包的生成方法和装置
CN114647472B (zh) 图片处理方法、装置、设备、存储介质和程序产品
WO2023098611A1 (zh) 特效的显示方法、装置、设备及存储介质
CN113205601B (zh) 漫游路径生成方法、装置、存储介质及电子设备
US12020347B2 (en) Method and apparatus for text effect processing
US20240127859A1 (en) Video generation method, apparatus, device, and storage medium
US20230215065A1 (en) Method, apparatus, device and medium for image special effect processing

Legal Events

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

Ref document number: 23867353

Country of ref document: EP

Kind code of ref document: A1