Method, device, equipment and product for displaying image

Abstract

The invention relates to a method, a device, equipment and a product for displaying an image. The method includes acquiring a second image, the second image generated based on the first image, the second image including a first portion corresponding to the first image and a second portion generated by expanding the first portion. The method further includes setting a second region in the first region based on an aspect ratio of the first region in the user interface and an aspect ratio of the first image. The method further includes displaying at least a portion of the second image in the first area, the first portion of the second image being completely displayed in the second area.

Description

Technical Field

[0001] This disclosure relates to the field of image processing, and more specifically to methods, apparatus, devices and products for displaying images. Background Technology

[0002] With the widespread adoption of mobile internet and smart devices, more and more users are accessing information through electronic devices. To improve the efficiency of information transmission, electronic devices typically support the display of information in multiple formats. Images, due to their stronger visual expressiveness, can achieve a more intuitive expressive effect, helping users quickly understand key information and are widely used in various scenarios. At the same time, with the continuous development of display technology, the types of electronic devices are constantly increasing, and product forms are continuously evolving, leading users to place increasingly higher demands on the image display effects of these devices. Summary of the Invention

[0003] In a first aspect of the embodiments of this disclosure, a method for displaying an image is provided. The method includes acquiring a second image, the second image being generated based on a first image, the second image including a first portion corresponding to the first image and a second portion generated by extending the first portion. The method further includes setting a second region within the first region based on the aspect ratio of a first region in a user interface and the aspect ratio of the first image. The method also includes displaying at least a portion of the second image in the first region, wherein the first portion of the second image is fully displayed in the second region. In a second aspect of the embodiments of this disclosure, an apparatus for displaying an image is provided. The apparatus includes an image acquisition module configured to acquire a second image generated based on a first image, the second image including a first portion corresponding to the first image and a second portion generated by extending the first portion. The apparatus also includes a region setting module configured to set a second region within the first region based on the aspect ratio of a first region in a user interface and the aspect ratio of the first image. The apparatus further includes an image display module configured to display at least a portion of the second image in the first region, wherein the first portion of the second image is fully displayed in the second region.

[0004] In a third aspect of the embodiments of this disclosure, an electronic device is provided. The electronic device includes one or more processors; and a storage device for storing one or more programs, which, when executed by the one or more processors, cause the one or more processors to implement a method for displaying an image. The method includes acquiring a second image, the second image being generated based on a first image, the second image including a first portion corresponding to the first image and a second portion generated by extending the first portion. The method further includes setting a second region within the first region based on the aspect ratio of a first region in a user interface and the aspect ratio of the first image. The method further includes displaying at least a portion of the second image in the first region, the first portion of the second image being fully displayed in the second region.

[0005] In a fourth aspect of the embodiments of this disclosure, a computer program product is provided. The computer program product is tangibly stored on a non-transitory computer-readable medium and includes machine-executable instructions that, when executed, cause a machine to implement a method for displaying an image. The method includes acquiring a second image, the second image being generated based on a first image, the second image including a first portion corresponding to the first image and a second portion generated by extending the first portion. The method also includes setting a second region within the first region based on the aspect ratio of a first region in a user interface and the aspect ratio of the first image. The method further includes displaying at least a portion of the second image in the first region, the first portion of the second image being fully displayed in the second region.

[0006] The summary section is provided to present the chosen concepts in a simplified form, which will be further described in the detailed description below. The summary section is not intended to identify key or principal features of the claimed subject matter, nor is it intended to limit the scope of the claimed subject matter. Attached Figure Description

[0007] The above and other features, advantages, and aspects of the embodiments of this disclosure will become more apparent from the accompanying drawings and the following detailed description. In the drawings, the same or similar reference numerals denote the same or similar elements, wherein:

[0008] Figure 1 A schematic diagram of an example environment in which several embodiments of the present disclosure may be implemented is shown;

[0009] Figure 2 A flowchart of a method for displaying an image according to some embodiments of the present disclosure is shown;

[0010] Figure 3 A flowchart illustrating the generation of an expanded image from an original image according to some embodiments of the present disclosure is shown;

[0011] Figure 4 A flowchart illustrating the verification of image matching accuracy according to some embodiments of the present disclosure is shown;

[0012] Figure 5 A schematic diagram illustrating the determination of a subject region according to some embodiments of the present disclosure is shown;

[0013] Figure 6 A schematic diagram illustrating the determination of the main body region according to other embodiments of this disclosure is shown;

[0014] Figure 7 A schematic diagram illustrating the determination of a subject region according to yet another embodiment of the present disclosure is shown;

[0015] Figure 8 A schematic diagram illustrating the determination of a subject region according to yet another embodiment of the present disclosure is shown;

[0016] Figure 9 A schematic diagram showing an expanded image according to some embodiments of the present disclosure is shown;

[0017] Figure 10 A block diagram of an apparatus for displaying images according to some embodiments of the present disclosure is shown;

[0018] Figure 11 A block diagram of a device capable of implementing several embodiments of the present disclosure is shown. Detailed Implementation

[0019] It is understood that all user-related data involved in this technical solution should be obtained and used only after authorization from the user. This means that if it is necessary to use a user's personal information in this technical solution, the user's explicit consent and authorization are required before obtaining this data; otherwise, no related data collection and use will be carried out. It should also be understood that when implementing this technical solution, relevant laws and regulations should be strictly followed in the process of data collection, use, and storage, and necessary technical measures should be taken to protect user data security and ensure the secure use of data.

[0020] Embodiments of this disclosure will now be described in more detail with reference to the accompanying drawings. While some embodiments of this disclosure are shown in the drawings, it should be understood that this disclosure can be implemented in various forms and should not be construed as limited to the embodiments set forth herein. Rather, these embodiments are provided to provide a more thorough and complete understanding of this disclosure. It should be understood that the accompanying drawings and embodiments of this disclosure are for illustrative purposes only and are not intended to limit the scope of protection of this disclosure.

[0021] In the description of embodiments of this disclosure, the term "comprising" and similar terms should be understood as open-ended inclusion, i.e., "including but not limited to". The term "based on" should be understood as "at least partially based on". The term "one embodiment" or "the embodiment" should be understood as "at least one embodiment". The terms "first", "second", etc., may refer to different or the same objects unless explicitly stated. Other explicit and implicit definitions may also be included below.

[0022] As mentioned above, with the widespread adoption of mobile internet and smart terminals, more and more users are accessing information through electronic devices. To improve the efficiency of information transmission, electronic devices typically support the display of information in multiple formats. Images, due to their stronger visual expressiveness, can achieve a more intuitive expressive effect, helping users quickly understand key information and are widely used in various scenarios. At the same time, with the continuous development of display technology, the types of electronic devices are constantly increasing, product forms are continuously evolving, and users are placing increasingly higher demands on the image display effects of these devices.

[0023] In practical applications, electronic devices can display image content provided by servers or other devices. For example, in social media scenarios, electronic devices can display user-posted images on news feed pages. In news and information scenarios, electronic devices can display cover images or illustrations provided by content providers on article pages. In e-commerce scenarios, electronic devices can display product images provided by merchants on product detail pages. However, different electronic devices have different screen sizes, and the layout relationship between different displayed content in the user interface can also affect the display range of images. Therefore, to adapt to the display needs of different scenarios, electronic devices usually need to scale images proportionally. When the aspect ratio of the image differs from the aspect ratio of the available image area, the proportionally scaled image may not completely cover the display area, resulting in parts of the display area that are not filled by image content, affecting the overall visual experience of the page.

[0024] In some related technologies, electronic devices can perform padding processing on portions of the display area that are not filled with image content. For example, the electronic device can mirror and expand the edge regions of an image to generate an expanded image for filling. Then, the electronic device can blur the expanded image and display the blurred image in the areas not filled with image content. While this method can meet the requirement of complete image display to some extent, the overall visual effect is poor due to the low degree of integration between the blurred area and the main image. Therefore, embodiments of this disclosure propose a scheme for displaying an image. In this scheme, a processing device can acquire a second image, which is generated based on a first image. The second image includes a first portion corresponding to the first image and a second portion generated by extending the first portion. Then, the processing device can set a second region within the first region based on the aspect ratio of a first region in the user interface and the aspect ratio of the first image. The processing device can then display at least a portion of the second image in the first region, with the first portion of the second image being fully displayed in the second region. In this way, the first part of the second image can be fully displayed in the second area, thereby reducing the cropping or obscuring of the core content of the image during display adaptation. Furthermore, by filling the blank areas in the first area with expanded image content generated based on the first image, the display integrity of the user interface and the overall consistency of the image content can be improved, enhancing the user's browsing experience and increasing the versatility of the same image content across different display devices and scenarios.

[0025] Figure 1 A schematic diagram of an example environment 100 in which various embodiments of this disclosure may be implemented is shown. For example... Figure 1 As shown, environment 100 includes processing device 110. Processing device 110 can be any device with processing or computing capabilities. For example, processing device 110 can include smartphones, tablet computers, laptop computers, desktop computers, workstations, or smart wearable devices. Processing device 110 may have display capabilities and can be used to display image content.

[0026] In environment 100, processing device 110 can acquire an expanded image 102 (also referred to herein as a second image), which is generated based on the original image 104 (also referred to herein as a first image). The expanded image 102 includes an original image portion 106 (also referred to herein as a first portion) corresponding to the original image 104 and an expanded portion 108 (also referred to herein as a second portion) generated by expanding the original image portion 106. In some embodiments, the expanded image 102 may be an image generated by expanding the original image 104, where the content of the original image portion 106 in the expanded image 102 may be the same as that of the original image 104, and the expanded portion 108 in the expanded image 102 may be generated by expanding the original image portion 106. In some embodiments, a server may use an image generation model to perform an expanded image operation on the original image 104 to generate the expanded image 102. The processing device 110 can then receive the expanded image 102 from the server. In other embodiments, the expanded image 102 may be generated by the processing device 110.

[0027] In environment 100, processing device 110 can set the main body region 116 (also referred to herein as a second region) within the image available region 114 based on the aspect ratio of the image available region 114 (also referred to herein as a first region or image available region) in user interface 112 and the aspect ratio of the original image 104. User interface 112 is used to present image content to a user. User interface 112 includes image available region 114, which is a display area for displaying an image, wherein image available region 114 includes the main body region 116. In some embodiments, the size and aspect ratio of the image available region 114 in user interface 112 are associated with the device type of processing device 110. In some embodiments, the processing device 110 may determine the size of the main body region 116 based on the aspect ratio of the image available area 114 in the user interface 112 and the aspect ratio of the original image 104, so that the aspect ratio of the main body region 116 is consistent with the aspect ratio of the original image 104, and the main body region 116 occupies the largest possible area within the image available area 114, thereby achieving the setting of the main body region 116.

[0028] In environment 100, processing device 110 can display at least a portion of the expanded image 102 in image available area 114, wherein the original image portion 106 of the expanded image 102 is fully displayed in main area 116. In some embodiments, other portions of the expanded image 102 besides the original image portion 106 can be at least partially displayed in the image available area 114 outside of the main area 116.

[0029] In this way, the original image portion 106 of the expanded image 102 can be fully displayed in the main area 116, thereby reducing the cropping or obscuring of the core content of the image during display adaptation. Furthermore, by filling the blank areas in the available image area 114 with the expanded image content generated based on the original image 104, the display integrity of the user interface and the overall coordination of the image content can be improved, enhancing the user's browsing experience and increasing the versatility of the same image content across different display devices and scenarios.

[0030] Figure 2 A flowchart of a method 200 for displaying an image according to some embodiments of the present disclosure is shown. Method 200 can be performed by a processing device. For example, method 200 can be performed by… Figure 1 The processing device 110 in the middle performs the operation. For example... Figure 2 As shown, in block 202, the processing device can acquire a second image, which is generated based on the first image. The second image includes a first portion corresponding to the first image and a second portion generated by extending the first portion. For example, in... Figure 1In the illustrated environment 100, the processing device 110 can acquire an expanded image 102, which is generated based on the original image 104. The expanded image 102 includes an original image portion 106 corresponding to the original image 104 and an expanded portion 108 generated by expanding the original image portion 106. For example, the expanded image 102 may be an image generated by expanding the original image 104. In some embodiments, the content displayed by the original image portion 106 in the expanded image 102 may be the same as that of the original image 104, while the expanded portion 108 in the expanded image 102 may be generated by expanding the original image portion 106. In some embodiments, the server may use an image generation model to perform an expanded image operation on the original image 104 to generate the expanded image 102. The processing device 110 can then receive the expanded image 102 from the server. In other embodiments, the expanded image 102 may be generated by the processing device 110.

[0031] In box 204, the processing device can set a second region within the first region based on the aspect ratio of the first region in the user interface and the aspect ratio of the first image. For example, in... Figure 1 In the illustrated environment 100, the processing device 110 can set the main body region 116 within the image available area 114 based on the aspect ratio of the image available area 114 in the user interface 112 and the aspect ratio of the original image 104. The user interface 112 is a display interface for presenting image content to a user. The user interface 112 includes the image available area 114, which is a display area for displaying an image. The image available area 114 includes the main body region 116. In some embodiments, the aspect ratio of the image available area 114 in the user interface 112 is associated with the device type of the processing device 110. In some embodiments, the processing device 110 can determine the size of the main body region 116 based on the aspect ratio of the image available area 114 in the user interface 112 and the aspect ratio of the original image 104, ensuring that the aspect ratio of the main body region 116 is consistent with that of the original image 104, and that the main body region 116 occupies the largest possible area within the image available area 114, thereby setting the main body region 116.

[0032] In box 206, the processing device can display at least a portion of the second image in the first area, wherein the first portion of the second image is fully displayed in the second area. For example, in... Figure 1 In the illustrated environment 100, the processing device 110 can display at least a portion of the expanded image 102 in the image available area 114, where the original image portion 106 of the expanded image 102 is fully displayed in the main body area 116. In some embodiments, other portions of the expanded image 102 besides the original image portion 106 can be at least partially displayed in the image available area 114 outside the main body area 116.

[0033] In this way, the first part of the second image can be fully displayed in the second area, thereby reducing the cropping or obscuring of the core content of the image during display adaptation. Furthermore, by filling the blank areas in the first area with expanded image content generated based on the first image, the display integrity of the user interface and the overall consistency of the image content can be improved, enhancing the user's browsing experience and increasing the versatility of the same image content across different display devices and scenarios.

[0034] As mentioned earlier, the expanded image is generated based on the original image. In some embodiments, the expanded image can be generated and provided by the server. The process of the server generating the expanded image based on the original image will be described below.

[0035] Figure 3 A flowchart illustrating the generation of an expanded image from an original image according to some embodiments of the present disclosure is shown. The process 300 of generating the expanded image from the original image can be executed by a server. Figure 3 As shown in box 302, the server can obtain the original image. As mentioned earlier, the original image can be an image provided by the server or other devices. In some implementations, the aspect ratio of the original image is a preset fixed value, for example, 1:1.

[0036] In box 304, the server can expand the original image using an image generation model. In some embodiments, the server can use the image generation model to generate an expanded image of the original image. As mentioned earlier, the expanded image includes a first part corresponding to the original image and a second part generated by expanding the first part. In some embodiments, the expanded image can be generated based on the content of the original image by expanding the original image to the left, right, and top. This reduces the probability of the expanded area interfering with the main content when the main content of the image is relatively concentrated, and improves the overall visual harmony of the generated content. In some embodiments, the expanded image can be generated by expanding the original image based on a preset ratio. For example, the expanded image can be generated by expanding the original image vertically by a first preset ratio and horizontally by a second preset ratio. The first and second preset ratios can be, for example, 1.33 times. Furthermore, when expanding the original image horizontally, it can be expanded uniformly to the left and right, using the image center of the original image as a reference. In addition, the expanded image can also be an image generated by expanding the original image with an aspect ratio that meets preset requirements. The aspect ratio of the expanded image can be, for example, 4:3. This allows for the generation of expanded images with similar specifications, reducing the complexity of the expanded image generation and processing process.

[0037] In box 306, the server can filter the expanded images based on product standards. In some embodiments, the server can detect the expanded images based on preset product standards and filter out those with quality defects. Product standards can be used to characterize image quality requirements. For example, product standards may include image sharpness, content integrity, or visual consistency.

[0038] In box 308, the server can perform sampling review of the expanded images. In some embodiments, the server can execute the processing flow shown in boxes 302 to 306 multiple times for different original images to obtain multiple expanded images. Then, the server can perform batch sampling review of the multiple expanded images.

[0039] In box 310, if the expanded image passes the sampling review, the server can use the expanded image for subsequent processing. In some embodiments, the server can store the expanded images that have passed the sampling review. In some embodiments, when multiple expanded images are provided to the product for sampling review, if the sampling review results show that the usability of the multiple expanded images reaches a preset standard, the server can use the multiple expanded images for subsequent processing. Thus, the server can generate expanded images based on the original image, thereby providing a basis for subsequent image display.

[0040] In some implementations, the expanded image is verified by the server to match the original image. The following will use the server as an example to explain the process of verifying the match between the expanded image and the original image. Figure 4 A flowchart illustrating the verification of image matching accuracy according to some embodiments of this disclosure is shown. The image matching accuracy verification process 400 can be performed by a server. For example... Figure 4 As shown in box 402, the server can generate an expanded image offline based on the original image. In some embodiments, the server can first acquire expanded image materials, which may include, for example, the original image and material data related to image expansion. Then, the server can perform an offline data integration task based on the expanded image materials to generate an expanded image corresponding to the original image. In some embodiments, the server can perform the offline data integration task in a batch processing manner in an offline environment. For example, the server can batch process the expanded image materials in an offline environment according to a preset time period (e.g., a daily period). In some embodiments, the server can generate the expanded image based on artificial intelligence technology.

[0041] At box 404, the server can receive data requests from the irregularly shaped card. In some embodiments, the irregularly shaped card can be a display card for information display, used to present preset display content in a user interface. The display content may include, for example, images, text, or other information elements. In some embodiments, the size and proportion of the available area corresponding to different display content in the irregularly shaped card may be associated with the model of the processing device, and may also be associated with the layout relationship between the various display contents.

[0042] In response to receiving a data request from a non-standard card, at box 406, the server may request an expanded image. At box 408, the server may request the original image. In some embodiments, the original image may be pre-stored on the server, or it may be read by the server from other devices or storage units. The expanded image may be generated offline by the server based on the original image and stored for use in subsequent processing.

[0043] In box 410, the server can verify whether the expanded image matches the original image. Since the original image may be updated or replaced, the matching verification can confirm the consistency between the expanded image and the original image.

[0044] In response to determining that the expanded image matches the original image, in box 412, the server can replace the original image with the expanded image. For example, the server can replace the original image in the irregular card data with the expanded image as the display image.

[0045] In box 414, the server can perform the distribution of irregularly shaped card data. The irregularly shaped card data may include an expanded image. In some embodiments, the server can send the irregularly shaped card data to the device that initiated the irregularly shaped card data request. Thus, in response to the irregularly shaped card data request, the server can perform a matching degree verification between the expanded image and the original image, and distribute the verified expanded image.

[0046] After acquiring the expanded image generated based on the original image, the processing device can determine the subject region within the available image region based on the aspect ratio of the available image region in the user interface and the aspect ratio of the original image. In some embodiments, the processing device can determine the width or height of the subject region based on the aspect ratio of the available image region and the aspect ratio of the original image, and further determine the subject region within the available image region based on the width or height of the subject region and the aspect ratio of the original image.

[0047] The following example uses an original image with an aspect ratio of 1:1 and an expanded image to an original image with a size ratio of 3:4. Figures 5 to 8The schematic diagram illustrates the process of determining the subject region. It is understood that this disclosure does not limit the aspect ratio of the original image and the expanded image, nor the size ratio of the expanded image to the original image; the above example is merely used to illustrate one implementation method for determining the subject region.

[0048] Figure 5 A schematic diagram illustrating the determination of a subject region according to some embodiments of the present disclosure is shown. This schematic diagram corresponds to a case where the aspect ratio of the usable area of ​​the image is smaller than the size ratio of the expanded image to the original image, and smaller than the aspect ratio of the original image. For example, when the aspect ratio of the original image is 1:1 and the size ratio of the expanded image to the original image is 3:4, Figure 5 This corresponds to cases where the aspect ratio of the usable area of ​​the image is less than 3:4.

[0049] like Figure 5 As shown, screen 500 can display user interface 510. User interface 510 may include a top overlay 502, an image availability area 504, and an object information area 506. The top overlay 502 may be located at the top of user interface 510 and is used to display interface elements such as navigation bars, function buttons, or status information. The image availability area 504 may be located below the top overlay 502 and is used to display image content. The object information area 506 may be located below the image availability area 504 and is used to display information related to the object corresponding to the content displayed in the image availability area 504. Object-related information may include, for example, the object's name, specifications, or other descriptive information.

[0050] When the aspect ratio of the usable image region 504 is smaller than that of the original image (e.g., the aspect ratio of the original image is 1 and the aspect ratio of the usable image region 504 is less than 1), the processing device can determine the width of the main body region 508 as the width of the usable image region 504, meaning the main body region 508 has the same width as the usable image region 504. Alternatively, in some embodiments, the processing device can determine the aspect ratio of the original image as the aspect ratio of the main body region 508. For example, if the aspect ratio of the original image is 1:1, the processing device can determine the aspect ratio of the main body region 508 as 1:1. Thus, the processing device can determine the size of the image view based on the width and aspect ratio of the main body region 508. Furthermore, the processing device can also determine the main body region 508 by aligning the bottom of the main body region 508 with the bottom of the usable image region. For example, the processing device can position the bottom of the main body region 508 on the same horizontal line as the bottom of the usable image region, and position the main body region 508 at the center of the usable image region 504 in the horizontal direction. Thus, the processing device can determine the position of the main area 508 in the image available area 504.

[0051] In some embodiments, when the aspect ratio of the available image area 504 is smaller than the size ratio of the expanded image to the original image, the height of the expanded image may be smaller than the height of the main body area 508 when the expanded image is displayed in the available image area 504, resulting in a blank space at the top of the main body area 508. In this case, the processing device can expand the coverage area of ​​the top overlay 502 so that the top overlay 502 covers the blank area, thereby maintaining the continuity and consistency of the overall display of the user interface 510.

[0052] Since the aspect ratio of the usable image area 504 is smaller than that of the original image, when the width of the main body area 508 is set to the width of the usable image area 504, and the aspect ratio of the original image is set to the aspect ratio of the main body area 508, the height of the main body area 508 is smaller than the height of the usable image area 504. This ensures that the main body area 508 falls completely within the boundary of the usable image area 504, does not exceed its range, and occupies as large an area as possible. Furthermore, since the aspect ratio of the main body area 508 is the same as that of the original image, when the original image is subsequently displayed based on the main body area 508, the image can maintain its original proportions without distortion.

[0053] Figure 6 A schematic diagram illustrating the determination of a subject region according to some embodiments of the present disclosure is shown. This schematic diagram corresponds to a case where the aspect ratio of the usable area of ​​the image is greater than or equal to the size ratio of the expanded image to the original image, and less than the aspect ratio of the original image. For example, when the aspect ratio of the original image is 1:1 and the size ratio of the expanded image to the original image is 3:4, Figure 6 This corresponds to the case where the aspect ratio of the usable area of ​​the image is greater than or equal to 3:4 and less than 1:1.

[0054] like Figure 6 As shown, screen 600 can display user interface 610. User interface 610 may include a top overlay 602, an image availability area 604, and an object information area 606. For a description of the top overlay 602, the image availability area 604, and the object information area 606, please refer to the relevant descriptions of the top overlay 502, the image availability area 504, and the object information area 506 in the foregoing embodiments, which will not be repeated here.

[0055] When the aspect ratio of the usable image region 604 is smaller than that of the original image (e.g., the aspect ratio of the original image is 1 and the aspect ratio of the usable image region 604 is less than 1), the processing device can determine the size of the main body region 608 and its position within the usable image region 604 based on the width and aspect ratio of the main body region 608. For the method by which the processing device determines the size of the main body region 608 and its position within the usable image region 604, please refer to the description of the processing device determining the position of the main body region 508 within the usable image region 504 in the foregoing embodiments; it will not be repeated here.

[0056] Figure 7 A schematic diagram illustrating the determination of a subject region according to some embodiments of the present disclosure is shown. This schematic diagram corresponds to the case where the aspect ratio of the usable area of ​​the image is equal to the aspect ratio of the original image. For example, when the aspect ratio of the original image is 1:1 and the size ratio of the expanded image to the original image is 3:4, Figure 7 This corresponds to the case where the aspect ratio of the usable area of ​​the image is equal to 1:1.

[0057] like Figure 7 As shown, screen 700 can display user interface 710. User interface 710 may include a top overlay 702, an image availability area 704, and an object information area 706. For a description of the top overlay 702, the image availability area 704, and the object information area 706, please refer to the relevant descriptions of the top overlay 502, the image availability area 504, and the object information area 506 in the foregoing embodiments, which will not be repeated here.

[0058] When the aspect ratio of the available image region 704 is equal to that of the original image (for example, the aspect ratio of the original image and the aspect ratio of the available image region 704 are both 1), the processing device can determine the height of the main body region 708 as the height of the available image region 704 and the width of the main body region 708 as the width of the available image region 704. That is, the main body region 708 and the available image region 704 are the same size, and the main body region 708 completely covers the available image region 704.

[0059] Figure 8 A schematic diagram illustrating the determination of a subject region according to some embodiments of the present disclosure is shown. This schematic diagram corresponds to a case where the aspect ratio of the usable area of ​​the image is greater than that of the original image. For example, when the aspect ratio of the original image is 1:1 and the size ratio of the expanded image to the original image is 3:4, Figure 8 This corresponds to the case where the aspect ratio of the usable area of ​​the image is greater than 1:1.

[0060] like Figure 8As shown, screen 800 can display user interface 810. User interface 810 may include a top overlay 802, an image availability area 804, and an object information area 806. For a description of the top overlay 802, the image availability area 804, and the object information area 806, please refer to the relevant descriptions of the top overlay 502, the image availability area 504, and the object information area 506 in the foregoing embodiments, which will not be repeated here.

[0061] When the aspect ratio of the usable image region 804 is greater than that of the original image (e.g., the aspect ratio of the original image is 1 and the aspect ratio of the usable image region 804 is greater than 1), the processing device can determine the height of the main body region 808 as the height of the usable image region 804, that is, the main body region 808 and the usable image region 804 have the same height. In addition, in some embodiments, the processing device can determine the aspect ratio of the original image as the aspect ratio of the main body region 808. For example, when the aspect ratio of the original image is 1:1, the processing device can determine the aspect ratio of the main body region 808 as 1:1. Thus, the processing device can determine the size of the main body region 808 based on its height and aspect ratio. Furthermore, the processing device can also determine the main body region 808 by aligning the bottom of the main body region 808 with the bottom of the usable image region 804. For example, the processing device can position the bottom of the main body region 808 and the bottom of the usable image region 804 on the same horizontal line, and position the main body region 808 at the center of the usable image region 804 in the horizontal direction. Thus, the processing device can determine the position of the main body region 808 within the image available region 804.

[0062] Since the aspect ratio of the usable image area 804 is greater than that of the original image, when the height of the main body area 808 is set to the height of the usable image area 804, and the aspect ratio of the original image is set to the aspect ratio of the main body area 808, the width of the main body area 808 must be smaller than the width of the usable image area 804. This ensures that the main body area 808 falls completely within the boundary of the usable image area 804, does not exceed its range, and occupies as large an area as possible. Furthermore, since the aspect ratio of the main body area 808 is the same as that of the original image, when the original image is subsequently displayed based on the main body area 808, the image can maintain its original proportions without distortion.

[0063] In this way, the processing device can determine the main area according to different situations, providing a basis for subsequent image display based on the main area.

[0064] In some embodiments, the processing device may display at least a portion of the expanded image in the image available area, while the original portion of the expanded image is fully displayed in the main area. Figure 9 A schematic diagram showing an expanded image according to some embodiments of the present disclosure is illustrated. For example... Figure 9 As shown, screen 900 can display user interface 910. User interface 910 may include a top overlay 902, an extension portion 904, an original image portion 906, and an object information area 908. The extension portion 904 fills the space between the top overlay 902 and the original image portion 906. Therefore, the original image portion 906 can be fully displayed in user interface 910, and the area between the top overlay 902 and the original image portion 906 can be filled based on the extension portion 904, thereby reducing blank spaces caused by mismatched display ratios, maintaining the display integrity of user interface 910 and the overall harmony of image content, and improving the user's browsing experience.

[0065] Figure 10 A block diagram of an apparatus 1000 for displaying images according to some embodiments of the present disclosure is shown. Figure 10 As shown, the device 1000 includes an image acquisition module 1002 configured to acquire a second image, which is generated based on a first image. The second image includes a first portion corresponding to the first image and a second portion generated by extending the first portion. The device 1000 also includes a region setting module 1004 configured to set a second region within the first region based on the aspect ratio of a first region in the user interface and the aspect ratio of the first image. The device 1000 also includes an image display module 1006 configured to display at least a portion of the second image in the first region, wherein the first portion of the second image is fully displayed in the second region.

[0066] In some embodiments, the region setting module 1004 includes: a region width and height determination module, configured to determine the width or height of a second region based on the aspect ratio of a first region and the aspect ratio of a first image; and a region setting module, configured to set the second region in the first region based on the width or height of the second region and the aspect ratio of the first image.

[0067] In some embodiments, the region width and height determination module includes: a height determination module configured to determine the height of the first region as the height of the second region in response to the aspect ratio of the first region being greater than or equal to the aspect ratio of the first image; and a width determination module configured to determine the width of the first region as the width of the second region in response to the aspect ratio of the first region being less than the aspect ratio of the first image.

[0068] In some embodiments, the region setting module includes: an aspect ratio determination module configured to determine the aspect ratio of the first image as the aspect ratio of the second region; and a region alignment module configured to align the bottom of the second region with the bottom of the first region.

[0069] In some embodiments, the user interface further includes a third region, the bottom of which is adjacent to the top of the first region, and the device 1000 further includes a region occlusion module configured to cause the third region to occlude a third portion of the second image in response to the third portion of the second portion extending beyond the top of the first region.

[0070] In some embodiments, the second image is generated based on the content of the first image by expanding the first image to the left, right and top.

[0071] In some embodiments, the second image is generated by expanding the first image based on a preset ratio.

[0072] In some embodiments, the user interface includes a view component corresponding to the second region, the size and position of the view component being the same as the size and position of the second region, and the image display module 1006 includes: an image filling module configured to fill the view component with a first portion of the second image; and an image overflow module configured to overflow the view component with a second portion of the second image.

[0073] In some embodiments, the image filling module includes: a full display module configured to fully display the second image in the view component; and an image magnification module configured to magnify the second image based on a predetermined ratio, with the bottom of the view component as the base point, until a first portion of the second image fills the view component.

[0074] In some embodiments, the second image is pre-generated by the server, and the apparatus 1000 further includes an image receiving module configured to receive the second image from the server, wherein the second image is verified by the server to match the first image.

[0075] It is understood that, using the device 1000 of this disclosure, the first portion of the second image can be fully displayed in the second area, thereby reducing the cropping or obscuring of the core content of the image during display adaptation. Furthermore, by filling the blank areas in the first area with expanded image content generated based on the first image, the display integrity of the user interface and the overall coordination of the image content can be improved, enhancing the user's browsing experience and increasing the versatility of the same image content across different display devices and display scenarios.

[0076] Figure 11A block diagram of a device 1100 capable of implementing various embodiments of the present disclosure is shown. Device 1100 may be, for example, as shown below. Figure 1 The processing device 110 shown. For example... Figure 11 As shown, device 1100 includes a central processing unit (CPU) and / or a graphics processing unit (GPU) 1101, which can perform various appropriate actions and processes according to computer program instructions stored in read-only memory (ROM) 1102 or loaded from storage unit 1108 into random access memory (RAM) 1103. Various programs and data required for the operation of device 1100 can also be stored in RAM 1103. The CPU / GPU 1101, ROM 1102, and RAM 1103 are interconnected via bus 1104. Input / output (I / O) interface 1105 is also connected to bus 1104. Although not shown in... Figure 11 As shown, device 1100 may also include a coprocessor.

[0077] Multiple components in device 1100 are connected to I / O interface 1105, including: input unit 1106, such as keyboard, mouse, etc.; output unit 1107, such as various types of monitors, speakers, etc.; storage unit 1108, such as disk, optical disk, etc.; and communication unit 1109, such as network card, modem, wireless transceiver, etc. Communication unit 1109 allows device 1100 to exchange information / data with other devices through computer networks such as the Internet and / or various telecommunications networks.

[0078] The various methods or processes described above can be executed by CPU / GPU 1101. In some embodiments, the methods can be implemented as computer software programs tangibly contained in a machine-readable medium, such as storage unit 1108. In some embodiments, part or all of the computer program can be loaded and / or installed on device 1100 via ROM 1102 and / or communication unit 1109. When the computer program is loaded into RAM 1103 and executed by CPU / GPU 1101, one or more steps or actions in the methods or processes described above can be performed.

[0079] In some embodiments, the methods and processes described above can be implemented as a computer program product. The computer program product may include a computer-readable storage medium having computer-readable program instructions loaded thereon for performing various aspects of this disclosure.

[0080] Computer-readable storage media can be tangible devices capable of holding and storing instructions for use by an instruction execution device. Computer-readable storage media can be, for example, but not limited to, electrical storage devices, magnetic storage devices, optical storage devices, electromagnetic storage devices, semiconductor storage devices, or any suitable combination thereof. More specific examples (a non-exhaustive list) of computer-readable storage media include: portable computer disks, hard disks, random access memory (RAM), read-only memory (ROM), erasable programmable read-only memory (EPROM or flash memory), static random access memory (SRAM), portable compact disc read-only memory (CD-ROM), digital multifunction disc (DVD), memory sticks, floppy disks, mechanical encoding devices, such as punch cards or recessed protrusions storing instructions thereon, and any suitable combination thereof. The computer-readable storage media used herein are not to be construed as transient signals themselves, such as radio waves or other freely propagating electromagnetic waves, electromagnetic waves propagating through waveguides or other transmission media (e.g., light pulses through fiber optic cables), or electrical signals transmitted through wires.

[0081] The computer-readable program instructions described herein can be downloaded from computer-readable storage media to various computing / processing devices, or downloaded via a network, such as the Internet, a local area network (LAN), a wide area network (WAN), and / or a wireless network, to an external computer or external storage device. The network may include copper cables, fiber optic cables, wireless transmission, routers, firewalls, switches, gateway computers, and / or edge servers. A network adapter card or network interface in each computing / processing device receives the computer-readable program instructions from the network and forwards them to the computer-readable storage media in the respective computing / processing device.

[0082] Computer program instructions used to perform the operations of this disclosure may be assembly instructions, instruction set architecture (ISA) instructions, machine instructions, machine-dependent instructions, microcode, firmware instructions, status setting data, or source code or object code written in any combination of one or more programming languages, including object-oriented programming languages ​​and conventional procedural programming languages. The computer-readable program instructions may execute 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 a remote computer, the remote computer may 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 may be connected to an external computer (e.g., via the Internet using an Internet service provider). In some embodiments, electronic circuitry, such as programmable logic circuitry, field-programmable gate arrays (FPGAs), or programmable logic arrays (PLAs), is personalized by utilizing the status information of the computer-readable program instructions to execute the computer-readable program instructions, thereby implementing various aspects of this disclosure.

[0083] These computer-readable program instructions can be provided to a processing unit of a general-purpose computer, a special-purpose computer, or other programmable data processing apparatus to produce a machine such that, when executed by the processing unit of the computer or other programmable data processing apparatus, they create means for implementing the functions / actions specified in one or more blocks of the flowchart and / or block diagram. These computer-readable program instructions can also be stored in a computer-readable storage medium that causes a computer, programmable data processing apparatus, and / or other device to operate in a particular manner. Thus, the computer-readable medium storing the instructions comprises an article of manufacture that includes instructions for implementing aspects of the functions / actions specified in one or more blocks of the flowchart and / or block diagram.

[0084] Computer-readable program instructions may also be loaded onto a computer, other programmable data processing apparatus, or other device to cause a series of operational steps to be performed on the computer, other programmable data processing apparatus, or other device to produce a computer-implemented process, thereby causing the instructions executed on the computer, other programmable data processing apparatus, or other device to perform the functions / actions specified in one or more boxes of a flowchart and / or block diagram.

[0085] The flowcharts and block diagrams in the accompanying drawings illustrate the architecture, functionality, and operation of possible implementations of devices, methods, and computer program products according to various embodiments of the present disclosure. In this regard, each block in a flowchart or block diagram may represent a module, segment, or portion of an instruction containing one or more executable instructions for implementing a specified logical function. In some alternative implementations, the functions marked in the blocks may occur in a different order than those marked in the drawings. For example, two consecutive blocks may actually be executed substantially in parallel, and they may sometimes be executed in reverse order, depending on the functions involved. It should also be noted that each block in the block diagrams and / or flowcharts, and combinations of blocks in the block diagrams and / or flowcharts, may be implemented using a dedicated hardware-based system that performs the specified function or action, or using a combination of dedicated hardware and computer instructions.

[0086] The various embodiments of this disclosure have been described above. These descriptions are exemplary and not exhaustive, nor are they limited to the disclosed embodiments. Many modifications and variations will be apparent to those skilled in the art without departing from the scope and spirit of the described embodiments. The terminology used herein is chosen to best explain the principles, practical applications, or technical improvements to the technology in the market, or to enable others skilled in the art to understand the embodiments disclosed herein.

Claims

1. A method for displaying an image, comprising: A second image is obtained, which is generated based on the first image. The second image includes a first portion corresponding to the first image and a second portion generated by expanding the first portion. Based on the aspect ratio of the first region in the user interface and the aspect ratio of the first image, a second region is set within the first region; as well as At least a portion of the second image is displayed in the first region, wherein the first portion of the second image is fully displayed in the second region.

2. The method according to claim 1, wherein setting the second region in the first region based on the aspect ratio of the first region in the user interface and the aspect ratio of the first image comprises: The width or height of the second region is determined based on the aspect ratio of the first region and the aspect ratio of the first image; as well as The second region is set within the first region based on the width or height of the second region and the aspect ratio of the first image.

3. The method of claim 2, wherein determining the width or height of the second region based on the aspect ratio of the first region and the aspect ratio of the first image comprises: In response to the fact that the aspect ratio of the first region is greater than or equal to the aspect ratio of the first image, the height of the first region is determined as the height of the second region; as well as In response to the fact that the aspect ratio of the first region is less than that of the first image, the width of the first region is determined as the width of the second region.

4. The method of claim 2, wherein setting the second region in the first region based on the width or height of the second region and the aspect ratio of the first image comprises: The aspect ratio of the first image is determined as the aspect ratio of the second region; as well as The second region is set by aligning the bottom of the second region with the bottom of the first region.

5. The method of claim 1, wherein the user interface further comprises a third region, the bottom of the third region being adjacent to the top of the first region, and the method further comprises: In response to the third portion of the second portion extending beyond the top of the first region, the third region obscures the third portion of the second image.

6. The method of claim 1, wherein the second image is generated based on the content of the first image by expanding the first image to the left, right and top.

7. The method according to claim 1, wherein the second image is generated by expanding the first image based on a preset ratio.

8. The method of claim 1, wherein the user interface includes a view component corresponding to the second region, the view component being the same size and position as the second region, and displaying at least a portion of the second image in the first region comprises: Make the first portion of the second image fill the view component; as well as The second portion of the second image overflows the view component.

9. The method of claim 8, wherein filling the view component with the first portion of the second image comprises: The second image is fully displayed in the view component; as well as Using the bottom of the view component as a base point, the second image is magnified according to a predetermined ratio until the first part of the second image fills the view component.

10. The method of claim 1, wherein the second image is pre-generated by the server, and the method further comprises: The second image is received from the server, wherein the second image is verified by the server to match the first image.

11. An apparatus for displaying an image, comprising: An image acquisition module is configured to acquire a second image, which is generated based on a first image. The second image includes a first portion corresponding to the first image and a second portion generated by extending the first portion. The region setting module is configured to set a second region within the first region based on the aspect ratio of the first region in the user interface and the aspect ratio of the first image; as well as An image display module is configured to display at least a portion of the second image in the first area, wherein the first portion of the second image is fully displayed in the second area.

12. An electronic device, comprising: processor; as well as A memory coupled to the processor, the memory having instructions stored therein, which, when executed by the processor, cause the electronic device to perform the method according to any one of claims 1 to 10.

13. A computer program product tangibly stored on a non-transitory computer-readable medium and comprising machine-executable instructions that, when executed, cause a machine to perform the method according to any one of claims 1 to 10.

Images