Game display adjustment method and device, electronic equipment and storage medium
By acquiring the display resolution and safe area information of the mobile device, and adjusting the game canvas and interactive controls, the problem of web games not being able to display in full screen and interactive controls not being touchable on mobile devices was solved, achieving full-screen display and a good operating experience.
Patent Information
- Authority / Receiving Office
- CN · China
- Patent Type
- Patents(China)
- Current Assignee / Owner
- NETEASE (HANGZHOU) NETWORK CO LTD
- Filing Date
- 2023-06-01
- Publication Date
- 2026-07-21
AI Technical Summary
When web-based games run on mobile devices, they cannot fill the entire screen, and interactive controls may appear in untouchable areas, affecting user operation.
Obtain the original display resolution and the location information of the safe display area of the mobile device, determine the initial resolution and target resolution of the target game, adjust the game canvas and interactive controls to the safe display area, ensure that the game fills the entire display area and restrict the interactive controls to the safe area.
It enables full-screen display of web games on mobile devices, ensuring that interactive controls are within the touchable area and improving the user experience.
Smart Images

Figure CN116617657B_ABST
Abstract
Description
Technical Field
[0001] This application relates to the field of game display technology, and in particular to a method, apparatus, electronic device and storage medium for adjusting game display. Background Technology
[0002] This section is intended to provide background or context for the embodiments of this application as set forth in the claims. The description herein is not intended to be a prior art simply because it is included in this section.
[0003] Web-based games typically run on a browser, where the top and bottom edges house the browser's address bar, navigation buttons, and other browser functions. Therefore, web-based games generally don't consider adaptation for irregularly shaped screens. However, when web-based games need to run directly on mobile devices, current technologies mostly retain the top status bar, filling its background with a solid color that largely matches the page layout. The main page content then begins to appear below the status bar. This approach fails to ensure the game screen fills the entire screen, negatively impacting the display quality of the web-based game on mobile devices. Summary of the Invention
[0004] In view of this, the purpose of this application is to provide a method, device, electronic device and storage medium for adjusting game display.
[0005] To achieve the above objectives, this application provides a method for adjusting game display, comprising:
[0006] Obtain the original display resolution and location information of the safe display area on the mobile device, and obtain the initial resolution of the first canvas on which the target game is displayed in the webpage;
[0007] The first target resolution corresponding to the safe display area is determined based on the initial resolution and the original resolution.
[0008] The second target resolution of the second canvas displayed by the target game on the mobile device is determined based on the first target resolution, the original resolution, and the location information.
[0009] Based on the second target resolution, the target game is adjusted from the first canvas to the second canvas, and the interactive controls of the target game are adjusted to the safe display area.
[0010] Based on the same inventive concept, an exemplary embodiment of this application also provides a game display adjustment device, including:
[0011] The acquisition module obtains the original display resolution and the location information of the safe display area of the mobile device, and obtains the initial resolution of the first canvas on which the target game is displayed in the webpage;
[0012] The first determining module determines the first target resolution corresponding to the safe display area based on the initial resolution and the original resolution;
[0013] The second determining module determines the second target resolution of the second canvas displayed by the target game on the mobile device based on the first target resolution, the original resolution, and the location information.
[0014] The adjustment module adjusts the target game from the first canvas to the second canvas based on the second target resolution, and adjusts the interactive controls of the target game to the safe display area.
[0015] Based on the same inventive concept, an exemplary embodiment of this application also provides an electronic device, including a memory, a processor, and a computer program stored in the memory and executable by the processor, wherein the processor executes the program to implement the game display adjustment method as described above.
[0016] Based on the same inventive concept, an exemplary embodiment of this application also provides a non-transitory computer-readable storage medium storing computer instructions for causing a computer to execute the game display adjustment method described above.
[0017] As can be seen from the above, the game display adjustment method, device, electronic device, and storage medium provided in this application obtain the original display resolution and the location information of the safe display area of the mobile terminal, and obtain the initial resolution of the first canvas of the target game displayed on the webpage; determine the first target resolution corresponding to the safe display area based on the initial resolution and the original resolution; determine the second target resolution of the second canvas of the target game displayed on the mobile terminal based on the first target resolution, the original resolution, and the location information; adjust the target game from the first canvas to the second canvas based on the second target resolution, and adjust the interactive controls of the target game to the safe display area, so that when the target game is displayed on the mobile terminal, it can fill the entire display area of the mobile terminal, while restricting the interactive controls used for interaction to the safe display area of the mobile terminal, ensuring that the user is not affected by the notch screen when operating the target game. Attached Figure Description
[0018] To more clearly illustrate the technical solutions in this application or related technologies, the drawings used in the description of the embodiments or related technologies will be briefly introduced below. Obviously, the drawings described below are only embodiments of this application. For those skilled in the art, other drawings can be obtained based on these drawings without creative effort.
[0019] Figure 1 This is a schematic diagram illustrating one application scenario of an embodiment of this application;
[0020] Figure 2 This is a schematic diagram of the structure of a target game displayed on a mobile device in related technologies;
[0021] Figure 3 This is a schematic diagram of the structure of a target game displayed on a mobile device according to an embodiment of this application;
[0022] Figure 4 This is a flowchart illustrating a method for adjusting game display according to an embodiment of this application;
[0023] Figure 5 This is a schematic diagram of the structure of a game display adjustment device according to an embodiment of this application;
[0024] Figure 6 This is a schematic diagram of the structure of a specific electronic device according to an embodiment of this application. Detailed Implementation
[0025] The principles and spirit of this application will now be described with reference to several exemplary embodiments. It should be understood that these embodiments are provided merely to enable those skilled in the art to better understand and implement this application, and are not intended to limit the scope of this application in any way. Rather, these embodiments are provided to make this application more thorough and complete, and to fully convey the scope of this application to those skilled in the art.
[0026] According to embodiments of this application, a method, system, electronic device, and storage medium for adjusting game display are proposed.
[0027] In this article, it is important to understand that any number of elements in the accompanying figures is for illustrative purposes and not for limitation, and any naming is for distinction only and has no limiting meaning.
[0028] The principles and spirit of this application will be explained in detail below with reference to several representative embodiments. Invention Overview
[0030] Currently, in related technologies, when web games are to run directly on mobile devices, most methods retain the top status bar, fill its background with a solid color that largely matches the page layout, and then begin the main page layout below the status bar. This approach fails to ensure the game screen fills the entire screen, affecting the display effect of the web game on the mobile device. (Reference) Figure 2The shaded area represents the game's display area. As you can see, a significant portion of the mobile device's (phone) display area is not filled with the game screen, preventing it from filling the entire screen. Furthermore, mobile games typically use touch controls for interaction. If the web game's screen were to directly fill the entire mobile display area, some interactive controls might appear in non-touchable areas (such as the notch on a phone screen), undoubtedly affecting the user's ability to play the game.
[0031] To address the aforementioned issues, this application provides a method for adjusting game display, specifically including:
[0032] The system acquires the original display resolution of the mobile device and the location information of the safe display area, and obtains the initial resolution of the first canvas on which the target game is displayed in the webpage. Based on the initial resolution and the original resolution, it determines the first target resolution corresponding to the safe display area. Based on the first target resolution, the original resolution, and the location information, it determines the second target resolution of the second canvas on which the target game is displayed in the mobile device. Based on the second target resolution, it moves the target game from the first canvas to the second canvas and moves the interactive controls of the target game to the safe display area. This allows the target game to fill the entire display area of the mobile device, while restricting the interactive controls to the safe display area, ensuring that the user is not affected by the notch on the screen when controlling the target game. (Reference) Figure 3 ,in, Figure 3 All display areas are filled with the game screen. 02 represents the entire display area of the mobile device (second canvas), and 01 represents the safe display area. This can improve the visual experience without affecting the user's operation of the game through interactive controls.
[0033] After introducing the basic principles of this application, the various non-limiting embodiments of this application will be described in detail below.
[0034] Application Scenarios Overview
[0035] In specific application scenarios, the game display adjustment method of this application can be applied to various platforms or systems involving game display adjustment. As an example, see [reference needed]. Figure 1This application scenario includes at least one server 102 and at least one terminal 101. Terminal devices include, but are not limited to, desktop computers, mobile phones, mobile computers, tablets, media players, smart wearable devices, personal digital assistants (PDAs), or other electronic devices capable of performing the aforementioned functions. The server can be a standalone physical server, a server cluster or distributed system composed of multiple physical servers, or a cloud server providing basic cloud computing services such as cloud services, cloud databases, cloud computing, cloud functions, cloud storage, network services, cloud communication, middleware services, domain name services, security services, CDN, and big data and artificial intelligence platforms. The server and terminal can communicate via a network to transmit data. The network can be a wired network or a wireless network; this application does not specifically limit its use.
[0036] The server can be a server that provides various services. Specifically, the server can be used to provide background services for applications running on the terminal. Optionally, in some implementations, the game display adjustment method provided in this application embodiment can be executed by the terminal device. Optionally, in some implementations, the game display adjustment method provided in this application embodiment can be executed by the server. The server can be hardware or software. When the server is hardware, it can be implemented as a distributed server cluster composed of multiple servers, or it can be implemented as a single server. When the server is software, it can be implemented as multiple software programs or software modules (e.g., software programs or software modules used to provide distributed services), or it can be implemented as a single software program or software module. This application embodiment does not specifically limit this.
[0037] Optionally, the aforementioned wireless or wired networks use standard communication technologies and / or protocols. The network is typically the Internet, but can be any network, including but not limited to local area networks (LANs), metropolitan area networks (MANs), wide area networks (WANs), mobile, wired or wireless networks, private networks, or any combination of virtual private networks. In some embodiments, technologies and / or formats including Hypertext Markup Language (HTML), Extensible Markup Language (XML), etc., are used to represent data exchanged over the network. Furthermore, conventional encryption technologies such as Secure Socket Layer (SSL), Transport Layer Security (TLS), Virtual Private Network (VPN), and Internet Protocol Security (IPsec) can be used to encrypt all or some links. In other embodiments, customized and / or dedicated data communication technologies can be used to replace or supplement the aforementioned data communication technologies.
[0038] The following describes a method for adjusting game display according to an exemplary embodiment of this application, using specific application scenarios. It should be noted that the above application scenarios are shown only to facilitate understanding of the spirit and principles of this application, and the embodiments of this application are not limited in any way. Rather, the embodiments of this application can be applied to any applicable scenario.
[0039] Exemplary methods
[0040] refer to Figure 4 This application provides a method for adjusting game display, wherein the executing entity of the method may be, but is not limited to, a server or a terminal device. The method includes the following steps:
[0041] S101, obtain the original display resolution of the mobile device and the location information of the safe display area, and obtain the initial resolution of the first canvas displayed by the target game on the webpage.
[0042] In practice, when adjusting the game's display, first obtain the mobile device's original display resolution and the location information of the safe display area, as well as the initial resolution of the first canvas displayed by the target game on the webpage. Optionally, the location information of the safe display area for the current mobile device model can be obtained through the mobile device's native API support. Optionally, this location information can be the distance between the safe display area and the screen edge. Optionally, refer to... Figure 3 The location information can be the distance between the safety display area 01 and the top edge, bottom edge, left edge, and right edge of the entire display area 02 of the mobile terminal. This location information can be used to determine the size and position of the safety display area.
[0043] It's important to note that the target game primarily refers to games that can run on web pages, such as H5 (HTML5) games. HTML5, or the fifth generation of HTML, is a language used to describe web page content. Browsers decode HTML to display the web page content. The game's canvas is used to generate images on the web page in real time and allows for manipulation of image content. All scenes in a web game are ultimately rendered onto the canvas. The size of the game canvas generally determines the size of the game's displayed screen.
[0044] S102, determine the first target resolution corresponding to the safe display area based on the initial resolution and the original resolution.
[0045] In practical implementation, to ensure the spacing between interactive controls and to minimize the impact on user experience after the interactive controls are confined to the safe display area, this application first determines the first target resolution corresponding to the safe display area based on the initial resolution and the original resolution. Optionally, when determining the first target resolution, the initial resolution can be scaled proportionally, and then the scaled initial resolution can be adjusted with reference to the original resolution of the mobile device to make it smaller than the original resolution while maintaining the same aspect ratio as the original resolution.
[0046] In some embodiments, determining a first target resolution corresponding to the secure display area based on the initial resolution and the original resolution specifically includes:
[0047] Determine the preset adaptation resolution corresponding to the initial resolution;
[0048] The first target resolution is determined based on the preset adapted resolution and the original resolution.
[0049] In specific implementation, when determining the first target resolution, a preset adaptation resolution corresponding to the initial resolution can be determined first. This preset adaptation resolution, while scaling the initial resolution, can ensure that the scaled game screen does not distort as much as possible. Optionally, a preset adaptation resolution can be set for each resolution range through experimentation. After determining the preset adaptation resolution, the first target resolution can be determined based on the preset adaptation resolution and the original resolution. That is, based on the preset adaptation resolution, the aspect ratio of the original resolution is referenced, and simple fine-tuning is made to obtain the first target resolution, thereby reducing the impact of resolution modification. For example, assuming a preset adaptation resolution is 720*1558 and the original resolution is 1080*2244, in order to reduce modification, the vertical resolution of the first target resolution can be kept unchanged at 1558. At the same time, the horizontal resolution of the first target resolution is recalculated as 1080 / (2244 / 1558) = 750, then the first target resolution is 750*1558.
[0050] S103, determine the second target resolution of the second canvas displayed by the target game on the mobile device based on the first target resolution, the original resolution and the location information.
[0051] In practice, after determining the first target resolution, in order to ensure that the target game fills the entire display area of the mobile device, a second target resolution for the second canvas displayed on the mobile device can be determined based on the first target resolution, the original resolution, and the position information. That is, the second target resolution is obtained by scaling up the first target resolution based on the original resolution and the position information.
[0052] In some embodiments, determining the second target resolution of the second canvas displayed by the target game on the mobile device based on the first target resolution, the original resolution, and the location information specifically includes:
[0053] The target scaling ratio is determined based on the first target resolution, the original resolution, and the location information;
[0054] The second target resolution is determined based on the target scaling ratio and the original resolution.
[0055] In specific implementation, assuming the location information includes a top edge spacing of 80, a bottom edge spacing of 4, a left edge spacing of 5, and a right edge spacing of 5 from the safe display area to the entire display area of the mobile device. The first target resolution is 750*1558, and the original resolution is 1080*2244. Therefore, the height scaling ratio Y = (2244-80-4) / 1558 = 1.386, and the width scaling ratio X = (1080-5-5) / 750 = 1.426. Then, based on the height and width scaling ratios, the height of the second target resolution is determined to be 2244 / 1.386 = 1619, and the width is determined to be 1080 / 1.426 = 757, i.e., the second target resolution is 757*1619. It should be noted that the units for the above resolution and spacing are pixels.
[0056] S104, based on the second target resolution, adjust the target game from the first canvas to the second canvas, and adjust the interactive controls of the target game to the safe display area.
[0057] In practice, after obtaining the second target resolution, the target game can be moved from the first canvas to the second canvas according to the second target resolution, and the interactive controls of the target game can be moved to the safe display area. That is, the target game is scaled from the initial resolution of the first canvas to the second target resolution of the second canvas, and the interactive controls are moved to the safe display area.
[0058] In some embodiments, adjusting the target game from the first canvas to the second canvas based on the second target resolution specifically includes:
[0059] Based on the second target resolution, the background scene and interactive controls of the target game are adjusted to be displayed on the second canvas.
[0060] In some embodiments, adjusting the interactive controls of the target game to the safe display area specifically includes:
[0061] Move the interactive controls that were previously positioned on the second canvas to the secure display area.
[0062] In specific implementation, when adjusting the target game from the first canvas to the second canvas based on the second target resolution, the background scene and interactive controls of the target game can both be adjusted to the second canvas. Then, the interactive controls adjusted to the second canvas are moved to the safe display area. That is, the background scene and interactive controls are both scaled to the second canvas according to the second target resolution, and then the interactive controls are moved to the safe area while keeping the background scene unchanged.
[0063] In some embodiments, adjusting the target game from the first canvas to the second canvas based on the second target resolution specifically includes:
[0064] The background scene of the target game is adjusted onto the second canvas based on the second target resolution.
[0065] In some embodiments, adjusting the interactive controls of the target game to the safe display area specifically includes:
[0066] The interactive controls are adjusted to the safe display area based on the first target resolution.
[0067] In practice, when adjusting the target game from the first canvas to the second canvas based on the second target resolution, the background scene of the target game can be adjusted to the second canvas according to the second target resolution first, and then the interactive controls can be adjusted to the safe display area according to the first target resolution. This can reduce the number of times the interactive controls are moved.
[0068] In some embodiments, adjusting the background scene of the target game onto the second canvas based on the second target resolution specifically includes:
[0069] All rendering nodes corresponding to the background scenes are attached to the root node of the target game's rendering tree so that all the background scenes are adjusted into the second canvas.
[0070] Wherein, the size of the rendering space corresponding to the root node is the second target resolution, and the starting position of the rendering space corresponding to the root node is the first preset starting position of the second canvas.
[0071] In practical implementation, to improve the efficiency of background scene adjustment, the size of the rendering space of the root node of the rendering tree can be set to the second target resolution, and the starting position of the rendering space corresponding to the root node can be specified as the first preset starting position of the second canvas. Optionally, the first preset starting position can be set as needed and is not limited thereto. For example, the upper left corner of the second canvas can be set as the first preset starting position. In this way, when the rendering node corresponding to the background scene is attached to the root node of the rendering tree, the layout can start from the upper left corner of the entire display area and fill the entire display area of the mobile device.
[0072] In some embodiments, adjusting the interactive controls of the target game to the safe display area based on a first target resolution specifically includes:
[0073] Add a safe zone node under the root node of the target game's rendering tree; wherein the size of the rendering space corresponding to the safe zone node is the first target resolution, and the starting position of the rendering space corresponding to the safe zone node is the second preset starting position of the safe display area;
[0074] Attach the rendering nodes corresponding to all the interactive controls to the safe zone node so that all the interactive controls are adjusted to the safe display area.
[0075] Specifically, to improve the efficiency of adjusting interactive controls, a safe zone node can be added under the root node of the target game's rendering tree. Simultaneously, the size of the rendering space corresponding to the safe zone node is set to the first target resolution, and the starting position of the rendering space corresponding to the safe zone node is specified as the second preset starting position of the safe display area. Optionally, this second preset starting position can be set as needed and is not limited thereto. For example, the upper left corner of the safe display area can be set as the first preset starting position. Thus, when the rendering node corresponding to the interactive control is attached to the safe zone node, the layout can start from the upper left corner of the safe display area and be confined within the safe display area.
[0076] In some embodiments, the step of determining a second preset starting position of the security display area includes:
[0077] The target scaling ratio is determined based on the first target resolution, the original resolution, and the location information;
[0078] The second preset starting position is determined based on the target scaling ratio and the position information.
[0079] In specific implementation, assuming the location information includes the distance between the safe display area and the top edge of the entire screen display area (80), the bottom edge (4), the left edge (5), and the right edge (5), respectively. The first target resolution is 750*1558, and the original resolution is 1080*2244. Therefore, the height scaling ratio Y = (2244-80-4) / 1558 = 1.386, and the width scaling ratio X = (1080-5-5) / 750 = 1.426. If the second preset starting position is the top left corner of the safe display area, then, taking the top left corner of the entire display area (second canvas) of the mobile device as the origin, the coordinates of the second preset starting position can be expressed as (3.5 = 5 / 1.426, 57.7 = 80 / 1.386).
[0080] It should be noted that the units for the resolution, spacing, and coordinates mentioned above are all pixels.
[0081] The game display adjustment method provided in this application obtains the original display resolution and the location information of the safe display area of the mobile terminal, and obtains the initial resolution of the first canvas on which the target game is displayed in the webpage; determines the first target resolution corresponding to the safe display area based on the initial resolution and the original resolution; determines the second target resolution of the second canvas on which the target game is displayed in the mobile terminal based on the first target resolution, the original resolution, and the location information; adjusts the target game from the first canvas to the second canvas based on the second target resolution, and adjusts the interactive controls of the target game to the safe display area, so that when the target game is displayed in the mobile terminal, it can fill the entire display area of the mobile terminal, while restricting the interactive controls used for interaction to the safe display area of the mobile terminal, ensuring that the user is not affected by the notch screen when operating the target game.
[0082] Exemplary device
[0083] Based on the same inventive concept, corresponding to any of the above embodiments, this application also provides a game display adjustment device.
[0084] refer to Figure 5 The game display adjustment device includes:
[0085] The module 201 acquires the original display resolution and the location information of the safe display area of the mobile device, and acquires the initial resolution of the first canvas displayed by the target game on the webpage.
[0086] The first determining module 202 determines the first target resolution corresponding to the safe display area based on the initial resolution and the original resolution;
[0087] The second determining module 203 determines the second target resolution of the second canvas displayed by the target game on the mobile device based on the first target resolution, the original resolution, and the location information.
[0088] The adjustment module 204 adjusts the target game from the first canvas to the second canvas based on the second target resolution, and adjusts the interactive controls of the target game to the safe display area.
[0089] For ease of description, the above system is described by dividing it into various modules based on their functions. Of course, in implementing this application, the functions of each module can be implemented in one or more software and / or hardware.
[0090] The system described above is used to implement the corresponding game display adjustment method in any of the foregoing embodiments, and has the beneficial effects of the corresponding method embodiments, which will not be repeated here.
[0091] Based on the same inventive concept, corresponding to the methods of any of the above embodiments, this application also provides an electronic device, including a memory, a processor, and a computer program stored in the memory and executable on the processor, wherein the processor executes the program to implement the game display adjustment method described in any of the above embodiments.
[0092] Figure 6 This embodiment illustrates a more specific hardware structure of an electronic device, which may include a processor 1010, a memory 1020, an input / output interface 1030, a communication interface 1040, and a bus 1050. The processor 1010, memory 1020, input / output interface 1030, and communication interface 1040 are interconnected internally via the bus 1050.
[0093] The processor 1010 can be implemented using a general-purpose CPU (Central Processing Unit), microprocessor, application-specific integrated circuit (ASIC), or one or more integrated circuits, and is used to execute relevant programs to implement the technical solutions provided in the embodiments of this specification.
[0094] The memory 1020 can be implemented in the form of ROM (Read Only Memory), RAM (Random Access Memory), static storage device, dynamic storage device, etc. The memory 1020 can store the operating system and other applications. When the technical solutions provided in the embodiments of this specification are implemented by software or firmware, the relevant program code is stored in the memory 1020 and is called and executed by the processor 1010.
[0095] The input / output interface 1030 is used to connect input / output modules to realize information input and output. Input / output modules can be configured as components within the device (not shown in the figure) or externally connected to the device to provide corresponding functions. Input devices may include keyboards, mice, touchscreens, microphones, various sensors, etc., while output devices may include displays, speakers, vibrators, indicator lights, etc.
[0096] The communication interface 1040 is used to connect a communication module (not shown in the figure) to enable communication between this device and other devices. The communication module can communicate via wired means (such as USB, Ethernet cable, etc.) or wireless means (such as mobile network, WIFI, Bluetooth, etc.).
[0097] Bus 1050 includes a pathway for transmitting information between various components of the device, such as processor 1010, memory 1020, input / output interface 1030, and communication interface 1040.
[0098] It should be noted that although the above-described device only shows the processor 1010, memory 1020, input / output interface 1030, communication interface 1040, and bus 1050, in specific implementations, the device may also include other components necessary for normal operation. Furthermore, those skilled in the art will understand that the above-described device may only include the components necessary for implementing the embodiments of this specification, and not necessarily all the components shown in the figures.
[0099] The electronic devices described above are used to implement the corresponding game display adjustment methods in any of the foregoing embodiments, and have the beneficial effects of the corresponding method embodiments, which will not be repeated here.
[0100] Exemplary program product
[0101] Based on the same inventive concept, corresponding to the methods of any of the above embodiments, this application also provides a non-transitory computer-readable storage medium storing computer instructions for causing the computer to execute the game display adjustment method as described in any of the above embodiments.
[0102] The computer-readable medium of this embodiment includes permanent and non-permanent, removable and non-removable media, and information storage can be implemented by any method or technology. Information can be computer-readable instructions, data structures, program modules, or other data. Examples of computer storage media include, but are not limited to, phase-change memory (PRAM), static random access memory (SRAM), dynamic random access memory (DRAM), other types of random access memory (RAM), read-only memory (ROM), electrically erasable programmable read-only memory (EEPROM), flash memory or other memory technologies, CD-ROM, digital versatile optical disc (DVD) or other optical storage, magnetic tape, magnetic disk storage or other magnetic storage devices, or any other non-transfer medium that can be used to store information accessible by a computing device.
[0103] The computer instructions stored in the storage medium of the above embodiments are used to cause the computer to execute the game display adjustment method as described in any of the above embodiments, and have the beneficial effects of the corresponding method embodiments, which will not be repeated here.
[0104] Based on the same inventive concept, corresponding to the methods of any of the above embodiments, this disclosure also provides a computer program product, which includes a computer program. In some embodiments, the computer program is executed by one or more processors to cause the processors to perform the game display adjustment method described in the above embodiments, and has the beneficial effects of the corresponding method embodiments, which will not be repeated here.
[0105] Those skilled in the art should understand that the discussion of any of the above embodiments is merely exemplary and is not intended to imply that the scope of this application (including the claims) is limited to these examples; within the framework of this application, the technical features of the above embodiments or different embodiments can also be combined, the steps can be implemented in any order, and there are many other variations of different aspects of the embodiments of this application as described above, which are not provided in the details for the sake of brevity.
[0106] Additionally, to simplify the description and discussion, and to avoid obscuring the embodiments of this application, the well-known power / ground connections to integrated circuit (IC) chips and other components may or may not be shown in the provided drawings. Furthermore, the apparatus may be shown in block diagram form to avoid obscuring the embodiments of this application, and this also takes into account the fact that the details of the implementation of these block diagram apparatuses are highly dependent on the platform on which the embodiments of this application will be implemented (i.e., these details should be fully understood by those skilled in the art). While specific details (e.g., circuits) have been set forth to describe exemplary embodiments of this application, it will be apparent to those skilled in the art that the embodiments of this application can be implemented without these specific details or with variations thereof. Therefore, these descriptions should be considered illustrative rather than restrictive.
[0107] Although this application has been described in conjunction with specific embodiments thereof, many substitutions, modifications, and variations of these embodiments will be apparent to those skilled in the art from the foregoing description. For example, other memory architectures (e.g., dynamic RAM (DRAM)) may be used with the embodiments discussed.
[0108] The embodiments of this application are intended to cover all such substitutions, modifications, and variations that fall within the broad scope of the appended claims. Therefore, any omissions, modifications, equivalent substitutions, improvements, etc., made within the spirit and principles of the embodiments of this application should be included within the protection scope of this application.
Claims
1. A method for adjusting game display, characterized in that, include: Obtain the original resolution and location information of the safe display area on the mobile device, and obtain the initial resolution of the first canvas on which the target game is displayed in the webpage; The first target resolution corresponding to the safe display area is determined based on the initial resolution and the original resolution. The second target resolution of the second canvas displayed by the target game on the mobile device is determined based on the first target resolution, the original resolution, and the location information. Based on the second target resolution, the target game is adjusted from the first canvas to the second canvas, and the interactive controls of the target game are adjusted to the safe display area according to the first target resolution; The step of determining the second target resolution of the second canvas displayed by the target game on the mobile device based on the first target resolution, the original resolution, and the location information specifically includes: The target scaling ratio is determined based on the first target resolution, the original resolution, and the location information; The second target resolution is determined based on the target scaling ratio and the original resolution.
2. The method according to claim 1, characterized in that, Determining the first target resolution corresponding to the safe display area based on the initial resolution and the original resolution specifically includes: Determine the preset adaptation resolution corresponding to the initial resolution; The first target resolution is determined based on the preset adapted resolution and the original resolution.
3. The method according to claim 1, characterized in that, Adjusting the target game from the first canvas to the second canvas based on the second target resolution specifically includes: Based on the second target resolution, the background scene and interactive controls of the target game are adjusted to be displayed on the second canvas.
4. The method according to claim 3, characterized in that, Adjusting the interactive controls of the target game to the safe display area specifically includes: Move the interactive controls that were previously positioned on the second canvas to the secure display area.
5. The method according to claim 1, characterized in that, Adjusting the target game from the first canvas to the second canvas based on the second target resolution specifically includes: The background scene of the target game is adjusted onto the second canvas based on the second target resolution.
6. The method according to claim 5, characterized in that, Adjusting the interactive controls of the target game to the safe display area specifically includes: The interactive controls are adjusted to the safe display area based on the first target resolution.
7. The method according to claim 5, characterized in that, Adjusting the background scene of the target game onto the second canvas based on the second target resolution specifically includes: All rendering nodes corresponding to the background scenes are attached to the root node of the target game's rendering tree so that all the background scenes are adjusted into the second canvas. Wherein, the size of the rendering space corresponding to the root node is the second target resolution, and the starting position of the rendering space corresponding to the root node is the first preset starting position of the second canvas.
8. The method according to claim 6, characterized in that, Adjusting the interactive controls of the target game to the safe display area based on the first target resolution specifically includes: Add a safe zone node under the root node of the target game's rendering tree; wherein the size of the rendering space corresponding to the safe zone node is the first target resolution, and the starting position of the rendering space corresponding to the safe zone node is the second preset starting position of the safe display area; Attach the rendering nodes corresponding to all the interactive controls to the safe zone node so that all the interactive controls are adjusted to the safe display area.
9. The method according to claim 8, characterized in that, The step of determining the second preset starting position of the security display area includes: The target scaling ratio is determined based on the first target resolution, the original resolution, and the location information; The second preset starting position is determined based on the target scaling ratio and the position information.
10. A device for adjusting a game display, characterized in that, include: The acquisition module obtains the original resolution and location information of the safe display area of the mobile device, and obtains the initial resolution of the first canvas displayed by the target game on the webpage; The first determining module determines the first target resolution corresponding to the safe display area based on the initial resolution and the original resolution; The second determining module determines the second target resolution of the second canvas displayed by the target game on the mobile device based on the first target resolution, the original resolution, and the location information. The adjustment module adjusts the target game from the first canvas to the second canvas based on the second target resolution, and adjusts the interactive controls of the target game to the safe display area; The step of determining the second target resolution of the second canvas displayed by the target game on the mobile device based on the first target resolution, the original resolution, and the location information specifically includes: The target scaling ratio is determined based on the first target resolution, the original resolution, and the location information; The second target resolution is determined based on the target scaling ratio and the original resolution.
11. An electronic device, characterized in that, The method includes a memory, a processor, and a computer program stored in the memory and executable by the processor, wherein the processor, when executing the program, implements the method as described in any one of claims 1 to 9.
12. A non-transitory computer-readable storage medium, characterized in that, The non-transitory computer-readable storage medium stores computer instructions for causing a computer to perform the method according to any one of claims 1 to 9.