An image display method, apparatus, device, medium, and product

By displaying a layout type selection area on the image display page and updating the layout area in response to user selection, the problem of inflexible layout in existing technologies is solved, and efficient and continuous image display is achieved.

CN122086276APending Publication Date: 2026-05-26SHANGHAI MEDICAL IMAGE INSIGHTS INTELLIGENT TECHNOLOGY CO LTD
View PDF 0 Cites 0 Cited by

Patent Information

Application Number
CN202610250671.6
Authority / Receiving Office
CN · China
Patent Type
Applications(China)
Current Assignee / Owner
Filing Date
2026-03-03
Publication Date
2026-05-26

AI Technical Summary

Technical Problem

Existing image display methods cannot meet the flexible layout requirements of different scenarios, resulting in repeated data loading and rendering lag, making it difficult to achieve efficient and smooth image display and interaction.

Method used

By displaying a layout type selection area on the image display page, including descriptions and illustrations of the layout type, and updating the layout area in response to user selections, a hierarchical image display framework is constructed, enabling flexible switching of layout types and precise, efficient layout updates.

Benefits of technology

It improves the intuitiveness and decision-making efficiency of layout switching, ensures the continuity and integrity of image display, and realizes flexible switching of layout types and continuity of image data.

✦ Generated by Eureka AI based on patent content.

Smart Images

  • Figure CN122086276A_ABST
    Figure CN122086276A_ABST
Patent Text Reader

Abstract

This disclosure provides an image display method, apparatus, device, medium, and product. The method includes: displaying an image display page, the image display page including at least one layout area for displaying at least one image; responding to a first triggering operation on the image display page, displaying a layout type selection area, the layout type selection area including at least one of a layout type description and a layout schematic; responding to a selection operation of a target layout type, updating the layout area in the image display page, the updated image display page including at least one layout area corresponding to the target layout type, thereby enabling flexible switching of layout types and ensuring the continuity of image data.
Need to check novelty before this filing date? Find Prior Art

Description

Technical Field

[0001] This disclosure relates to the field of image processing technology, and in particular to an image display method, apparatus, device, medium, and product. Background Technology

[0002] With the rapid development of the medical imaging field, the demand for flexibility and adaptability in image display is increasing. Users often need to adjust the layout of image display according to scenarios such as image reading and analysis to meet diverse needs such as detailed viewing of single images and comparison of multiple images.

[0003] Most existing image display methods only support a few fixed template layouts or simple row and column adjustments. Users need to choose from a limited number of preset layout styles or manually add or remove layout areas row by row and column by column. Such methods can adapt to basic image display needs to a certain extent.

[0004] However, the current technological layout cannot meet the image display needs of different scenarios, and problems such as repeated data loading and rendering lag are prone to occur when switching, making it impossible to achieve flexible switching and failing to meet users' needs for efficient and smooth image display and interaction. Summary of the Invention

[0005] This disclosure provides an image display method, apparatus, device, medium, and product to enable flexible switching of layout types and ensure the continuity of image data.

[0006] According to one aspect of this disclosure, an image display method is provided, comprising: An image display page is provided, which includes at least one layout area for displaying at least one image. In response to a first triggering operation on the image display page, a layout type selection area is displayed, the layout type selection area including at least one of a description of the layout type and a layout illustration; In response to the selection operation of the target layout type, the layout area in the image display page is updated, and the updated image display page includes at least one layout area corresponding to the target layout type.

[0007] According to another aspect of this disclosure, an image display apparatus is provided, the apparatus comprising: An image display page module is used to display an image display page, which includes at least one layout area for displaying at least one image. A layout type selection area display module is used to display a layout type selection area in response to a first trigger operation on the image display page. The layout type selection area includes at least one of the following: a description of the layout type and a layout illustration. The layout area update module is used to update the layout area in the image display page in response to the selection operation of the target layout type. The updated image display page includes at least one layout area corresponding to the target layout type.

[0008] According to another aspect of this disclosure, an electronic device is provided, the electronic device comprising: At least one processor; and A memory communicatively connected to the at least one processor; wherein, The memory stores a computer program that can be executed by the at least one processor, the computer program being executed by the at least one processor to enable the at least one processor to perform the image display method according to any embodiment of this disclosure.

[0009] According to another aspect of this disclosure, a computer-readable storage medium is provided that stores computer instructions for causing a processor to execute and implement the image display method according to any embodiment of this disclosure.

[0010] According to another aspect of this disclosure, a computer program product is provided, which, when executed by a processor, implements the image display method as described in any of the embodiments of this disclosure.

[0011] This embodiment of the disclosure demonstrates an image display page, which includes at least one layout area for displaying at least one image. This constructs a hierarchical image display framework, achieving decoupled management of layout areas and images, laying the foundation for flexible layout adjustments and efficient image display. In response to a first trigger operation on the image display page, a layout type selection area is displayed. This area includes at least one of a layout type description and a layout diagram, improving the intuitiveness and efficiency of layout switching. In response to a selection of a target layout type, the layout area on the image display page is updated. The updated image display page includes at least one layout area corresponding to the target layout type, enabling precise and efficient layout switching and maintaining the continuity and integrity of image display. By selecting a layout type and updating the layout area on the image display page, flexible layout type switching is achieved, ensuring the continuity of image data.

[0012] It should be understood that the description in this section is not intended to identify key or essential features of the embodiments of this disclosure, nor is it intended to limit the scope of this disclosure. Other features of this disclosure will become readily apparent from the following description. Attached Figure Description

[0013] To more clearly illustrate the technical solutions of the embodiments of this disclosure, the accompanying drawings used in the embodiments will be briefly described below. It should be understood that the following drawings only show some embodiments of this disclosure and should not be regarded as a limitation of the scope. For those skilled in the art, other related drawings can be obtained based on these drawings without creative effort.

[0014] Figure 1 This is a flowchart of an image display method according to an embodiment of this disclosure; Figure 2 This is a flowchart of an image display method according to an embodiment of this disclosure; Figure 3 This is a flowchart illustrating the adjustment of the layout area in an embodiment of this disclosure; Figure 4 This is a schematic diagram of the layout changes in the embodiments of this disclosure; Figure 5 This is a flowchart illustrating the adjustment of views in an embodiment of this disclosure; Figure 6 This is a schematic diagram of view changes in any layout of the embodiments of this disclosure; Figure 7 This is a schematic diagram of the structure of an image display device according to an embodiment of the present disclosure; Figure 8 This is a schematic diagram of the structure of an electronic device according to an embodiment of this disclosure. Detailed Implementation

[0015] To enable those skilled in the art to better understand the present disclosure, the technical solutions of the present disclosure will be clearly and completely described below with reference to the accompanying drawings of the embodiments. Obviously, the described embodiments are only some embodiments of the present disclosure, and not all embodiments. Based on the embodiments of the present disclosure, all other embodiments obtained by those skilled in the art without creative effort should fall within the scope of protection of the present disclosure.

[0016] It should be noted that the terms "first," "second," etc., in the specification, claims, and accompanying drawings of this disclosure are used to distinguish similar objects and are not necessarily used to describe a specific order or sequence. It should be understood that such data can be interchanged where appropriate so that the embodiments of this disclosure described herein can be implemented in orders other than those illustrated or described herein. Furthermore, the terms "comprising" and "having," and any variations thereof, are intended to cover non-exclusive inclusion; for example, a process, method, system, product, or apparatus that comprises a series of steps or units is not necessarily limited to those steps or units explicitly listed, but may include other steps or units not explicitly listed or inherent to such processes, methods, products, or apparatus.

[0017] It is understood that before using the technical solutions disclosed in the various embodiments of this disclosure, users should be informed of the types, scope of use, and usage scenarios of the personal information involved in this disclosure in an appropriate manner in accordance with relevant laws and regulations, and user authorization should be obtained.

[0018] Figure 1 This is a flowchart illustrating an image display method provided in an embodiment of the present disclosure. This embodiment is applicable to situations where multiple images need to be displayed and the image display layout needs to be flexibly adjusted. The method can be executed by the image display device in this embodiment, which can be implemented using software and / or hardware. This device can be integrated into electronic devices such as computer equipment, servers, mobile terminals, processors, or surgical robots. Figure 1 As shown, the method specifically includes the following steps: S110, Display an image display page, the image display page including at least one layout area, the layout area being used to display at least one image.

[0019] In this embodiment, the image display page can be specifically understood as a page that carries image display and interactive operations. This page is the core operation space for users to browse images and adjust the layout. As the top-level container for image display, the image display page includes at least one layout area. The layout area can be specifically understood as an independently displayed area divided within the image display page, which is the core display area carrying image content. Each layout area can load and display at least one image independently, supporting personalized operations such as zooming in, zooming out, and rotating the image within the area. Multiple layout areas can exist in parallel within the image display page, forming diverse display layouts through different arrangements and combinations to meet differentiated image browsing needs such as detailed viewing of a single image and simultaneous comparison of multiple images.

[0020] Specifically, the image display page is presented. This page includes at least one layout area, which displays at least one image. Each layout area has independent display boundaries and interactive space, allowing for the display of a single image for detailed viewing or the simultaneous display of multiple images for sequential browsing, laying the foundation for subsequent layout adjustments and image interaction.

[0021] S120, in response to a first trigger operation on the image display page, a layout type selection area is displayed, the layout type selection area including at least one of a layout type description and a layout schematic.

[0022] In this embodiment, the first triggering operation can be specifically understood as an operation performed by the user on the image display page to trigger the display layout type selection area. For example, the triggering form of this operation can be a user clicking on a preset functional control on the image display page, such as the "Layout" button. This triggering operation provides the user with a layout type selection entry point when the user has a clear intention to adjust the layout. The layout type selection area can be specifically understood as an area used to present various layout type options. This area is the core intermediate carrier connecting the user's layout adjustment intention and the layout update action, integrating at least one of the layout type description information and layout schematic diagram.

[0023] The layout type description is textual information explaining the core structural features of the layout type. For example, the layout type description could be "single layout," "two layouts," etc. The layout diagram is a visual thumbnail representation of the layout type. This diagram intuitively presents the core structure of the layout type in a minimalist graphic form, such as using borders to show the number, relative position, arrangement, and size ratio of layout areas. The layout diagram corresponds one-to-one with the layout type and can be displayed in conjunction with the layout type description, significantly reducing the user's understanding of the layout effect. Users can quickly filter and select the target layout type that meets their needs by selecting areas based on the layout type, providing clear instructions for subsequent layout area updates.

[0024] Specifically, when a user performs a first trigger action on the image display page, a layout type selection area is displayed in response to this action. This area includes at least one of the following: a description of the layout type and a layout illustration. By displaying this selection area in response to the first trigger action, and through the presentation of the layout description and illustration, users can quickly understand the structure and applicable scenarios of different layout types without having to memorize complex layout parameters or commands. This effectively shortens the layout selection process, improves the user experience, and enhances layout adjustment efficiency.

[0025] S130, in response to the selection operation of the target layout type, the layout area in the image display page is updated, and the updated image display page includes at least one layout area corresponding to the target layout type.

[0026] In this embodiment of the disclosure, the target layout type can be specifically understood as the layout type selected by the user from the layout type selection area. This layout type is a direct reflection of the user's layout adjustment intention and corresponds to a specific layout option within the layout type selection area. The target layout type has clear structural characteristics, namely, it corresponds to a fixed number, position, and size of layout areas.

[0027] Specifically, when a user selects a target layout type in the layout type selection area, the layout area on the image display page is updated in response to this selection. The updated image display page includes at least one layout area corresponding to the target layout type. Updating the layout area in response to the user's selection can, for example, be achieved by triggering Vue's reactive update mechanism. This ensures that the updated page layout is completely consistent with the user-selected target layout type, accurately addressing the layout adjustment requirements.

[0028] Optionally, updating the layout area in the image display page includes: determining the attribute information corresponding to at least one layout area corresponding to the target layout type, wherein the attribute information includes position and size; and setting at least one layout area corresponding to the target layout type based on the attribute information corresponding to at least one layout area corresponding to the target layout type.

[0029] In this embodiment, the attribute information can be specifically understood as a set of information used to define the spatial characteristics and display specifications of the layout area within the image display page. This attribute information includes position and size. The position parameter determines the specific orientation of the layout area in the coordinate system of the image display page, such as the horizontal and vertical coordinates based on the top-left corner of the page as the origin. The size parameter defines the display range of the layout area, such as its proportion relative to the page. By accurately determining and setting the attribute information, it can be ensured that each layout area corresponding to the target layout type is distributed in an orderly manner according to preset rules, achieving precise layout updates.

[0030] Specifically, the user selects a target layout type in the layout type selection area. In response to this selection, the system determines the attribute information for at least one layout area corresponding to that target layout type, including its position and size. Based on this attribute information, at least one layout area corresponding to the target layout type is set. This precise attribute information ensures that each layout area is arranged orderly according to preset rules on the image display page, avoiding issues such as layout misalignment and size mismatch, thus guaranteeing the display effect of the target layout type.

[0031] Optionally, determining the attribute information corresponding to at least one layout region corresponding to the target layout type includes: calling the layout calculation function corresponding to the target layout type to determine the attribute information corresponding to at least one layout region corresponding to the target layout type; or, determining the attribute information corresponding to at least one layout region corresponding to the target layout type based on the mapping relationship between layout type and attribute information.

[0032] In this embodiment, the layout calculation function can be specifically understood as a function used to automatically calculate the spatial attribute parameters of all layout areas under the corresponding layout type. This function incorporates the core arrangement logic and calculation rules of the corresponding layout type. Its input parameters typically include basic information such as the overall size of the image display page and the number of layout areas, and the output results are the position, size, and other attribute information of each layout area. Each layout type corresponds to one layout calculation function. The mapping relationship between layout types and attribute information can be specifically understood as a one-to-one correspondence between a pre-established layout type and the set of attribute information for all layout areas under that type. This mapping relationship can be stored in structured data form. By simply querying this mapping relationship based on the selected target layout type, the attribute information of all corresponding layout areas can be quickly obtained, achieving efficient and accurate matching of layout area attributes.

[0033] Specifically, the user selects a target layout type in the layout type selection area. In response to this selection, the corresponding layout calculation function for that layout type is invoked. This function calculates the attribute information for at least one layout region corresponding to the target layout type. Alternatively, based on a pre-defined mapping between layout types and attribute information, the attribute information for at least one layout region corresponding to the target layout type is determined. This eliminates the need for manual parameter adjustments, significantly reducing operational costs and improving the efficiency of layout updates. Furthermore, the unified attribute information setting logic is applicable to all layout types, enhancing the versatility and stability of the layout adjustment function and providing a solid guarantee for the continuity of subsequent image display.

[0034] Optionally, the method further includes: updating the image displayed in at least one layout area of ​​the image display page; wherein, if the number n of layout areas corresponding to the target layout type is less than the number m of layout areas in the image display page before the update, the images displayed in the first n layout areas of the image display page before the update are retained, or, taking the selected layout area in the image display page before the update as the current layout area, the images displayed in the n layout areas starting from the current layout area are retained; if the number n of layout areas corresponding to the target layout type is greater than the number m of layout areas in the image display page before the update, the newly added layout area is initialized based on the images displayed in the set layout areas of the image display page before the update.

[0035] Specifically, the images displayed in the layout areas are updated to ensure the rationality and continuity of image display after layout switching, avoiding blank areas where no images can be displayed. Specifically, when the number of layout areas *n* corresponding to the target layout type is less than the number of layout areas *m* in the previous image display page, the images displayed in the first *n* layout areas of the previous image display page are retained. Alternatively, the selected layout area in the previous image display page is taken as the current layout area, and the images displayed in the *n* consecutive layout areas starting from the current layout area are retained. When the number of layout areas *n* corresponding to the target layout type is greater than the number of layout areas *m* in the previous image display page, based on the images displayed in the layout areas set in the previous image display page, initialization operations are performed on the newly added *nm* layout areas, followed by a rendering to obtain the adjusted layout areas corresponding to the target layout type.

[0036] It should be noted that, based on the images displayed in the pre-updated layout area of ​​the image display page, initialization operations are performed on the newly added nm layout areas. Specifically, initialization is performed based on the images displayed in the pre-updated layout area of ​​the page. This pre-updated layout area can be the last layout area, the first layout area, or the layout area currently selected by the user on the pre-updated page, ensuring that the newly added layout areas can quickly fill the image content and maintain the integrity of the page display.

[0037] The technical solution of this embodiment, by displaying an image display page, including at least one layout area for displaying at least one image, constructs a hierarchical image display framework, achieving decoupled management of layout areas and images, laying the foundation for subsequent flexible layout adjustments and efficient image display. In response to a first trigger operation on the image display page, a layout type selection area is displayed, including at least one of a layout type description and a layout diagram, improving the intuitiveness and decision-making efficiency of layout switching. In response to a selection operation of a target layout type, the layout area in the image display page is updated, and the updated image display page includes at least one layout area corresponding to the target layout type, enabling precise and efficient layout switching and maintaining the continuity and integrity of image display. By selecting a layout type and updating the layout area on the image display page, flexible layout type switching is achieved, ensuring the continuity of image data.

[0038] Figure 2 This is a flowchart illustrating an image display method provided in an embodiment of the present disclosure. Specifically, this embodiment provides a process for further selecting a view distribution type when a layout area is selected. Optionally, each layout area includes at least one view, and each view is used to display an image. Figure 2 As shown, the method specifically includes the following steps: S210, Display an image display page, the image display page including at least one layout area, the layout area being used to display at least one image.

[0039] S220, in response to a first triggering operation on the image display page, a layout type selection area is displayed, the layout type selection area including at least one of a layout type description and a layout schematic.

[0040] S230, in response to the selection operation of the target layout type, the layout area in the image display page is updated, and the updated image display page includes at least one layout area corresponding to the target layout type.

[0041] S240, when any of the layout areas is selected, in response to a second trigger operation on the image display page, a view type selection area is displayed, the view type selection area including at least one of a description of the view distribution type and a view distribution diagram.

[0042] In this embodiment, the second triggering operation can be specifically understood as an operation performed within the image display page to trigger the selection of the display view type, provided that the layout area has been selected. This operation is the core triggering condition for adjusting the view distribution within the layout area. For example, the triggering form of this operation may include clicking a preset functional control on the image display page, such as a "window" button, provided that the layout area has been selected. Its core function is to trigger the view type selection function within the layout area, providing the user with an interactive entry point to adjust the number and distribution of views within a single layout area.

[0043] The view type selection area can be understood as the area used to present various view distribution type options. This area is the core carrier for realizing the view distribution within the layout area, and while its functional logic is the same as the layout type selection area, its hierarchical function is different. The view type selection area includes at least one of the following: descriptive information of the view distribution type and a schematic diagram of the view distribution.

[0044] Specifically, the descriptive information for the view distribution type can be understood as textual information explaining the core structural features of the view distribution type. This descriptive information corresponds one-to-one with a specific view distribution type; for example, the descriptive information for a view distribution type can be "one window," "two windows," or "6..." "5 windows," etc. A view distribution diagram can be understood as a visual thumbnail representation of the view distribution type. This diagram intuitively presents the core structure of the view distribution type in a minimalist graphic form, allowing users to quickly perceive the characteristics of the view distribution without relying on textual descriptions. For example, borders show the number, relative position, arrangement, and size ratio of views within the layout area. The view distribution diagram corresponds one-to-one with the view distribution type and can be displayed alone or in conjunction with the view distribution type description information, significantly reducing the user's understanding of the view arrangement effect within the layout area.

[0045] Specifically, when any layout area is selected, the user performs a second trigger operation on the image display page, showcasing the view type selection area. This view type selection area includes at least one of the following: a description of the view distribution type and a schematic diagram of the view distribution. This step, by selecting a layout area and performing a second trigger operation, strictly limits the scope of the operation, affecting only the single layout area of ​​interest to the user. This avoids interfering with the display status of other layout areas on the page, ensuring the overall stability of the page.

[0046] It should be noted that the layout area selection can be done by selecting only a single layout area and adjusting the view type and displaying the image independently for that area; or multiple layout areas can be selected at the same time to perform the same view type update operation on all selected layout areas in batches, uniformly adjusting the view distribution structure and image display content in these areas, thus meeting the usage requirements of multi-area synchronous configuration.

[0047] S250, in response to the selection operation of the target view type, update at least one of the view distribution in the layout area and the image displayed by the view.

[0048] In this embodiment of the disclosure, the target view type can be specifically understood as the view distribution type selected by the user from the view type selection area. This view type directly reflects the user's needs for view arrangement and image display within a single layout area, and corresponds to a specific view distribution option within the view type selection area. The target view type has clear internal structural characteristics, namely, it corresponds to a fixed number, arrangement, and relative size of views.

[0049] Specifically, when a user selects a target view type in the view type selection area, in response to this selection, at least one of the view distribution and displayed image in the layout area is updated. By updating at least one of the view distribution and displayed image in the layout area in response to the user's selection of the target view type, for example, this can be achieved by triggering Vue's reactive update mechanism. This ensures that the updated view type is completely consistent with the user's selected target view type, accurately addressing the view adjustment requirements.

[0050] Optionally, updating the view distribution in the layout area includes: determining the attribute information corresponding to at least one view of the target view type based on the attribute information of the layout area; and setting at least one view of the target view type based on the attribute information corresponding to at least one view of the target view type.

[0051] Specifically, based on the attribute information of the selected layout area as the basic constraint, and combined with the preset layout rules of the target view type, the attribute information corresponding to each view under the target view type is calculated and determined. This attribute information includes the view's position and size within the layout area. Based on the calculated attribute information of each view, the corresponding view is set within the selected layout area. Each view type corresponds to a view size calculation function. According to the type of the target view, the view size calculation function of the target view type is called, and the attribute information of at least one view corresponding to the target view type is calculated based on the view size calculation function. This ensures that each view is arranged in an orderly manner according to the preset position and size, so that the layout area presents a view distribution structure that perfectly matches the target view type. Based on the attribute information of the layout area and the view type rules, precise configuration of the view distribution is achieved, ensuring that the view layout effect within a single layout area is completely consistent with the preset.

[0052] Optionally, the image display page may also include an image list display area, which displays the identifiers of multiple images.

[0053] In this embodiment, the image list display area can be specifically understood as an area on the image display page dedicated to presenting multiple images. This area provides users with a quick entry point for browsing and selecting images. By selecting image identifiers, images can be quickly loaded within the layout area or view. Furthermore, the display state of this area can be independent of updates to the layout area and view, ensuring that the full set of image resources remains accessible even during layout or view adjustments, thus enhancing the convenience of image selection and display.

[0054] Optionally, updating the images displayed in the layout area includes: when the number of views p corresponding to the target view type is less than the number of views q before the update, determining, starting with the selected image, images corresponding to the number of views p from multiple images in the image list display area, and displaying them sequentially in at least one view in the layout area, wherein the display order of the last image and the first image in the multiple images in the image list display area is cyclically connected; when the number of views p corresponding to the target view type is greater than the number of views q before the update, determining a new image from multiple images in the image list display area and displaying it in the new view; or, displaying the image displayed in the set view in the layout area in the new view.

[0055] Specifically, updating the images displayed in the layout area requires considering the relationship between the number of views corresponding to the target view type and the number of views before the update. When the number of target views *p* is less than the number of views *q* before the update, images corresponding to consecutive view counts *p* are retained sequentially, starting from the selected image, and displayed in the view. It should be noted that the image sequence in the image list display area is displayed cyclically; that is, the last image and the first image in the image list display area are displayed sequentially, ensuring that a sufficient number of images can still be quickly matched even when the number of images is insufficient or the selection range exceeds the sequence length.

[0056] The technical solution of this embodiment, by displaying an image display page, the image display page including at least one layout area for displaying at least one image; in response to a first trigger operation on the image display page, a layout type selection area is displayed, the layout type selection area including at least one of a layout type description and a layout diagram; in response to a selection operation of a target layout type, the layout area in the image display page is updated, and the updated image display page includes at least one layout area corresponding to the target layout type; when any of the layout areas is selected, in response to a second trigger operation on the image display page, a view type selection area is displayed, the view type selection area including at least one of a view distribution type description and a view distribution diagram; in response to a selection operation of a target view type, at least one of the view distribution and the image displayed in the layout area is updated. By constructing a two-level structure of global layout and local view, flexible customization and precise control of the image display structure are achieved, as well as flexible switching of view types within the same layout area.

[0057] Based on the above embodiments, an optional example is provided, which can be used in scenarios where multiple images need to be displayed, and the image display layout and view can be adjusted.

[0058] First, the flowchart for adjusting the layout area is as follows: Figure 3As shown, the image display page includes a layout area. When the user performs their first trigger action, clicking the "Layout" button, the layout type selection area is displayed. Based on the user's selected target layout type, the page parses the target layout type, calls the corresponding layout calculation function, and determines the attribute information corresponding to each layout area of ​​the target layout type, i.e., calculating the size and position. The number of layout areas corresponding to the target layout type is compared with the number of layout areas in the original image display page. If the number of layout areas corresponding to the target layout type is less than the number of layout areas in the original image display page (i.e., the number of layout areas decreases), the images displayed in the first n layout areas of the original image display page are retained, and the images displayed in the redundant layout areas are deleted. If the number of layout areas corresponding to the target layout type is greater than the number of layout areas in the original image display page (i.e., the number of layout areas increases), the newly added layout areas are initialized based on the images displayed in the layout areas set in the original image display page, and then re-rendered. For example... Figure 4 The diagram illustrates the layout change, showing how the image display page is adjusted from a single layout to a four-layout layout.

[0059] Secondly, the flowchart for adjusting the view is as follows: Figure 5 As shown, each layout area includes a view, and each view is used to display an image. When any layout area is selected, and the user performs a second trigger operation, in response to the second trigger operation on the image display page, a view type selection area is displayed. The user selects a target view type, and the selected target view type is parsed. Based on the attribute information of the layout area and the calculation function corresponding to the target view type, the attribute information corresponding to the views of the target view type is determined. The change in the number of views corresponding to the target view type compared to the number of views before the update is judged. When the number of views corresponding to the target view type is less than the number of views before the update, that is, when the number of views decreases, the images corresponding to the number of views are determined from the multiple images in the image list display area, starting from the selected image, and are sequentially displayed in at least one view in the layout area; when the number of views corresponding to the target view type is greater than the number of views before the update, that is, when the number of views increases, a new image is determined from the multiple images in the image list display area and displayed in the new view; or, the image displayed by the view set in the layout area is displayed in the new view. Figure 6 The diagram illustrates a view change in any layout, exemplifying how the view type in the first layout area is adjusted from one window to four windows.

[0060] Figure 7This is a schematic diagram of an image display device provided in an embodiment of the present disclosure. This embodiment is applicable to situations where multiple images need to be displayed and the image display layout needs to be flexibly adjusted. The device can be implemented using software and / or hardware, and can be integrated into any device that provides image display functionality, such as… Figure 7 As shown, the image display device specifically includes: an image display page display module 510, a layout type selection area display module 520, and a layout area update module 530.

[0061] Image display page display module 510 is used to display an image display page, the image display page including at least one layout area, the layout area being used to display at least one image; The layout type selection area display module 520 is used to display a layout type selection area in response to a first trigger operation on the image display page. The layout type selection area includes at least one of the following: a description of the layout type and a layout schematic diagram. The layout area update module 530 is used to update the layout area in the image display page in response to the selection operation of the target layout type. The updated image display page includes at least one layout area corresponding to the target layout type.

[0062] The technical solution of this embodiment, by displaying an image display page, including at least one layout area for displaying at least one image, constructs a hierarchical image display framework, achieving decoupled management of layout areas and images, laying the foundation for subsequent flexible layout adjustments and efficient image display. In response to a first trigger operation on the image display page, a layout type selection area is displayed, including at least one of a layout type description and a layout diagram, improving the intuitiveness and decision-making efficiency of layout switching. In response to a selection operation of a target layout type, the layout area in the image display page is updated, and the updated image display page includes at least one layout area corresponding to the target layout type, enabling precise and efficient layout switching and maintaining the continuity and integrity of image display. By selecting a layout type and updating the layout area on the image display page, flexible layout type switching is achieved, ensuring the continuity of image data.

[0063] Based on the above embodiments, optionally, the layout area update module 530 is used to: determine the attribute information corresponding to at least one layout area corresponding to the target layout type, the attribute information including position and size; and set at least one layout area corresponding to the target layout type based on the attribute information corresponding to at least one layout area corresponding to the target layout type.

[0064] Based on the above embodiments, optionally, the layout region update module 530 is further configured to: call the layout calculation function corresponding to the target layout type to determine the attribute information corresponding to at least one layout region corresponding to the target layout type; or, determine the attribute information corresponding to at least one layout region corresponding to the target layout type based on the mapping relationship between layout type and attribute information.

[0065] Optionally, based on the above embodiments, the device further includes an image update module, configured to: update the image displayed in at least one layout area of ​​the image display page; wherein, when the number n of layout areas corresponding to the target layout type is less than the number m of layout areas in the image display page before the update, the images displayed in the first n layout areas of the image display page before the update are retained, or, taking the selected layout area in the image display page before the update as the current layout area, the images displayed in n layout areas starting from the current layout area are retained; when the number n of layout areas corresponding to the target layout type is greater than the number m of layout areas in the image display page before the update, the newly added layout area is initialized based on the images displayed in the set layout areas of the image display page before the update.

[0066] Based on the above embodiments, optionally, each of the layout areas includes at least one view, and each view is used to display an image.

[0067] Optionally, based on the above embodiments, the device further includes a target view type selection module, configured to: when any of the layout areas is selected, in response to a second triggering operation on the image display page, display a view type selection area, the view type selection area including at least one of a description of the view distribution type and a view distribution schematic diagram; and in response to a selection operation of the target view type, update at least one of the view distribution and the image displayed in the layout area.

[0068] Based on the above embodiments, optionally, the target view type selection module is further configured to: determine the attribute information corresponding to at least one view of the target view type according to the attribute information of the layout area; and set at least one view corresponding to the target view type based on the attribute information corresponding to at least one view of the target view type.

[0069] Optionally, based on the above embodiments, the image display page may further include an image list display area, which displays the identifiers of multiple images.

[0070] Based on the above embodiments, optionally, the target view type selection module is further configured to: when the number of views p corresponding to the target view type is less than the number of views q before the update, determine, starting with the selected image, the image corresponding to the number of views p among the multiple images in the image list display area, and sequentially display it in at least one view in the layout area, wherein the display order of the last image and the first image of the multiple images in the image list display area is cyclically connected; when the number of views p corresponding to the target view type is greater than the number of views q before the update, determine a new image among the multiple images in the image list display area and display it in the new view; or, display the image displayed in the set view in the layout area in the new view.

[0071] The above-described products can perform the methods provided in any embodiment of this disclosure, and have the corresponding functional modules and beneficial effects for performing the methods.

[0072] Figure 8 A schematic diagram of an electronic device 10 that can be used to implement embodiments of the present disclosure is shown. The electronic device is intended to represent various forms of digital computers, such as laptop computers, desktop computers, workstations, personal digital assistants, servers, blade servers, mainframe computers, and other suitable computers. The electronic device may also represent various forms of mobile devices, such as personal digital processors, cellular phones, smartphones, wearable devices (such as helmets, glasses, watches, etc.), and other similar computing devices. The components shown herein, their connections and relationships, and their functions are merely illustrative and are not intended to limit the implementation of the present disclosure described and / or claimed herein.

[0073] like Figure 8 As shown, the electronic device 10 includes at least one processor 11 and a memory, such as a read-only memory (ROM) 12 or a random access memory (RAM) 13, communicatively connected to the at least one processor 11. The memory stores computer programs executable by the at least one processor. The processor 11 can perform various appropriate actions and processes based on the computer program stored in the ROM 12 or loaded from storage unit 18 into the RAM 13. The RAM 13 can also store various programs and data required for the operation of the electronic device 10. The processor 11, ROM 12, and RAM 13 are interconnected via a bus 14. An input / output (I / O) interface 15 is also connected to the bus 14.

[0074] Multiple components in electronic device 10 are connected to I / O interface 15, including: input unit 16, such as keyboard, mouse, etc.; output unit 17, such as various types of displays, speakers, etc.; storage unit 18, such as disk, optical disk, etc.; and communication unit 19, such as network card, modem, wireless transceiver, etc. Communication unit 19 allows electronic device 10 to exchange information / data with other devices through computer networks such as the Internet and / or various telecommunications networks.

[0075] Processor 11 can be a variety of general-purpose and / or special-purpose processing components with processing and computing capabilities. Some examples of processor 11 include, but are not limited to, a central processing unit (CPU), a graphics processing unit (GPU), various special-purpose artificial intelligence (AI) computing chips, various processors running machine learning model algorithms, a digital signal processor (DSP), and any suitable processor, controller, microcontroller, etc. Processor 11 performs the various methods and processes described above, such as image display methods.

[0076] In some embodiments, the image display method may be implemented as a computer program tangibly contained in a computer-readable storage medium, such as storage unit 18. In some embodiments, part or all of the computer program may be loaded and / or installed on electronic device 10 via ROM 12 and / or communication unit 19. When the computer program is loaded into RAM 13 and executed by processor 11, one or more steps of the image display method described above may be performed. Alternatively, in other embodiments, processor 11 may be configured to perform the image display method by any other suitable means (e.g., by means of firmware).

[0077] Various embodiments of the systems and techniques described above herein can be implemented in digital electronic circuit systems, integrated circuit systems, field-programmable gate arrays (FPGAs), application-specific integrated circuits (ASICs), application-specific standard products (ASSPs), systems-on-a-chip (SoCs), payload-programmable logic devices (CPLDs), computer hardware, firmware, software, and / or combinations thereof. These various embodiments may include implementations in one or more computer programs that can be executed and / or interpreted on a programmable system including at least one programmable processor, which may be a dedicated or general-purpose programmable processor, capable of receiving data and instructions from a storage system, at least one input device, and at least one output device, and transmitting data and instructions to the storage system, the at least one input device, and the at least one output device.

[0078] Computer programs used to implement the methods of this disclosure may be written in any combination of one or more programming languages. These computer programs may be provided to a processor of a general-purpose computer, a special-purpose computer, or other programmable data processing apparatus, such that when executed by the processor, the computer programs cause the functions / operations specified in the flowcharts and / or block diagrams to be performed. The computer programs may be executed entirely on a machine, partially on a machine, or as a standalone software package, partially on a machine and partially on a remote machine, or entirely on a remote machine or server.

[0079] In the context of this disclosure, a computer-readable storage medium can be a tangible medium that may contain or store a computer program for use by or in conjunction with an instruction execution system, apparatus, or device. A computer-readable storage medium can be, but is not limited to, electronic, magnetic, optical, electromagnetic, infrared, or semiconductor systems, apparatus, or devices, or any suitable combination of the foregoing. Alternatively, a computer-readable storage medium can be a machine-readable signal medium. More specific examples of machine-readable storage media include electrical connections based on one or more wires, portable computer disks, hard disks, 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 devices, magnetic storage devices, or any suitable combination of the foregoing.

[0080] To provide interaction with a user, the systems and techniques described herein can be implemented on an electronic device having: a display device (e.g., a CRT (cathode ray tube) or LCD (liquid crystal display) monitor) for displaying information to the user; and a keyboard and pointing device (e.g., a mouse or trackball) through which the user provides input to the electronic device. Other types of devices can also be used to provide interaction with the user; for example, feedback provided to the user can be any form of sensory feedback (e.g., visual feedback, auditory feedback, or tactile feedback); and input from the user can be received in any form (including sound input, voice input, or tactile input).

[0081] The systems and technologies described herein can be implemented in computing systems that include backend components (e.g., as data servers), or middleware components (e.g., application servers), or frontend components (e.g., user computers with graphical user interfaces or web browsers through which users can interact with implementations of the systems and technologies described herein), or any combination of such backend, middleware, or frontend components. The components of the system can be interconnected via digital data communication of any form or medium (e.g., communication networks). Examples of communication networks include local area networks (LANs), wide area networks (WANs), blockchain networks, and the Internet.

[0082] A computing system can include clients and servers. Clients and servers are generally located far apart and typically interact through communication networks. The client-server relationship is created by computer programs running on the respective computers and having a client-server relationship with each other. The server can be a cloud server, also known as a cloud computing server or cloud host, which is a hosting product within the cloud computing service system to address the shortcomings of traditional physical hosts and VPS services, such as high management difficulty and weak business scalability.

[0083] It should be understood that the various forms of processes shown above can be used to rearrange, add, or delete steps. For example, the steps described in this disclosure can be executed in parallel, sequentially, or in different orders, as long as the desired result of the technical solution of this disclosure can be achieved, and this is not limited herein.

[0084] This disclosure also provides a computer program product, including a computer program that, when executed by a processor, implements the image display method according to any embodiment of this disclosure.

[0085] In implementing a computer program product, computer program code for performing the operations of this disclosure can be written in one or more programming languages ​​or a combination thereof. Programming languages ​​include object-oriented programming languages ​​such as Java, Smalltalk, and C++, as well as conventional procedural programming languages ​​such as C or similar languages. The program code can be executed entirely on the user's computer, partially on the user's computer, as a standalone software package, partially on the user's computer and partially on a remote computer, or entirely on a remote computer or server. In cases involving remote computers, the remote computer can be connected to the user's computer via any type of network—including a local area network (LAN) or a wide area network (WAN)—or can be connected to an external computer (e.g., via the Internet using an Internet service provider).

[0086] The specific embodiments described above do not constitute a limitation on the scope of protection of this disclosure. Those skilled in the art should understand that various modifications, combinations, sub-combinations, and substitutions can be made according to design requirements and other factors. Any modifications, equivalent substitutions, and improvements made within the spirit and principles of this disclosure should be included within the scope of protection of this disclosure.

Claims

1. An image display method, characterized in that, include: An image display page is provided, which includes at least one layout area for displaying at least one image. In response to a first triggering operation on the image display page, a layout type selection area is displayed, the layout type selection area including at least one of a description of the layout type and a layout illustration; In response to the selection operation of the target layout type, the layout area in the image display page is updated, and the updated image display page includes at least one layout area corresponding to the target layout type.

2. The method according to claim 1, characterized in that, Update the layout area in the image display page, including: Determine the attribute information corresponding to at least one layout region of the target layout type, wherein the attribute information includes position and size; Based on the attribute information corresponding to at least one layout region of the target layout type, set at least one layout region corresponding to the target layout type.

3. The method according to claim 2, characterized in that, Determine the attribute information corresponding to at least one layout region of the target layout type, including: Call the layout calculation function corresponding to the target layout type to determine the attribute information corresponding to at least one layout region of the target layout type; or... Based on the mapping relationship between layout type and attribute information, the attribute information corresponding to at least one layout region corresponding to the target layout type is determined.

4. The method according to claim 1 or 2, characterized in that, The method further includes: Update the image displayed in at least one layout area of ​​the image display page; Wherein, if the number of layout regions n corresponding to the target layout type is less than the number of layout regions m in the image display page before the update, the images displayed in the first n layout regions in the image display page before the update are retained, or, the selected layout region in the image display page before the update is taken as the current layout region, and the images displayed in the n layout regions starting from the current layout region are retained. If the number of layout regions n corresponding to the target layout type is greater than the number of layout regions m in the image display page before the update, the newly added layout regions are initialized based on the images displayed in the set layout regions in the image display page before the update.

5. The method according to claim 1, characterized in that, Each of the layout areas includes at least one view, and each view is used to display an image; The method further includes: When any of the layout areas is selected, in response to a second triggering operation on the image display page, a view type selection area is displayed, the view type selection area including at least one of a description of the view distribution type and a view distribution diagram; In response to a selection operation on a target view type, at least one of the view distribution in the layout area and the image displayed by the view is updated.

6. The method according to claim 5, characterized in that, Updating the view distribution in the layout area includes: Based on the attribute information of the layout area, determine the attribute information corresponding to at least one view of the target view type; Based on the attribute information corresponding to at least one view of the target view type, set at least one view corresponding to the target view type.

7. The method according to claim 4, characterized in that, The image display page also includes an image list display area, which displays the identifiers of multiple images; Update the image displayed in the view within the layout area, including: When the number of views p corresponding to the target view type is less than the number of views q before the update, among the multiple images in the image list display area, starting from the selected image, the image corresponding to the number of views p is determined and displayed in at least one view in the layout area in sequence, wherein the display order of the last image and the first image of the multiple images in the image list display area is cyclically connected. If the number of views p corresponding to the target view type is greater than the number of views q before the update, a new image is determined from the multiple images in the image list display area and displayed in the new view; or, the image displayed by the set view in the layout area is displayed in the new view.

8. An image display device, characterized in that, include: An image display page module is used to display an image display page, which includes at least one layout area for displaying at least one image. A layout type selection area display module is used to display a layout type selection area in response to a first trigger operation on the image display page. The layout type selection area includes at least one of the following: a description of the layout type and a layout illustration. The layout area update module is used to update the layout area in the image display page in response to the selection operation of the target layout type. The updated image display page includes at least one layout area corresponding to the target layout type.

9. An electronic device, characterized in that, The electronic device includes: At least one processor; and A memory communicatively connected to the at least one processor; wherein, The memory stores a computer program that can be executed by the at least one processor, the computer program being executed by the at least one processor to enable the at least one processor to perform the image display method according to any one of claims 1-7.

10. A computer-readable storage medium, characterized in that, The computer-readable storage medium stores computer instructions that cause a processor to execute the image display method according to any one of claims 1-7.

11. A computer program product, characterized in that, The computer program product includes a computer program that, when executed by a processor, implements the image display method according to any one of claims 1-7.