A method and device for layer layout of a dynamic poster
By automatically detecting changes in text layers and adjusting layers according to layout type, the problem of incomplete display and compositional imbalance caused by changes in text content in dynamic posters is solved, achieving efficient automation and personalized customization in poster production.
Patent Information
- Authority / Receiving Office
- CN · China
- Patent Type
- Applications(China)
- Current Assignee / Owner
- CTRIP TRAVEL NETWORK TECH SHANGHAI0
- Filing Date
- 2026-03-10
- Publication Date
- 2026-06-05
Smart Images

Figure CN122156383A_ABST
Abstract
Description
Technical Field
[0001] This application relates to the field of computer graphics processing technology, and in particular to a method and apparatus for layer layout of dynamic posters. Background Technology
[0002] With the rapid development of digital marketing in the tourism industry, dynamic posters, as an important promotional medium, are widely used in various promotional activities, holiday promotions, and product display scenarios.
[0003] Currently, existing technologies for implementing layer layouts in dynamic posters primarily employ fixed positioning, meaning all layers are laid out based on absolute coordinates, with fixed position and size parameters. In this mode, when the content of a text layer needs to be replaced or adjusted, changes in text length, font size, or layout format often result in incomplete text display, obscuring key visual elements, or an unbalanced overall composition. To avoid these problems, designers must manually adjust the position and size of other related layers (such as background and decorative layers) to adapt to changes in text content. This manual adjustment method is not only cumbersome but also severely impacts the efficiency and responsiveness of poster production, failing to meet the practical needs of rapid content iteration and personalized customization in digital marketing. Summary of the Invention
[0004] This application provides a layer layout method and apparatus for dynamic posters, aiming to meet the practical needs of rapid content iteration and personalized customization in digital marketing.
[0005] To achieve the above objectives, this application provides the following technical solution:
[0006] The first aspect of this application provides a layer layout method for dynamic posters, including:
[0007] When a change in the text layer content of the poster is detected, the geometric parameters of each layer are extracted from the poster; the layers include at least a decoration layer, a text layer, a background layer, and a dynamic title macro layer;
[0008] For each layer, a layout type is determined based on the geometric parameters of the layer; the layout type includes at least horizontal layout, vertical layout, and complex layout.
[0009] When the layout type is the horizontal layout or the vertical layout, the layer is adjusted according to the changed text layer content to obtain the adjusted poster.
[0010] When the layout type is the complex layout, the layer is adjusted according to the dynamic title macro layer to obtain the adjusted poster.
[0011] Optionally, determining the layout type based on the geometric parameters of the layer includes:
[0012] Obtain the horizontal axis coordinate, vertical axis coordinate, layer height, and layer width from the geometric parameters;
[0013] The layer coordinates are calculated based on the horizontal axis coordinates, the vertical axis coordinates, the layer height, and the layer width.
[0014] The overall boundary is calculated based on the horizontal axis coordinates, the vertical axis coordinates, and the layer coordinates; the overall boundary includes at least a first coordinate and a second coordinate; the first coordinate is the coordinate of the upper left corner or the upper right corner of the poster; the second coordinate is the coordinate of the lower right corner or the lower left corner of the poster;
[0015] Based on the first coordinate and the second coordinate, the overall width and overall height are calculated;
[0016] The layout type is determined based on the overall width and the overall height.
[0017] Optionally, determining the layout type based on the overall width and the overall height includes:
[0018] Detect whether the absolute value of the difference between the layer height and the overall height is not greater than a first preset threshold;
[0019] If the absolute value of the difference between the layer height and the overall height is not greater than the first preset threshold, then check whether the ratio of the sum of the widths of all layers to the overall width is not less than the second preset threshold.
[0020] If the ratio of the sum of the widths of all layers to the overall width is not less than the second preset threshold, then the horizontal spacing between each adjacent layer is calculated.
[0021] Check whether the maximum horizontal spacing is not greater than a preset percentage of the overall width;
[0022] If the maximum value of the horizontal spacing is not greater than a preset percentage of the overall width, then detect whether there is overlap in the vertical projection between the layers;
[0023] If there is no overlap in the vertical projections between the layers, the layout type is determined to be a horizontal layout.
[0024] Optionally, if the vertical projections between the layers do not overlap, the method further includes:
[0025] Calculate a first ratio between the overall width and the overall height;
[0026] When the first ratio is not less than the third preset threshold, the step of determining the layout type as a horizontal layout is executed.
[0027] Optionally, determining the layout type based on the overall width and the overall height includes:
[0028] Detect whether the absolute value of the difference between the layer width and the overall width is not greater than a fourth preset threshold;
[0029] If the absolute value of the difference between the layer width and the overall width is not greater than the fourth preset threshold, then check whether the ratio of the sum of all layer heights to the overall height is not less than the second preset threshold.
[0030] Calculate the vertical spacing between each adjacent layer;
[0031] Check whether the maximum vertical spacing is not greater than a preset percentage of the overall height;
[0032] If the maximum value of the vertical spacing is not greater than a preset percentage of the overall height, then detect whether there is an overlap in the horizontal projection between the layers;
[0033] If there is no overlap in the horizontal projections between the layers, then the layout type is determined to be a vertical layout.
[0034] Optionally, if the lateral projections between the layers do not overlap, the following steps are included:
[0035] Calculate a second ratio between the overall height and the overall width;
[0036] When the second ratio is not less than the third preset threshold, the step of determining the layout type as a vertical layout is executed.
[0037] Optionally, determining the layout type based on the overall width and the overall height includes:
[0038] Determine whether the layout type is a horizontal or vertical layout based on the overall width and the overall height.
[0039] If the layout type is not the horizontal layout or the vertical layout, then check whether the layer contains a complex layout identifier;
[0040] If the layer contains the complex layout identifier, then the layout type is determined to be a complex layout;
[0041] If the layer does not contain the complex layout identifier, then it is checked whether the layer meets the preset conditions; the preset conditions include at least the existence of a preset number of layers with inconsistent horizontal and vertical heights, mixed arrangement of layers, and excessive overlap of layers;
[0042] If the layer meets the preset conditions, then the layout type is determined to be the complex layout.
[0043] Optionally, adjusting the layer based on the dynamic title macro layer to obtain the adjusted poster includes:
[0044] Based on the dynamic title macro layer, all layers are divided to obtain upper layer combination and lower layer combination;
[0045] Extract the bottom vertical axis coordinates of the dynamic title macro layer, and extract the bottom vertical axis coordinates of the preset elements of the lower layer combination;
[0046] Calculate the difference between the bottom vertical axis coordinate of the dynamic title macro layer and the bottom vertical axis coordinate of the preset element to obtain the actual height of the lower layer combination;
[0047] The height change value is determined based on the dynamic title macro layer;
[0048] Using the upper layer combination as a fixed reference, the layers are adjusted according to the height change value and the actual height of the lower layer combination to obtain the adjusted poster.
[0049] A second aspect of this application provides a layer layout device for a dynamic poster, comprising:
[0050] An extraction unit is used to extract the geometric parameters of each layer from the poster when a change in the text layer content in the poster is detected; the layers include at least a decoration layer, a text layer, a background layer, and a dynamic title macro layer;
[0051] A determining unit is configured to determine, for each layer, a layout type based on the geometric parameters of the layer; the layout type includes at least horizontal layout, vertical layout, and complex layout.
[0052] The first adjustment unit is used to adjust the layer according to the changed text layer content when the layout type is the horizontal layout or the vertical layout, so as to obtain the adjusted poster.
[0053] The second adjustment unit is used to adjust the layer according to the dynamic title macro layer when the layout type is the complex layout, so as to obtain the adjusted poster.
[0054] Optionally, the determining unit includes:
[0055] Obtain sub-units to obtain the horizontal axis coordinates, vertical axis coordinates, layer height, and layer width from the geometric parameters;
[0056] The first calculation subunit is used to calculate the layer coordinates based on the horizontal axis coordinates, the vertical axis coordinates, the layer height, and the layer width;
[0057] The second calculation subunit is used to calculate the overall boundary based on the horizontal axis coordinate, the vertical axis coordinate, and the layer coordinate; the overall boundary includes at least a first coordinate and a second coordinate; the first coordinate is the coordinate of the upper left corner or the upper right corner of the poster; the second coordinate is the coordinate of the lower right corner or the lower left corner of the poster;
[0058] The third calculation subunit is used to calculate the overall width and overall height based on the first coordinate and the second coordinate;
[0059] Determine sub-units to determine the layout type based on the overall width and the overall height.
[0060] The technical solution provided in this application extracts the geometric parameters of each layer from the poster when a change in the text layer content is detected. For each layer, the layout type is determined based on the geometric parameters. When the layout type is horizontal or vertical, the layer is adjusted according to the changed text layer content. When the layout type is complex, the layer is adjusted based on the dynamic title macro layer. When the text layer content changes, the system automatically adjusts accordingly based on the layout type: for horizontal or vertical layouts, the relevant layers are adjusted based on the changed text layer content; for complex layouts, linked adjustments are triggered based on the dynamic title macro layer. All relevant layers automatically follow the changes without manual intervention, thereby improving the efficiency and responsiveness of poster production and meeting the practical needs of rapid content iteration and personalized customization in digital marketing. Attached Figure Description
[0061] To more clearly illustrate the technical solutions in the embodiments of this application or the prior art, the drawings used in the description of the embodiments or the prior art will be briefly introduced below. Obviously, the drawings described below are only some embodiments of this application. For those skilled in the art, other drawings can be obtained based on these drawings without creative effort.
[0062] Figure 1 A flowchart illustrating a layer layout method for a dynamic poster provided in this application embodiment;
[0063] Figure 2 An example diagram of a text bar provided in an embodiment of this application;
[0064] Figure 3 Another example diagram of a text bar provided for an embodiment of this application;
[0065] Figure 4A schematic diagram illustrating the composition structure of a text bar provided in an embodiment of this application;
[0066] Figure 5 A schematic diagram illustrating the change of a text bar as provided in an embodiment of this application;
[0067] Figure 6 A schematic diagram of a vertical layout provided for an embodiment of this application;
[0068] Figure 7 A schematic diagram of a complex layout provided for an embodiment of this application;
[0069] Figure 8 This is a schematic diagram of the architecture of a layer layout device for a dynamic poster provided in an embodiment of this application. Detailed Implementation
[0070] The technical solutions of the embodiments of this application will be clearly and completely described below with reference to the accompanying drawings. Obviously, the described embodiments are only some embodiments of this application, and not all embodiments. Based on the embodiments of this application, all other embodiments obtained by those skilled in the art without creative effort are within the scope of protection of this application.
[0071] In this application, the terms "comprising," "including," or any other variations thereof are intended to cover a non-exclusive inclusion, such that a process, method, article, or apparatus that comprises a list of elements includes not only those elements but also other elements not expressly listed, or elements inherent to such a process, method, article, or apparatus. Without further limitation, an element defined by the phrase "comprising one..." does not exclude the presence of other identical elements in the process, method, article, or apparatus that includes said element.
[0072] like Figure 1 The flowchart shown is a method for layer layout of a dynamic poster provided in an embodiment of this application, including the following steps:
[0073] S101: When a change in the text layer content of the poster is detected, extract the geometric parameters of each layer from the poster.
[0074] The layers include at least a decoration layer, a text layer, a background layer, and a dynamic title macro layer.
[0075] Understandably, the background layer at the bottom sets the basic color tone and visual style for the image; the upper decorative layer enriches the details and atmosphere of the image with elements such as light spots and lines; the middle text layer is specifically designed to carry core text information such as titles and subtitles for independent modification; and the dynamic title macro layer refers to the poster's core title layer, which is set as a macro variable, supports free replacement of text content, and serves as the core trigger for layout adaptation, making it the reference core for the entire adaptive adjustment.
[0076] It should be noted that we first parse out all the independent layers in the poster that originally used absolute positioning, and then identify the decoration layer, text layer and background layer among all the independent layers as an adaptively combined layer group, so as to define the scope for subsequent layout reconstruction.
[0077] Furthermore, in adaptive composition, setting the text layer as a macro variable (such as {title}, {text}, {Name}) means that this layer can be replaced by text of any length and content (such as hotel name, address, etc.). As the core trigger for layout adaptation, changes in the content or size of this macro-defined text layer will drive all subsequent linked adjustments.
[0078] S102: For each layer, determine the layout type based on the layer's geometric parameters.
[0079] Among them, the layout types include at least horizontal layout, vertical layout and complex layout.
[0080] For a specific example of this text bar, please see [link / reference]. Figure 2 and Figure 3 This horizontally laid-out text bar consists of three horizontally arranged parts: a left-side decoration, the middle text (including the background), and a right-side decoration. It uses a flex layout to automatically allocate space. The outer layer of the text bar is an adaptive group, with its position fixed by absolute positioning, but its height and width are not fixed (see...). Figure 4 The left and right decorations and background will automatically adjust to changes in text length (see...). Figure 5 ).
[0081] In addition, it also supports the intersection of decorative layers and text layers, which is achieved through spacing.
[0082] For specific details on vertical layout, please refer to [link / reference]. Figure 6 , Figure 6 The red text in the title changes in sync with the main title above.
[0083] For details, see the complex layout example. Figure 7 ,from Figure 7 As you can see, the hotel name is not fixed; it can be one line, two lines, three lines, etc. Different pictures and content are displayed below the hotel name, but the images below will automatically move down as the height of the hotel name changes.
[0084] Optionally, in another embodiment of this application, the specific implementation of step S102 includes processes A1 to A5.
[0085] A1: Obtain the x-axis coordinate, y-axis coordinate, layer height, and layer width from the geometric parameters.
[0086] A2: The layer coordinates are calculated based on the horizontal axis coordinates, vertical axis coordinates, layer height, and layer width.
[0087] Layer coordinates include, but are not limited to, the coordinates of the bottom right corner of the layer. The bottom right corner coordinates of the layer include the horizontal and vertical coordinates of the bottom right corner.
[0088] Specifically, based on the horizontal axis coordinate, vertical axis coordinate, layer height and layer width, the specific representation of the layer coordinate is calculated as shown in formula (1) and formula (2).
[0089] (1)
[0090] (2)
[0091] In formulas (1) and (2), The x-coordinate of the top-left corner of the layer. The y-coordinate of the top-left corner of the layer. For layer width, For layer height, The x-coordinate of the bottom right corner of the layer. This is the y-coordinate of the bottom right corner of the layer.
[0092] A3: The overall boundary is calculated based on the horizontal axis coordinate, vertical axis coordinate, and layer coordinate.
[0093] The overall boundary includes at least a first coordinate and a second coordinate; the first coordinate is the coordinate of the upper left or upper right corner of the poster; the second coordinate is the coordinate of the lower right or lower left corner of the poster.
[0094] Specifically, the implementation methods for calculating the overall boundary based on the horizontal axis coordinate, vertical axis coordinate and layer coordinate are shown in formulas (3), (4), (5) and (6).
[0095] (3)
[0096] (4)
[0097] (5)
[0098] (6)
[0099] In formulas (3), (4), (5), and (6), (x group ,y group (x) represents the coordinates of the top-left corner of the poster. group_end ,y group_end ) represents the coordinates of the bottom right corner of the poster, and n represents the total number of layers.
[0100] A4: Based on the first and second coordinates, the overall width and overall height are calculated.
[0101] Among them, based on the first coordinate and the second coordinate, the specific representation of the overall width and overall height is calculated, as shown in formula (7) and formula (8).
[0102] (7)
[0103] (8)
[0104] In formulas (7) and (8), The overall width This refers to the overall width.
[0105] A5: Determine the layout type based on the overall width and overall height.
[0106] Understandably, the overall width and overall height are compared with preset thresholds respectively, and the layout type is determined based on the comparison results.
[0107] Optionally, in another embodiment of this application, the specific implementation of process A5 includes processes B1 to B6.
[0108] B1: Check if the absolute value of the difference between the layer height and the overall height is not greater than the first preset threshold.
[0109] If the absolute value of the difference between the layer height and the overall height is not greater than the first preset threshold, then process B2 is executed.
[0110] Optionally, the first preset threshold includes, but is not limited to, .
[0111] Specifically, the absolute value of the difference between the layer height and the overall height not exceeding the first preset threshold is manifested as follows: .
[0112] It should be noted that in a horizontal layout, a slight height discrepancy between the decorative layer and the text layer is permissible to accommodate subtle size differences in real-world scenarios. Typically, the background layer and dynamic text layer maintain roughly the same height, while the decorative layers (such as the small icons on the left and right sides) can be slightly lower, but not exceeding a set error threshold, thus ensuring overall vertical alignment in the layout.
[0113] B2: Check if the ratio of the sum of the widths of all layers to the overall width is not less than the second preset threshold.
[0114] If the ratio of the sum of all layer widths to the overall width is not less than the second preset threshold, then process B3 is executed.
[0115] The second preset threshold includes, but is not limited to, 90%.
[0116] Specifically, the ratio of the sum of all layer widths to the overall width is not less than the second preset threshold is expressed as follows: Among them, W i Let be the width of the i-th element in the group.
[0117] It should be noted that in the horizontal layout, the background layer wraps around the dynamic text layer, and the left and right decorative layers are located on either side of the text layer. After the three are closely joined horizontally, the overall width is close to the width of the group, thus ensuring that the layers fill the group horizontally and avoiding large areas of horizontal blank space, which fits the actual application scenario.
[0118] B3: Calculate the horizontal spacing between each adjacent layer.
[0119] It is understandable that after sorting by the x-axis coordinate of the layers, the horizontal spacing between adjacent layers (decoration layer, dynamic text layer, background layer) (the x-axis coordinate of the next layer minus the x-axis coordinate of the bottom right corner of the previous layer) should be relatively uniform, and the maximum spacing should not exceed 10% of the overall width of the combination (i.e., the preset percentage of the overall width).
[0120] B4: Check if the maximum horizontal spacing is not greater than the preset percentage of the overall width.
[0121] If the maximum value of the horizontal spacing is not greater than the preset percentage of the overall width, then process B5 will be executed.
[0122] Specifically, the maximum horizontal spacing not exceeding a preset percentage of the overall width is expressed as follows: .
[0123] It should be noted that there are two typical arrangements for horizontal layouts: "left decorative layer → background layer → dynamic text layer → right decorative layer" or "left decorative layer → dynamic text layer → background layer → right decorative layer". After sorting by the x-axis coordinate, the spacing between adjacent layers is uniform, which conforms to the judgment logic.
[0124] B5: Detect whether there is overlap in the vertical projection between layers.
[0125] If there is no overlap in the vertical projections between layers, then process B6 is executed.
[0126] Specifically, the vertical projections of any two layers (decoration layer, dynamic text layer, background layer) should not have significant overlap; that is, for any two different layers i and j (i≠j), the following condition must be met. or Where i and j are the numbers of any two different layers within the group ( (covering decoration layer, text layer, and background layer), y i Let y be the y-coordinate of the top-left corner of layer i. j Let y_ be the y-coordinate of the top-left corner of layer j. endi The y-coordinate of the bottom right corner of layer i (y i +H i ), y_ endj The y-coordinate of the bottom right corner of layer j (y j +H j ), H i H is the height of layer i. j The height of layer j.
[0127] It should be noted that in the horizontal layout, the decoration layer, dynamic text layer and background layer are vertically aligned without obvious vertical overlap; a very small amount of edge overlap is allowed, and the overlap height does not exceed 5% of the height of any layer, which fits the needs of actual scenarios.
[0128] Optionally, if there is no overlap in the vertical projection between layers, calculate a first ratio between the overall width and the overall height; when the first ratio is not less than a third preset threshold, execute process B6.
[0129] Specifically, the first ratio between the overall width and the overall height is represented by W. group / H group .
[0130] The third preset threshold includes, but is not limited to, 2.
[0131] Understandably, the overall composition presents a shape where "width is greater than height," which aligns with the visual characteristics of a horizontal layout. Specifically, both the background layer and the dynamic text layer are wider than they are tall, and although the decorative layer may be close to square, the overall aspect ratio of the three combined still reaches ≥2, fitting the actual scenario.
[0132] B6: Determine the layout type as horizontal layout.
[0133] It's important to note that the core characteristics of a horizontal layout are: all layers within a group (including decoration layers, dynamic text layers, and background layers) are arranged horizontally (x-axis), with a relatively uniform vertical (y-axis) height. There is no significant vertical overlap between layers, and their horizontal distribution accounts for approximately the same proportion as the overall width of the group. This description clearly covers three types of layers, aligning with actual layout composition.
[0134] Optionally, in another embodiment of this application, the specific implementation of process A5 includes processes C1 to C6.
[0135] C1: Detect whether the absolute value of the difference between the layer width and the overall width is not greater than the fourth preset threshold.
[0136] If the absolute value of the difference between the layer width and the overall width is not greater than the fourth preset threshold, then process C2 is executed.
[0137] Optionally, the fourth preset threshold includes, but is not limited to, .
[0138] Specifically, the absolute value of the difference between the layer width and the overall width not exceeding the fourth preset threshold is manifested as follows: .
[0139] It should be noted that in the vertical layout, the width of the background layer and the dynamic text layer are basically the same, while the width of the decorative layer (such as the small icons on the top and bottom sides) is slightly narrower, but does not exceed the set threshold. This meets the core requirement of "horizontal alignment" for the vertical layout.
[0140] C2: Detect whether the ratio of the sum of all layer heights to the overall height is not less than a second preset threshold.
[0141] If the ratio of the sum of the heights of all layers to the overall height is not less than the second preset threshold, then process C3 is executed.
[0142] Specifically, the expression for the ratio of the sum of all layer heights to the overall height being no less than the second preset threshold is as follows: Specifically, the expression for the ratio of the sum of all layer widths to the overall width being no less than the second preset threshold is as follows: Among them, W iW represents the width of the i-th layer in the group (including decoration layers, dynamic text layers, and background layers), n represents the total number of layers in the group, and W represents the width of the i-th layer in the group. group The overall width of the entire group (calculated from the leftmost / rightmost coordinates of all layers).
[0143] It should be noted that in the vertical layout, the background layer wraps the dynamic text layer, and the upper and lower decorative layers are located above and below the text layer, respectively. After the three are closely joined vertically, the overall height is close to the combined height, which meets the condition.
[0144] C3: Calculate the vertical spacing between each adjacent layer.
[0145] It is understandable that after sorting by the y-axis coordinate of the layers, the horizontal spacing between adjacent layers (decoration layer, dynamic text layer, background layer) (the y-axis coordinate of the next layer minus the y-axis coordinate of the bottom right corner of the previous layer) should be relatively uniform, and the maximum spacing should not exceed 10% of the overall height of the combination (i.e., the preset percentage of the overall height).
[0146] C4: Check if the maximum vertical spacing is not greater than a preset percentage of the overall height.
[0147] If the maximum value of the vertical spacing is not greater than the preset percentage of the overall height, then process C5 is executed.
[0148] Specifically, the maximum horizontal spacing not exceeding a preset percentage of the overall width is expressed as follows: The value of i ranges from 1 to n-1.
[0149] There are two typical arrangements for vertical layouts: "top decoration layer → background layer → dynamic text layer → bottom decoration layer" or "top decoration layer → dynamic text layer → background layer → bottom decoration layer". After sorting by the y-axis coordinate, the spacing between adjacent layers is uniform, which conforms to the judgment logic.
[0150] C5: Detects whether there is overlap in the horizontal projection between layers.
[0151] If there is no overlap in the horizontal projections between layers, then process C6 is executed.
[0152] Specifically, the horizontal projections of any two layers (decoration layer, dynamic text layer, background layer) should not have significant overlap; that is, for any two different layers i and j (i≠j), the following condition must be met. or (i≠j). Where i and j are the numbers of any two different layers within the group (i≠j, including overlay decoration layers, text layers, and background layers), x i Let x be the x-coordinate of the top-left corner of layer i. j Let x_ be the x-coordinate of the top-left corner of layer j.endi The x-coordinate of the bottom right corner of layer i (x i +W i ), x_ endj The x-coordinate of the bottom right corner of layer j (x j +W j ), W i W is the width of layer i. j The width of layer j.
[0153] It should be noted that in the vertical layout, the decoration layer, dynamic text layer and background layer are horizontally aligned with no obvious left and right overlap; a very small amount of edge overlap is allowed, and the overlap width does not exceed 5% of the width of any layer, which fits the needs of actual scenarios.
[0154] Furthermore, any two layers must be completely offset horizontally, with no significant left-right overlap. The right side of layer i must be less than or equal to the left side of layer j, or the right side of layer j must be less than or equal to the left side of layer i. Meeting this condition indicates no horizontal overlap, a necessary condition for vertical layout.
[0155] Optionally, if there is no overlap in the horizontal projection between layers, then calculate the second ratio between the overall height and the overall width; when the second ratio is not less than the third preset threshold, execute process C4.
[0156] Specifically, the first ratio between the overall width and the overall height is represented by H. group / W group .
[0157] It should be noted that the overall arrangement presents a "height greater than width" shape, which conforms to the visual characteristics of a vertical layout. Specifically, both the background layer and the dynamic text layer are taller than wide, and although the decorative layer may be close to square, the overall aspect ratio of the three combined is ≤0.5, which fits the actual scene.
[0158] C6: Determine the layout type as vertical layout.
[0159] The core characteristic of vertical layout is that all layers within a group (including decoration layers, dynamic text layers, and background layers) are arranged sequentially along the vertical direction (i.e., the y-axis). Horizontally, the widths of each layer tend to be consistent, with no significant horizontal overlap; vertically, their height distribution proportions are consistent with the overall height of the group. This description clearly defines the composition of the three types of layers and aligns with practical layout usage scenarios.
[0160] Optionally, in another embodiment of this application, the specific implementation of step S102 includes processes D1 to D5.
[0161] D1: Determine whether the layout type is horizontal or vertical based on the overall width and overall height.
[0162] If the layout type is not a horizontal or vertical layout, then process D2 is executed.
[0163] It is understandable that the layout type is determined based on the overall width and overall height, that is, the horizontal layout judgment is performed from process B1 to process B6, and the vertical layout judgment is performed from process C1 to process C6.
[0164] D2: Detects whether the layer contains complex layout identifiers.
[0165] If the layer contains complex layout identifiers, then process D3 is executed; if the layer does not contain complex layout identifiers, then process D4 is executed.
[0166] D3: Determine the layout type as complex layout.
[0167] D4: Check if the layer meets the preset conditions.
[0168] If the layer meets the preset conditions, then process D5 is executed.
[0169] The preset conditions include at least the existence of a preset number of layers with inconsistent horizontal and vertical heights, mixed arrangement of layers, and excessive overlap of layers.
[0170] Specifically, there are three or more layers, but the dimensions of each layer differ too much, failing to meet the requirements of consistent horizontal height for horizontal layouts and consistent vertical width for vertical layouts (e.g., decoration layers, dynamic text layers, and background layers have vastly different sizes, making alignment difficult); the layer arrangement directions are mixed, with some arranged horizontally and some vertically, making it impossible to categorize them into a single layout type (e.g., decoration layers are arranged horizontally while dynamic text layers are arranged vertically, or vice versa); the overlapping area between layers is too large, with the overlapping portion of any two layers reaching 30% or more of the area of one of the layers (e.g., background layers, dynamic text layers, and decoration layers overlap excessively, failing to meet the requirement of "no obvious overlap" in horizontal / vertical layouts).
[0171] D5: Determine the layout type as complex layout.
[0172] S103: When the layout type is horizontal or vertical, adjust the layer according to the changed text layer content to obtain the adjusted poster.
[0173] Specifically, for the horizontal layout, the linkage adaptation of elements within the group adopts a preset Flex flow rule: the adaptive combination is split into three parts: the left decoration, the middle text and background, and the right decoration. When the content of the text layer changes, the background layer automatically adapts to the actual size of the text, and the left and right decoration layers adjust their positions synchronously with the text layer through the spacing rule. At the same time, it supports the spacing adaptation between the decoration layer and the text layer in the intersection scenario to ensure the precise linkage of the overall layout.
[0174] For the vertical layout, with the upper-level core text layer (such as the main title) as the reference benchmark, the lower-level associated text layer (such as the red explanatory text) automatically adjusts its vertical position according to the height and content changes of the upper-level text layer, so as to achieve the coordinated adaptation of the visual ratio between levels.
[0175] S104: When the layout type is a complex layout, adjust the layers according to the dynamic title macro layer to obtain the adjusted poster.
[0176] Among them, in the multi-layer complex combination scenario, with the dynamic title macro layer as the dividing line, the layers above and below it are respectively combined into independent large groups. The lower-layer layer combination adopts a mixed layout combining relative positioning of the outer layer and absolute positioning of the inner layer. By calculating the actual height of the lower-layer layer combination, the missing height information caused by the absolute positioning of the inner layer is compensated, so as to realize the synchronous overall displacement of the lower-layer layer combination with the change of the height of the dynamic title layer.
[0177] Optionally, in another embodiment of the present application, the specific implementation of adjusting the layers according to the dynamic title macro layer in step S104 to obtain the adjusted poster includes processes E1 to E5.
[0178] E1: Divide all the layers according to the dynamic title macro layer to obtain the upper-layer layer combination and the lower-layer layer combination.
[0179] Among them, with the dynamic title macro layer as the visual dividing line, all relevant poster layers above the visual of this layer are the upper-layer layer combination, and all relevant poster layers below the visual of this layer are the lower-layer layer combination.
[0180] It can be understood that for the complex layout scenario of the poster, merging the layers above and below the dynamic title into independent large groups respectively, the core is to achieve hierarchical management and overall linkage of the layers. This approach not only avoids element misalignment and layout chaos caused by independent adjustment of individual layers, simplifies the control logic of adaptive adjustment, but also enables all layers below the dynamic title to be regarded as a whole and adaptively adjust their positions synchronously with the change of the title layer height, ensuring the consistency of the adjustment process. At the same time, the merged large group can completely retain the original design layout and relative positions of each layer, maintaining the unity of the visual effect without changing the original design style.
[0181] E2: Extract the bottom vertical axis coordinate of the dynamic title macro layer and the bottom vertical axis coordinate of the preset elements of the lower layer combination.
[0182] Among them, the bottom vertical axis coordinate of the preset element is the last / visually bottommost layer element within the lower layer combination.
[0183] E3: Calculate the difference between the bottom vertical axis coordinate of the dynamic title macro layer and the bottom vertical axis coordinate of the preset element to obtain the actual height of the lower layer combination.
[0184] Among them, the specific manifestation of calculating the difference between the bottom vertical axis coordinate of the dynamic title macro layer and the bottom vertical axis coordinate of the preset element is . Among them, is the actual height of the lower layer combination, is the bottom vertical axis coordinate of the preset element, is the bottom vertical axis coordinate of the dynamic title macro layer.
[0185] E4: Determine the height change value based on the dynamic title macro layer.
[0186] Specifically, calculate the latest height and the original height of the dynamic title macro layer; calculate the difference between the latest height and the original height to obtain the height change value.
[0187] Among them, the specific manifestation of calculating the difference between the latest height and the original height is . is the height change value (a positive number indicates an increase in height, and a negative number indicates a decrease in height), is the latest height, is the original height.
[0188] E5: Taking the upper layer combination as a fixed reference, adjust the layers according to the height change value and the actual height of the lower layer combination to obtain the adjusted poster.
[0189] Among them, based on the actual height of the lower layer combination, synchronously displace and adjust the outer relative positioning reference point (bound to the bottom of the dynamic title layer) of the lower layer combination to achieve the overall linked displacement of all layers in the lower group. Its calculation formula is . is the new top y-axis coordinate of the lower layer combination after the change in the dynamic title height, is the original top y-axis coordinate of the lower layer combination before the change in the dynamic title height.
[0190] It should be noted that if the lower layer group contains nested horizontal or vertical adaptive subgroups, after the main group completes its overall displacement, the subgroup will automatically trigger its own Flex adaptation rules to perform secondary adaptive adjustments on its internal decoration layers, background layers, and text layers to adapt to the layout space after the main group's overall displacement.
[0191] In summary, when the text layer content changes, the system automatically adjusts accordingly based on the layout type: for horizontal or vertical layouts, it adjusts the relevant layers based on the changed text layer content; for complex layouts, it triggers linked adjustments based on the dynamic title macro layer. All relevant layers automatically follow the changes without manual intervention, significantly improving the efficiency and responsiveness of poster production and meeting the practical needs of rapid content iteration and personalized customization in digital marketing.
[0192] like Figure 8 The diagram shown is a schematic diagram of the architecture of a layer layout device for a dynamic poster provided in an embodiment of this application. The layer layout device includes: an extraction unit 100, a determination unit 200, a first adjustment unit 300, and a second adjustment unit 400.
[0193] The extraction unit 100 is used to extract the geometric parameters of each layer from the poster when a change in the text layer content in the poster is detected; the layers include at least a decoration layer, a text layer, a background layer, and a dynamic title macro layer.
[0194] Unit 200 is used to determine the layout type for each layer based on the layer's geometric parameters; the layout types include at least horizontal layout, vertical layout, and complex layout.
[0195] The first adjustment unit 300 is used to adjust the layer according to the changed text layer content when the layout type is horizontal or vertical, so as to obtain the adjusted poster.
[0196] The second adjustment unit 400 is used to adjust the layers according to the dynamic title macro layer when the layout type is complex layout, so as to obtain the adjusted poster.
[0197] The second adjustment unit 400 is used to divide all layers according to the dynamic title macro layer, resulting in an upper layer combination and a lower layer combination; extract the bottom vertical axis coordinates of the dynamic title macro layer and the bottom vertical axis coordinates of the preset elements of the lower layer combination; calculate the difference between the bottom vertical axis coordinates of the dynamic title macro layer and the bottom vertical axis coordinates of the preset elements to obtain the actual height of the lower layer combination; determine the height change value based on the dynamic title macro layer; and adjust the layers according to the height change value and the actual height of the lower layer combination, using the upper layer combination as a fixed reference, to obtain the adjusted poster.
[0198] In summary, when the text layer content changes, the system automatically adjusts accordingly based on the layout type: for horizontal or vertical layouts, it adjusts the relevant layers based on the changed text layer content; for complex layouts, it triggers linked adjustments based on the dynamic title macro layer. All relevant layers automatically follow the changes without manual intervention, significantly improving the efficiency and responsiveness of poster production and meeting the practical needs of rapid content iteration and personalized customization in digital marketing.
[0199] Combination Figure 8 The content shown, the determining unit 200 includes:
[0200] Get sub-cells to obtain the x-axis coordinates, y-axis coordinates, layer height, and layer width from the geometric parameters.
[0201] The first calculation subunit is used to calculate the layer coordinates based on the horizontal axis coordinates, vertical axis coordinates, layer height, and layer width.
[0202] The second calculation subunit is used to calculate the overall boundary based on the horizontal axis coordinate, the vertical axis coordinate, and the layer coordinate; the overall boundary includes at least the first coordinate and the second coordinate; the first coordinate is the coordinate of the upper left corner or the upper right corner of the poster; the second coordinate is the coordinate of the lower right corner or the lower left corner of the poster.
[0203] The third calculation subunit is used to calculate the overall width and overall height based on the first and second coordinates.
[0204] Determine the sub-units, which are used to determine the layout type based on the overall width and overall height.
[0205] The specific function of the sub-unit is to: detect whether the absolute value of the difference between the layer height and the overall height is not greater than a first preset threshold; if the absolute value of the difference between the layer height and the overall height is not greater than the first preset threshold, then detect whether the ratio of the sum of the widths of all layers to the overall width is not less than a second preset threshold; if the ratio of the sum of the widths of all layers to the overall width is not less than the second preset threshold, then calculate the horizontal spacing between each adjacent layer; detect whether the maximum value of the horizontal spacing is not greater than a preset percentage of the overall width; if the maximum value of the horizontal spacing is not greater than a preset percentage of the overall width, then detect whether there is overlap in the vertical projections between layers; if there is no overlap in the vertical projections between layers, then determine that the layout type is a horizontal layout.
[0206] The specific functions of the sub-unit are as follows: 1. Detecting whether the absolute value of the difference between the layer width and the overall width is not greater than a fourth preset threshold; 2. If the absolute value of the difference between the layer width and the overall width is not greater than the fourth preset threshold, then detecting whether the ratio of the sum of all layer heights to the overall height is not less than a second preset threshold; 3. Calculating the vertical spacing between each adjacent layer; 4. Detecting whether the maximum value of the vertical spacing is not greater than a preset percentage of the overall height; 5. If the maximum value of the vertical spacing is not greater than a preset percentage of the overall height, then detecting whether there is overlap in the horizontal projections between layers; 6. If there is no overlap in the horizontal projections between layers, then determining the layout type as a vertical layout.
[0207] The specific function of determining the sub-unit is as follows: Based on the overall width and overall height, determine whether the layout type is a horizontal or vertical layout; if the layout type is not a horizontal or vertical layout, check whether the layer contains a complex layout identifier; if the layer contains a complex layout identifier, determine that the layout type is a complex layout; if the layer does not contain a complex layout identifier, check whether the layer meets preset conditions; the preset conditions include at least the existence of a preset number of layers with inconsistent horizontal and vertical heights, mixed arrangement of layers, and excessive overlap of layers; if the layer meets the preset conditions, determine that the layout type is a complex layout.
[0208] Combination Figure 8 The determining unit 200, as shown, also includes:
[0209] The fourth calculation sub-unit is used to calculate the first ratio between the overall width and the overall height.
[0210] The first execution subunit is used to execute the step of determining the layout type as horizontal layout when the first ratio is not less than the third preset threshold.
[0211] Combination Figure 8 The determining unit 200, as shown, also includes:
[0212] The fifth calculation sub-unit is used to calculate the second ratio between the overall height and the overall width.
[0213] The second execution subunit is used to execute the step of determining the layout type as vertical layout when the second ratio is not less than the third preset threshold.
[0214] The various embodiments in this specification are described in a progressive manner, with each embodiment focusing on its differences from other embodiments. Similar or identical parts between embodiments can be referred to interchangeably. In particular, for system or system embodiments, since they are fundamentally similar to method embodiments, the description is relatively simple; relevant parts can be referred to the descriptions in the method embodiments. The systems and system embodiments described above are merely illustrative. The units described as separate components may or may not be physically separate. Components shown as units may or may not be physical units; that is, they may be located in one place or distributed across multiple network units. Some or all of the modules can be selected to achieve the purpose of this embodiment according to actual needs. Those skilled in the art can understand and implement this without creative effort.
[0215] Those skilled in the art will further recognize that the units and algorithm steps of the various examples described in conjunction with the embodiments disclosed herein can be implemented in electronic hardware, computer software, or a combination of both. To clearly illustrate the interchangeability of hardware and software, the components and steps of the various examples have been generally described in terms of functionality in the foregoing description. Whether these functions are implemented in hardware or software depends on the specific application and design constraints of the technical solution. Those skilled in the art can use different methods to implement the described functions for each specific application, but such implementations should not be considered beyond the scope of this invention.
[0216] The above description of the disclosed embodiments enables those skilled in the art to make or use this application. Various modifications to these embodiments will be readily apparent to those skilled in the art, and the general principles defined herein may be implemented in other embodiments without departing from the spirit or scope of this application. Therefore, this application is not to be limited to the embodiments shown herein, but is to be accorded the widest scope consistent with the principles and novel features disclosed herein.
Claims
1. A layer layout method for a dynamic poster, characterized in that, include: When a change in the text layer content of the poster is detected, the geometric parameters of each layer are extracted from the poster; The layers include at least a decoration layer, a text layer, a background layer, and a dynamic title macro layer; For each layer, a layout type is determined based on the geometric parameters of the layer; the layout type includes at least horizontal layout, vertical layout, and complex layout. When the layout type is the horizontal layout or the vertical layout, the layer is adjusted according to the changed text layer content to obtain the adjusted poster. When the layout type is the complex layout, the layer is adjusted according to the dynamic title macro layer to obtain the adjusted poster.
2. The method according to claim 1, characterized in that, The step of determining the layout type based on the geometric parameters of the layer includes: Obtain the horizontal axis coordinate, vertical axis coordinate, layer height, and layer width from the geometric parameters; The layer coordinates are calculated based on the horizontal axis coordinates, the vertical axis coordinates, the layer height, and the layer width. The overall boundary is calculated based on the horizontal axis coordinates, the vertical axis coordinates, and the layer coordinates; the overall boundary includes at least a first coordinate and a second coordinate; the first coordinate is the coordinate of the upper left corner or the upper right corner of the poster; the second coordinate is the coordinate of the lower right corner or the lower left corner of the poster; Based on the first coordinate and the second coordinate, the overall width and overall height are calculated; The layout type is determined based on the overall width and the overall height.
3. The method according to claim 2, characterized in that, The step of determining the layout type based on the overall width and the overall height includes: Detect whether the absolute value of the difference between the layer height and the overall height is not greater than a first preset threshold; If the absolute value of the difference between the layer height and the overall height is not greater than the first preset threshold, then check whether the ratio of the sum of the widths of all layers to the overall width is not less than the second preset threshold. If the ratio of the sum of the widths of all layers to the overall width is not less than the second preset threshold, then the horizontal spacing between each adjacent layer is calculated. Check whether the maximum horizontal spacing is not greater than a preset percentage of the overall width; If the maximum value of the horizontal spacing is not greater than a preset percentage of the overall width, then detect whether there is overlap in the vertical projection between the layers; If there is no overlap in the vertical projections between the layers, the layout type is determined to be a horizontal layout.
4. The method according to claim 3, characterized in that, If the vertical projections between the layers do not overlap, the method further includes: Calculate a first ratio between the overall width and the overall height; When the first ratio is not less than the third preset threshold, the step of determining the layout type as a horizontal layout is executed.
5. The method according to claim 2, characterized in that, The step of determining the layout type based on the overall width and the overall height includes: Detect whether the absolute value of the difference between the layer width and the overall width is not greater than a fourth preset threshold; If the absolute value of the difference between the layer width and the overall width is not greater than the fourth preset threshold, then check whether the ratio of the sum of all layer heights to the overall height is not less than the second preset threshold. Calculate the vertical spacing between each adjacent layer; Check whether the maximum vertical spacing is not greater than a preset percentage of the overall height; If the maximum value of the vertical spacing is not greater than a preset percentage of the overall height, then detect whether there is an overlap in the horizontal projection between the layers; If there is no overlap in the horizontal projections between the layers, then the layout type is determined to be a vertical layout.
6. The method according to claim 5, characterized in that, If the horizontal projections between the layers do not overlap, the following steps are included: Calculate a second ratio between the overall height and the overall width; When the second ratio is not less than the third preset threshold, the step of determining the layout type as a vertical layout is executed.
7. The method according to claim 2, characterized in that, The step of determining the layout type based on the overall width and the overall height includes: Determine whether the layout type is a horizontal or vertical layout based on the overall width and the overall height. If the layout type is not the horizontal layout or the vertical layout, then check whether the layer contains a complex layout identifier; If the layer contains the complex layout identifier, then the layout type is determined to be a complex layout; If the layer does not contain the complex layout identifier, then it is checked whether the layer meets the preset conditions; the preset conditions include at least the existence of a preset number of layers with inconsistent horizontal and vertical heights, mixed arrangement of layers, and excessive overlap of layers; If the layer meets the preset conditions, then the layout type is determined to be the complex layout.
8. The method according to claim 1, characterized in that, The step of adjusting the layer based on the dynamic title macro layer to obtain the adjusted poster includes: Based on the dynamic title macro layer, all layers are divided to obtain upper layer combination and lower layer combination; Extract the bottom vertical axis coordinates of the dynamic title macro layer, and extract the bottom vertical axis coordinates of the preset elements of the lower layer combination; Calculate the difference between the bottom vertical axis coordinate of the dynamic title macro layer and the bottom vertical axis coordinate of the preset element to obtain the actual height of the lower layer combination; The height change value is determined based on the dynamic title macro layer; Using the upper layer combination as a fixed reference, the layers are adjusted according to the height change value and the actual height of the lower layer combination to obtain the adjusted poster.
9. A layer layout device for a dynamic poster, characterized in that, include: An extraction unit is used to extract the geometric parameters of each layer from the poster when a change in the text layer content in the poster is detected. The layers include at least a decoration layer, a text layer, a background layer, and a dynamic title macro layer; A determining unit is configured to determine, for each layer, a layout type based on the geometric parameters of the layer; the layout type includes at least horizontal layout, vertical layout, and complex layout. The first adjustment unit is used to adjust the layer according to the changed text layer content when the layout type is the horizontal layout or the vertical layout, so as to obtain the adjusted poster. The second adjustment unit is used to adjust the layer according to the dynamic title macro layer when the layout type is the complex layout, so as to obtain the adjusted poster.
10. The apparatus according to claim 9, characterized in that, The determining unit includes: Obtain sub-units to obtain the horizontal axis coordinates, vertical axis coordinates, layer height, and layer width from the geometric parameters; The first calculation subunit is used to calculate the layer coordinates based on the horizontal axis coordinates, the vertical axis coordinates, the layer height, and the layer width; The second calculation subunit is used to calculate the overall boundary based on the horizontal axis coordinate, the vertical axis coordinate, and the layer coordinate; the overall boundary includes at least a first coordinate and a second coordinate; the first coordinate is the coordinate of the upper left corner or the upper right corner of the poster; the second coordinate is the coordinate of the lower right corner or the lower left corner of the poster; The third calculation subunit is used to calculate the overall width and overall height based on the first coordinate and the second coordinate; Determine sub-units to determine the layout type based on the overall width and the overall height.