WO2023025060A1 - Interface display adaptation processing method and apparatus, and electronic device - Google Patents

Interface display adaptation processing method and apparatus, and electronic device Download PDF

Info

Publication number
WO2023025060A1
WO2023025060A1 PCT/CN2022/113628 CN2022113628W WO2023025060A1 WO 2023025060 A1 WO2023025060 A1 WO 2023025060A1 CN 2022113628 W CN2022113628 W CN 2022113628W WO 2023025060 A1 WO2023025060 A1 WO 2023025060A1
Authority
WO
WIPO (PCT)
Prior art keywords
interface
area
image
input
display
Prior art date
Application number
PCT/CN2022/113628
Other languages
French (fr)
Chinese (zh)
Inventor
孙涛
Original Assignee
维沃移动通信有限公司
Priority date (The priority date is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the date listed.)
Filing date
Publication date
Application filed by 维沃移动通信有限公司 filed Critical 维沃移动通信有限公司
Publication of WO2023025060A1 publication Critical patent/WO2023025060A1/en

Links

Images

Classifications

    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
    • G06F3/01Input arrangements or combined input and output arrangements for interaction between user and computer
    • G06F3/048Interaction techniques based on graphical user interfaces [GUI]
    • G06F3/0481Interaction techniques based on graphical user interfaces [GUI] based on specific properties of the displayed interaction object or a metaphor-based environment, e.g. interaction with desktop elements like windows or icons, or assisted by a cursor's changing behaviour or appearance
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
    • G06F3/01Input arrangements or combined input and output arrangements for interaction between user and computer
    • G06F3/048Interaction techniques based on graphical user interfaces [GUI]
    • G06F3/0484Interaction techniques based on graphical user interfaces [GUI] for the control of specific functions or operations, e.g. selecting or manipulating an object, an image or a displayed text element, setting a parameter value or selecting a range
    • G06F3/04847Interaction techniques to control parameter settings, e.g. interaction with sliders or dials
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
    • G06F3/01Input arrangements or combined input and output arrangements for interaction between user and computer
    • G06F3/048Interaction techniques based on graphical user interfaces [GUI]
    • G06F3/0487Interaction techniques based on graphical user interfaces [GUI] using specific features provided by the input device, e.g. functions controlled by the rotation of a mouse with dual sensing arrangements, or of the nature of the input device, e.g. tap gestures based on pressure sensed by a digitiser
    • G06F3/0488Interaction techniques based on graphical user interfaces [GUI] using specific features provided by the input device, e.g. functions controlled by the rotation of a mouse with dual sensing arrangements, or of the nature of the input device, e.g. tap gestures based on pressure sensed by a digitiser using a touch-screen or digitiser, e.g. input of commands through traced gestures
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F9/00Arrangements for program control, e.g. control units
    • G06F9/06Arrangements for program control, e.g. control units using stored programs, i.e. using an internal store of processing equipment to receive or retain programs
    • G06F9/44Arrangements for executing specific programs
    • G06F9/451Execution arrangements for user interfaces

Definitions

  • the present application belongs to the technical field of communications, and in particular relates to an interface display adaptation processing method, device and electronic equipment.
  • the size of the user interface (UI) of an application designed for running on a mobile phone is also designed in consideration of the screen size of the mobile phone.
  • There will be various problems such as too large buttons, too long sliding distance, and the thumb cannot cover the operation area, which will reduce the convenience of using the tablet terminal.
  • the purpose of the embodiments of the present application is to provide an interface display adaptation processing method, device, and electronic device, which can solve the problem that the terminal does not match the interface of the application program and reduces the convenience of use.
  • the embodiment of the present application provides an interface display adaptation processing method, the method includes:
  • the first interface includes S first virtual keys
  • the second interface includes an image corresponding to a third area in the first interface
  • the third area is an image of the S first virtual keys
  • the second interface includes a second virtual key
  • the second virtual key is associated with the N first virtual keys
  • S and N are positive integers and S ⁇ N ⁇ 1.
  • an interface display adaptation processing device including:
  • a first receiving module configured to receive a first input from a user when the first interface is displayed in the first area
  • a display module configured to display a second interface in a second area in response to the first input
  • the first interface includes S first virtual keys
  • the second interface includes an image corresponding to a third area in the first interface
  • the third area is an image of the S first virtual keys
  • the second interface includes a second virtual key
  • the second virtual key is associated with the N first virtual keys
  • S and N are positive integers and S ⁇ N ⁇ 1.
  • the embodiment of the present application also provides an electronic device, the electronic device includes a processor, a memory, and a program or instruction stored in the memory and operable on the processor, the program or instruction When executed by the processor, the steps of the method according to the first aspect are realized.
  • the embodiment of the present application also provides a readable storage medium, on which a program or instruction is stored, and when the program or instruction is executed by a processor, the method according to the first aspect is implemented. step.
  • the embodiment of the present application provides a chip, the chip includes a processor and a communication interface, the communication interface is coupled to the processor, and the processor is used to run programs or instructions, so as to implement the first aspect the method described.
  • a computer program product is provided, the computer program product is stored in a non-volatile storage medium, and the computer program product is executed by at least one processor to implement the method as described in the first aspect.
  • a communication device configured to execute the method described in the first aspect.
  • the second interface after receiving the first input from the user, in response to the first input, the second interface can be displayed in the second area, since the second interface includes N first virtual keys in the first interface corresponding to The image of the region, and the second virtual button associated with the N first virtual buttons can trigger the associated second virtual button through the image of the region corresponding to the first virtual button without operating the second virtual button.
  • the virtual button avoids the inconvenience caused by directly operating the virtual button on the application interface, and improves the convenience of the electronic device.
  • FIG. 1 is a schematic flowchart of an adaptation processing method displayed on an interface in an embodiment of the present application
  • Fig. 2 is one of the screen display schematic diagrams of the electronic device
  • Fig. 3 is the second schematic diagram of the screen display of the electronic device
  • Fig. 4 is the third schematic diagram of the screen display of the electronic device.
  • Fig. 5 is the fourth schematic diagram of the screen display of the electronic device.
  • Fig. 6 is the fifth schematic diagram of the screen display of the electronic device.
  • FIG. 7 is a schematic structural diagram of an adaptation processing device displayed on an interface of an embodiment of the present application.
  • FIG. 8 is a schematic structural diagram of an electronic device according to an embodiment of the present application.
  • FIG. 9 is a schematic structural diagram of an electronic device according to another embodiment of the present application.
  • the adaptation processing method of the interface display in the embodiment of the present application includes:
  • Step 101 receiving a first input from a user when a first interface is displayed in a first area.
  • the first input is an input that triggers the processing of the first interface currently displayed in the first area, which triggers step 102 .
  • the user can implement the first input through a preset input method.
  • the first input may be an input based on a physical key or a virtual key, or may be an input through a biometric technology, such as voice, touch, infrared, gesture, and the like.
  • a biometric technology such as voice, touch, infrared, gesture, and the like.
  • other inputs in this embodiment are also pre-set, and the same as the first input, there may also be multiple implementations.
  • the first interface is an application interface.
  • the first interface is displayed in the first region with a preset display ratio, which can realize clearer display. Considering that the screen of the electronic device does not match the preset display ratio, displaying the first interface in the first area is executed after the user triggers the adaptation processing function of displaying the application interface.
  • Step 102 in response to the first input, display a second interface in a second area; wherein, the first interface includes S first virtual keys, and the second interface includes a third area in the first interface Corresponding image, the third area is the area corresponding to the N first virtual keys in the S first virtual keys; and the second interface includes a second virtual key, and the second virtual key is the same as the
  • the N first virtual keys are associated with each other; S and N are positive integers and S ⁇ N ⁇ 1.
  • the second interface in response to the first input received in step 101, the second interface will be displayed in the second area, that is, in the second area, images of the areas corresponding to the N first virtual keys in the first interface will be displayed, and to display the second virtual keys associated with the N first virtual keys.
  • the number of the second virtual keys is also N, corresponding to the N first virtual keys one by one.
  • the established second virtual key and N first virtual key associations are the associations between the area where the image of the first virtual key is located in the second interface and the second virtual key, so as to ensure that based on the second area, the user
  • the input in the area where the image of the first virtual key is located can trigger the corresponding second virtual key.
  • the virtual key A in the second interface is associated with a specific area in the second interface, and the specific area is the area where the image of the virtual key A on the first interface is displayed on the second interface.
  • the electronic device after receiving the first input from the user, the electronic device can display the second interface in the second area in response to the first input, since the second interface includes N
  • the image of the area corresponding to the first virtual key, and the second virtual key associated with the N first virtual keys can be obtained through the image of the area corresponding to the first virtual key without operating the second virtual key. Triggering the associated second virtual key avoids operation inconvenience caused by directly operating the virtual key on the application interface, and improves the convenience of the electronic device.
  • the second virtual key in the second interface can trigger the same function as the first virtual key in the first interface, only the corresponding area size is different when displayed, that is, the first interface and the second interface are separated by The application interface is displayed with different display ratios.
  • the size of the second interface is larger than the size of the first interface.
  • the preset display ratio is an optional display ratio designed for a standard screen, such as a diagonal of 6 inches, 18:9.
  • the first area is adapted to the optimal display ratio
  • the second area is a display area of the electronic device.
  • the method of the embodiment of the present application can be executed by a tablet computer, and the application program B is run on the tablet computer, and the interface of the application program B (such as a game program) is designed for a standard mobile phone screen, such as the user Through the "Game Assistant” or other portals, click to open "Game Operation Adaptation", which will trigger the display of the interface of the application B in the first area with the optimal display ratio designed. Afterwards, the user can display in the second area the images corresponding to the N first virtual keys in the first interface and the second virtual keys associated with the N first virtual keys through the first input.
  • step 102 after step 102, it also includes:
  • the target virtual key is a second virtual key associated with the first virtual key corresponding to the second input in the second interface.
  • the second input is an input corresponding to the area where the image of the first virtual button in the second interface is located, such as clicking on the image of the first virtual button displayed on the second interface (the image of virtual button C on the first interface) .
  • the virtual key C is triggered by the association between the second virtual key (virtual key C) and a specific area (the area where the image of the first virtual key is located in the second interface) in the second interface.
  • the second virtual key in the second interface has established an association relationship with the area where the specific image (the image of the area where the first virtual key is located in the first interface) in the second interface is located, if the received The user's second input to the area where the specific image is located will trigger the corresponding second virtual key in the second interface, that is, the target virtual key, in response to the second input.
  • step 102 displaying the second interface in the second area includes:
  • the electronic device automatically recognizes the S first virtual keys in the image of the first interface based on the image of the first interface when the first input received is automatically recognized, and then obtains the S first virtual keys in the S first virtual keys.
  • the initial image of the N first virtual keys in the image of the first interface is synthesized by combining the initial image with the first interface processed according to the first display ratio to obtain a second interface to realize fast adaptation processing.
  • the first interface displays the application interface
  • the image of the first interface may be understood as a screenshot of the first interface when the first interface displays the application interface.
  • the electronic device recognizes the edge of the virtual key in the image of the first interface 201 in the screen 1, thereby dividing the image of the first interface 201 into: the first virtual key image area 202 , the second virtual key image area 203 , the third virtual key image area 204 and the non-virtual key image area 205 .
  • the first virtual key image area 202 , the second virtual key image area 203 , and the third virtual key image area 204 are the third area.
  • the first display ratio is preset, and may be the display ratio of the full-screen display of the application interface on the screen of the electronic device, or other values, which will not be listed here.
  • step 102 the displaying the second interface in the second area includes:
  • the received first input is the user's manual division of the first interface
  • the electronic device divides the first interface in response to the first input.
  • the user's first input implements manual division of the virtual key image area and the non-virtual key image area.
  • the image of the third area is obtained by division, and the image of the third area is synthesized with the first interface processed according to the first display ratio to obtain a second interface, so as to realize fast adaptation processing.
  • the first interface 301 is displayed on the screen 1, and the first interface is in the first area at this time.
  • the first interface 301 will be divided into three based on the dividing lines.
  • Image areas a first image area 401 , a second image area 402 and a third image area 403 .
  • the first image area 401 and the second image area 402 are the third area because they include virtual button images
  • the third image area 403 is a non-virtual button image area because they do not include virtual button images.
  • the first image area 401 and the second image area 402 are merged with the first interface processed at the first display ratio to obtain a second interface, which is displayed in a second area such as a full-screen display area.
  • the first image area and the second image area are associated with the corresponding virtual keys in the second interface.
  • the image corresponding to the area where the clicked position is located is the image of the first virtual button.
  • the method further includes:
  • the target display parameter may be obtained by using Gaussian blur processing, which can realize blurred display of areas (non-image areas) in the screen except the first area.
  • Gaussian blur processing which can realize blurred display of areas (non-image areas) in the screen except the first area.
  • the electronic device uses Gaussian blur processing to blur the area 302 on the screen 1 except for the area where the first interface is located (that is, the non-image area) is blurred.
  • the merged second interface includes two parts.
  • the image corresponding to the third area in the second interface included in the second interface is draggable, so as to drag it to a position convenient for the user to operate.
  • the image when the image is dragged to an edge area of the screen (for example, an area 0-3 cm away from the edge of the screen), the image can be automatically attached to the edge of the screen. After the dragging is completed, it is combined with the first interface processed according to the first display ratio as the second interface, and displayed in the second area.
  • an edge area of the screen for example, an area 0-3 cm away from the edge of the screen
  • step 102 it also includes:
  • the third input is used to hide the display of the remaining part (the part except the third area in the first interface), so as to achieve the best display effect of the final second interface.
  • the third input may be the user's three-finger operation on the remaining part, and the remaining part disappears on the screen after flicking inward.
  • the third image area 403 disappears in the screen; after that, the user respectively drags the first image area 401 and the second image area 402 to the edge area of the screen.
  • a second interface 601 will be displayed on the screen 1 .
  • the second interface 601 includes the first interface processed according to the first display scale, and the first image area 401 and the second image area 402 .
  • the image of the third area included in the second interface and the edge of the screen edge area will produce an obvious dividing line to avoid visual errors.
  • step 102 also include:
  • the fourth input is used to wake up the adjustment state of the image corresponding to the third area.
  • the electronic device After receiving the fourth input, the electronic device enters the adjustment state, and the user can zoom or move the image corresponding to the third area of the first interface in this state. .
  • the manner of establishing an association relationship may be realized by establishing a coordinate relationship.
  • a coordinate system of 1920*1080 can be established for the first interface, and the same coordinate system can also be established for the second interface.
  • the first interface is divided and moved, record the moving distance, that is, the offset.
  • the first virtual key image area 202 Taking the movement of the first virtual key image area 202 in FIG. .
  • the current click coordinates are (x, y), based on the offset of the coordinate system and records, the coordinates in the second interface are (x+s1, y+s2) Simulate an identical click event.
  • the operation on the area where the virtual button image is located will still be fed back to the virtual button in the second interface, enabling more convenient operation.
  • the method of the embodiment of the present application can automatically adapt the application interface, and solve the problem of inconvenient operation caused by the incompatibility between the design of the virtual button position on the application interface and the screen of the electronic device.
  • the execution subject may be the interface display adaptation processing device, or the interface display adaptation processing device used to execute the interface display adaptation The control module for the processing method.
  • the interface display adaptation processing device performed by the interface display adaptation processing device is taken as an example to describe the interface display adaptation processing device provided in the embodiment of the present application.
  • Fig. 7 is a block diagram of an adaptation processing device displayed on an interface according to an embodiment of the present application.
  • the adaptation processing device shown in the interface shown in FIG. 7 includes a first receiving module 710 and a display module 720 .
  • the first receiving module 710 is configured to receive a first input from the user when the first interface is displayed in the first area;
  • a display module 720 configured to display a second interface in a second area in response to the first input
  • the first interface includes S first virtual keys
  • the second interface includes an image corresponding to a third area in the first interface
  • the third area is an image of the S first virtual keys
  • the second interface includes a second virtual key
  • the second virtual key is associated with the N first virtual keys
  • S and N are positive integers and S ⁇ N ⁇ 1.
  • the device also includes:
  • a second receiving module configured to receive a second input from the user on the second interface
  • a first processing module configured to trigger a target virtual key in response to the second input
  • the target virtual key is a second virtual key associated with the first virtual key corresponding to the second input in the second interface.
  • the display module includes:
  • a first acquiring submodule configured to acquire the image of the first interface
  • An identification submodule configured to identify the S first virtual keys in the image of the first interface
  • the second obtaining submodule is used to obtain the initial image of the N first virtual buttons in the first interface image in the S first virtual buttons;
  • the first processing submodule is used to combine the initial image with the first interface processed according to the first display ratio to obtain the second interface;
  • a first display submodule configured to display the second interface in the second area
  • the display module includes:
  • a second processing submodule configured to divide the first interface and obtain an image of the third area
  • a third processing submodule configured to combine the image in the third area with the first interface processed according to the first display ratio to obtain the second interface
  • the second display submodule is configured to display the second interface in the second area.
  • the device also includes:
  • a third receiving module configured to receive a third input from the user on the remaining part obtained after dividing the first interface, where the remaining part is a part of the first interface other than the third area;
  • a second processing module configured to hide the remaining part in response to the third input.
  • the device also includes:
  • a fourth receiving module configured to receive a fourth input from the user when the second interface is displayed
  • a third processing module configured to adjust the size or position of the image corresponding to the third area of the first interface in the second interface in response to the fourth input.
  • the device After receiving the first input from the user, the device can display the second interface in the second area in response to the first input, since the second interface includes images of areas corresponding to the N first virtual keys in the first interface, And, for the second virtual keys associated with the N first virtual keys, the image of the area corresponding to the first virtual keys can trigger the associated second virtual keys without operating the second virtual keys, avoiding The operation inconvenience caused by directly operating the virtual buttons on the application interface improves the convenience of the electronic device.
  • the adaptation processing device for interface display in the embodiment of the present application may be a device, or a component, an integrated circuit, or a chip in a terminal.
  • the device may be a mobile electronic device or a non-mobile electronic device.
  • the mobile electronic device can be a mobile phone, tablet computer, notebook computer, palmtop computer, vehicle-mounted electronic device, wearable device, ultra-mobile personal computer (ultra-mobile personal computer, UMPC), netbook or PDA, etc.
  • non-mobile electronic device may be a server, a network attached storage (Network Attached Storage, NAS), a personal computer (personal computer, PC), a television (television, TV), a teller machine or a self-service machine, etc., which are not specifically limited in this embodiment of the present application.
  • the adaptation processing device for interface display in the embodiment of the present application may be a device with an operating system.
  • the operating system may be an Android operating system, an ios operating system, or other possible operating systems, which are not specifically limited in this embodiment of the present application.
  • the interface display adaptation processing device provided in the embodiment of the present application can implement various processes implemented in the method embodiments in FIG. 1 to FIG. 6 , and details are not repeated here to avoid repetition.
  • the embodiment of the present application further provides an electronic device 800, including a processor 801, a memory 802, and programs or instructions stored in the memory 802 and operable on the processor 801,
  • the program or instruction is executed by the processor 801
  • the various processes of the above-mentioned interface display adaptation processing method embodiment can be achieved, and the same technical effect can be achieved. To avoid repetition, details are not repeated here.
  • the electronic devices in the embodiments of the present application include the above-mentioned mobile electronic devices and non-mobile electronic devices.
  • FIG. 9 is a schematic diagram of a hardware structure of an electronic device implementing various embodiments of the present application.
  • the electronic device 900 includes, but is not limited to: a radio frequency unit 901, a network module 902, an audio output unit 903, an input unit 904, a sensor 905, a display unit 906, a user input unit 907, an interface unit 908, a memory 909, and a processor 910, etc. part.
  • the electronic device 900 can also include a power supply (such as a battery) for supplying power to various components, and the power supply can be logically connected to the processor 910 through the power management system, so that the management of charging, discharging, and function can be realized through the power management system. Consumption management and other functions.
  • a power supply such as a battery
  • the structure of the electronic device shown in FIG. 9 does not constitute a limitation to the electronic device.
  • the electronic device may include more or fewer components than shown in the illustration, or combine certain components, or arrange different components. repeat.
  • the input unit 904 is configured to receive the user's first input
  • a display unit 906, configured to display a second interface in the second area in response to the first input
  • the first interface includes S first virtual keys
  • the second interface includes an image corresponding to a third area in the first interface
  • the third area is an image of the S first virtual keys
  • the second interface includes a second virtual key
  • the second virtual key is associated with the N first virtual keys
  • S and N are positive integers and S ⁇ N ⁇ 1.
  • the electronic device After the electronic device receives the user's first input, it can display the second interface in the second area in response to the first input, since the second interface includes images of areas corresponding to N first virtual keys in the first interface, And, for the second virtual keys associated with the N first virtual keys, the image of the area corresponding to the first virtual keys can trigger the associated second virtual keys without operating the second virtual keys, avoiding The operation inconvenience caused by directly operating the virtual buttons on the application interface improves the convenience of the electronic device.
  • the input unit 904 is further configured to receive a second input from the user on the second interface;
  • a processor 910 configured to trigger a target virtual key in response to the second input
  • the target virtual key is a second virtual key associated with the first virtual key corresponding to the second input in the second interface
  • the processor 910 is further configured to acquire the image of the first interface; identify S first virtual keys in the image of the first interface; acquire N of the S first virtual keys an initial image of the first virtual button in the image of the first interface; combining the initial image with the first interface processed according to the first display ratio to obtain the second interface;
  • the display unit 906 is further configured to display the second interface in the second area.
  • the processor 910 is further configured to divide the first interface and obtain an image of the third area; merge the image of the third area with the first interface processed according to the first display ratio to obtain the second interface;
  • the display unit 906 is further configured to display the second interface in the second area. ;
  • the input unit 904 is further configured to receive a third input from the user on the remaining part obtained after dividing the first interface, and the remaining part is the first interface except the third area outside part;
  • the processor 910 is further configured to hide the remaining part in response to the third input.
  • the input unit 904 is further configured to receive a fourth input from the user when the second interface is displayed;
  • the processor 910 is further configured to, in response to the fourth input, adjust the size or position of the image corresponding to the third area of the first interface in the second interface.
  • the input unit 904 may include a graphics processor (Graphics Processing Unit, GPU) 9041 and a microphone 9042, and the graphics processor 9041 is used for the image capture device (such as the image data of the still picture or video obtained by the camera) for processing.
  • the display unit 906 may include a display panel 9061, and the display panel 9061 may be configured in the form of a liquid crystal display, an organic light emitting diode, or the like.
  • the user input unit 907 includes a touch panel 9071 and other input devices 9072 .
  • the touch panel 9071 is also called a touch screen.
  • the touch panel 9071 may include two parts, a touch detection device and a touch controller.
  • Other input devices 9072 may include, but are not limited to, physical keyboards, function keys (such as volume control buttons, switch buttons, etc.), trackballs, mice, and joysticks, which will not be repeated here.
  • the memory 909 can be used to store software programs as well as various data, including but not limited to application programs and operating systems.
  • the processor 910 may integrate an application processor and a modem processor, wherein the application processor mainly processes an operating system, user interface, application program, etc., and the modem processor mainly processes wireless communication. It can be understood that, the above modem processor may not be integrated into the processor 910
  • the embodiment of the present application also provides a readable storage medium, on which a program or instruction is stored, and when the program or instruction is executed by the processor, each process of the above-mentioned interface display adaptation processing method embodiment is implemented, and The same technical effect can be achieved, so in order to avoid repetition, details will not be repeated here.
  • the processor is the processor in the electronic device described in the above embodiments.
  • the readable storage medium includes a computer readable storage medium, such as a read-only memory (Read-Only Memory, ROM for short), a random access memory (Random Access Memory, RAM for short), a magnetic disk or an optical disk, and the like.
  • the embodiment of the present application further provides a chip, the chip includes a processor and a communication interface, the communication interface is coupled to the processor, the processor is used to run programs or instructions, and realize the adaptation processing of the above-mentioned interface display
  • the chip includes a processor and a communication interface
  • the communication interface is coupled to the processor
  • the processor is used to run programs or instructions, and realize the adaptation processing of the above-mentioned interface display
  • chips mentioned in the embodiments of the present application may also be called system-on-chip, system-on-chip, system-on-a-chip, or system-on-a-chip.
  • the term “comprising”, “comprising” or any other variation thereof is intended to cover a non-exclusive inclusion such that a process, method, article or apparatus comprising a set of elements includes not only those elements, It also includes other elements not expressly listed, or elements inherent in the process, method, article, or device. Without further limitations, an element defined by the phrase “comprising a " does not preclude the presence of additional identical elements in the process, method, article, or apparatus comprising that element.
  • the scope of the methods and devices in the embodiments of the present application is not limited to performing functions in the order shown or discussed, and may also include performing functions in a substantially simultaneous manner or in reverse order according to the functions involved. Functions are performed, for example, the described methods may be performed in an order different from that described, and various steps may also be added, omitted, or combined. Additionally, features described with reference to certain examples may be combined in other examples.

Abstract

An interface display adaptation processing method and apparatus, and an electronic device (800), which relate to the technical field of communications. The method comprises: receiving a first input of a user when a first interface (201, 301) is displayed in a first region (101); and in response to the first input, displaying a second interface (601) in a second region, wherein the first interface (201, 301) comprises S first virtual keys, the second interface (601) comprises an image corresponding to a third region in the first interface (201, 301), the third region is a region corresponding to N first virtual keys among the S first virtual keys, the second interface (601) comprises a second virtual key, an association is established between the second virtual key and the N first virtual keys, S and N are positive integers, and S≥N≥1 (102).

Description

界面显示的适配处理方法、装置和电子设备Interface display adaptation processing method, device and electronic equipment
相关申请的交叉引用Cross References to Related Applications
本申请主张在2021年8月26日在中国提交的中国专利申请No.202110986863.0的优先权,其全部内容通过引用包含于此。This application claims priority to Chinese Patent Application No. 202110986863.0 filed in China on August 26, 2021, the entire contents of which are hereby incorporated by reference.
技术领域technical field
本申请属于通信技术领域,具体涉及一种界面显示的适配处理方法、装置和电子设备。The present application belongs to the technical field of communications, and in particular relates to an interface display adaptation processing method, device and electronic equipment.
背景技术Background technique
手机和平板虽然硬件配置有很大不同,但是往往应用程序(Application,APP)是共用的。例如平板端运行的多数游戏实际是针对手机端运行设计的游戏。Although the hardware configurations of the mobile phone and the tablet are very different, the application program (Application, APP) is often shared. For example, most of the games running on the tablet terminal are actually games designed for running on the mobile terminal.
然而,针对手机端运行设计的应用程序,其用户界面(User Interface,UI)尺寸也是考虑手机的屏幕尺寸设计的,在手机端操作更为方便,但在平板端进行等比例适配后,则会出现按钮过大、滑动距离过长、拇指无法覆盖操作区域等各种问题,降低平板端的使用便捷性。However, the size of the user interface (UI) of an application designed for running on a mobile phone is also designed in consideration of the screen size of the mobile phone. There will be various problems such as too large buttons, too long sliding distance, and the thumb cannot cover the operation area, which will reduce the convenience of using the tablet terminal.
发明内容Contents of the invention
本申请实施例的目的是提供一种界面显示的适配处理方法、装置和电子设备,能够解决终端与应用程序界面不适配而降低使用便捷性的问题。The purpose of the embodiments of the present application is to provide an interface display adaptation processing method, device, and electronic device, which can solve the problem that the terminal does not match the interface of the application program and reduces the convenience of use.
第一方面,本申请的实施例提供了一种界面显示的适配处理方法,该方法包括:In the first aspect, the embodiment of the present application provides an interface display adaptation processing method, the method includes:
在第一区域显示第一界面的情况下,接收用户的第一输入;When the first interface is displayed in the first area, receiving a first input from the user;
响应于所述第一输入,在第二区域显示第二界面;displaying a second interface in a second area in response to the first input;
其中,所述第一界面包括S个第一虚拟按键,所述第二界面包括所述第一界面中第三区域对应的图像,所述第三区域为所述S个第一虚拟按键中的 N个第一虚拟按键对应的区域;且所述第二界面包括第二虚拟按键,所述第二虚拟按键与所述N个第一虚拟按键建立有关联关系;S、N为正整数且S≥N≥1。Wherein, the first interface includes S first virtual keys, the second interface includes an image corresponding to a third area in the first interface, and the third area is an image of the S first virtual keys The area corresponding to the N first virtual keys; and the second interface includes a second virtual key, and the second virtual key is associated with the N first virtual keys; S and N are positive integers and S ≥N≥1.
第二方面,本申请的实施例提供了一种界面显示的适配处理装置,包括:In the second aspect, the embodiment of the present application provides an interface display adaptation processing device, including:
第一接收模块,用于在第一区域显示第一界面的情况下,接收用户的第一输入;A first receiving module, configured to receive a first input from a user when the first interface is displayed in the first area;
显示模块,用于响应于所述第一输入,在第二区域显示第二界面;a display module, configured to display a second interface in a second area in response to the first input;
其中,所述第一界面包括S个第一虚拟按键,所述第二界面包括所述第一界面中第三区域对应的图像,所述第三区域为所述S个第一虚拟按键中的N个第一虚拟按键对应的区域;且所述第二界面包括第二虚拟按键,所述第二虚拟按键与所述N个第一虚拟按键建立有关联关系;S、N为正整数且S≥N≥1。Wherein, the first interface includes S first virtual keys, the second interface includes an image corresponding to a third area in the first interface, and the third area is an image of the S first virtual keys The area corresponding to the N first virtual keys; and the second interface includes a second virtual key, and the second virtual key is associated with the N first virtual keys; S and N are positive integers and S ≥N≥1.
第三方面,本申请实施例还提供了一种电子设备,该电子设备包括处理器、存储器及存储在所述存储器上并可在所述处理器上运行的程序或指令,所述程序或指令被所述处理器执行时实现如第一方面所述的方法的步骤。In the third aspect, the embodiment of the present application also provides an electronic device, the electronic device includes a processor, a memory, and a program or instruction stored in the memory and operable on the processor, the program or instruction When executed by the processor, the steps of the method according to the first aspect are realized.
第四方面,本申请实施例还提供了一种可读存储介质,所述可读存储介质上存储程序或指令,所述程序或指令被处理器执行时实现如第一方面所述的方法的步骤。In the fourth aspect, the embodiment of the present application also provides a readable storage medium, on which a program or instruction is stored, and when the program or instruction is executed by a processor, the method according to the first aspect is implemented. step.
第五方面,本申请实施例提供了一种芯片,所述芯片包括处理器和通信接口,所述通信接口和所述处理器耦合,所述处理器用于运行程序或指令,实现如第一方面所述的方法。In the fifth aspect, the embodiment of the present application provides a chip, the chip includes a processor and a communication interface, the communication interface is coupled to the processor, and the processor is used to run programs or instructions, so as to implement the first aspect the method described.
第六方面,提供了一种计算机程序产品,所述计算机程序产品被存储在非易失的存储介质中,所述计算机程序产品被至少一个处理器执行以实现如第一方面所述的方法。In a sixth aspect, a computer program product is provided, the computer program product is stored in a non-volatile storage medium, and the computer program product is executed by at least one processor to implement the method as described in the first aspect.
第七方面,提供了一种通信设备,被配置为执行如第一方面所述的方法。In a seventh aspect, there is provided a communication device configured to execute the method described in the first aspect.
在本申请实施例中,接收到用户的第一输入后,响应于该第一输入,能够在第二区域显示第二界面,由于该第二界面包括第一界面中N个第一虚拟 按键对应区域的图像,以及,与该N个第一虚拟按键建立有关联关系的第二虚拟按键,无需对第二虚拟按键进行操作,通过第一虚拟按键对应的区域的图像就能够触发关联的第二虚拟按键,避免直接对应用界面的虚拟按键进行操作而造成的操作不便,提升电子设备的便捷性。In the embodiment of the present application, after receiving the first input from the user, in response to the first input, the second interface can be displayed in the second area, since the second interface includes N first virtual keys in the first interface corresponding to The image of the region, and the second virtual button associated with the N first virtual buttons can trigger the associated second virtual button through the image of the region corresponding to the first virtual button without operating the second virtual button. The virtual button avoids the inconvenience caused by directly operating the virtual button on the application interface, and improves the convenience of the electronic device.
附图说明Description of drawings
图1为本申请实施例的界面显示的适配处理方法的流程示意图;FIG. 1 is a schematic flowchart of an adaptation processing method displayed on an interface in an embodiment of the present application;
图2为电子设备的屏幕显示示意图之一;Fig. 2 is one of the screen display schematic diagrams of the electronic device;
图3为电子设备的屏幕显示示意图之二;Fig. 3 is the second schematic diagram of the screen display of the electronic device;
图4为电子设备的屏幕显示示意图之三;Fig. 4 is the third schematic diagram of the screen display of the electronic device;
图5为电子设备的屏幕显示示意图之四;Fig. 5 is the fourth schematic diagram of the screen display of the electronic device;
图6为电子设备的屏幕显示示意图之五;Fig. 6 is the fifth schematic diagram of the screen display of the electronic device;
图7为本申请实施例的界面显示的适配处理装置的结构示意图;FIG. 7 is a schematic structural diagram of an adaptation processing device displayed on an interface of an embodiment of the present application;
图8为本申请实施例的电子设备的结构示意图;FIG. 8 is a schematic structural diagram of an electronic device according to an embodiment of the present application;
图9为本申请另一实施例的电子设备的结构示意图。FIG. 9 is a schematic structural diagram of an electronic device according to another embodiment of the present application.
具体实施方式Detailed ways
下面将结合本申请实施例中的附图,对本申请实施例中的技术方案进行清楚地描述,显然,所描述的实施例是本申请一部分实施例,而不是全部的实施例。基于本申请中的实施例,本领域普通技术人员获得的所有其他实施例,都属于本申请保护的范围。The following will clearly describe the technical solutions in the embodiments of the present application with reference to the drawings in the embodiments of the present application. Obviously, the described embodiments are part of the embodiments of the present application, but not all of them. All other embodiments obtained by persons of ordinary skill in the art based on the embodiments in this application belong to the protection scope of this application.
本申请的说明书和权利要求书中的术语“第一”、“第二”等是用于区别类似的对象,而不用于描述特定的顺序或先后次序。应该理解这样使用的数据在适当情况下可以互换,以便本申请的实施例能够以除了在这里图示或描述的那些以外的顺序实施,且“第一”、“第二”等所区分的对象通常为一类,并不限定对象的个数,例如第一对象可以是一个,也可以是多个。此外,说明书以及权利要求中“和/或”表示所连接对象的至少其中之一,字符“/”,一般表示前后关联对象是一种“或”的关系。The terms "first", "second" and the like in the specification and claims of the present application are used to distinguish similar objects, and are not used to describe a specific sequence or sequence. It should be understood that the terms so used are interchangeable under appropriate circumstances such that the embodiments of the application can be practiced in sequences other than those illustrated or described herein, and that references to "first," "second," etc. distinguish Objects are generally of one type, and the number of objects is not limited. For example, there may be one or more first objects. In addition, "and/or" in the specification and claims means at least one of the connected objects, and the character "/" generally means that the related objects are an "or" relationship.
下面结合附图,通过具体的实施例及其应用场景对本申请实施例提供的一种界面显示的适配处理方法和电子设备进行详细地说明。A method for adapting an interface display provided by an embodiment of the present application and an electronic device will be described in detail below through specific embodiments and application scenarios with reference to the accompanying drawings.
如图1所示,本申请实施例的界面显示的适配处理方法,包括:As shown in Figure 1, the adaptation processing method of the interface display in the embodiment of the present application includes:
步骤101,在第一区域显示第一界面的情况下,接收用户的第一输入。 Step 101, receiving a first input from a user when a first interface is displayed in a first area.
这里,第一输入是触发对第一区域当前显示的第一界面进行处理的输入,触发步骤102。电子设备显示第一界面后,用户可以通过预先设置的输入方式实现该第一输入。具体的,该第一输入可以是基于物理按键或虚拟按键的输入,也可以是通过生物识别技术的输入,如语音、触碰、红外、手势等。当然,该实施例中其它输入也是预先设置的,同第一输入,也可有多种实现方式。Here, the first input is an input that triggers the processing of the first interface currently displayed in the first area, which triggers step 102 . After the electronic device displays the first interface, the user can implement the first input through a preset input method. Specifically, the first input may be an input based on a physical key or a virtual key, or may be an input through a biometric technology, such as voice, touch, infrared, gesture, and the like. Of course, other inputs in this embodiment are also pre-set, and the same as the first input, there may also be multiple implementations.
其中,第一界面是应用界面。该第一界面在第一区域以预设显示比例显示的界面,能够实现更为清晰的显示。考虑到电子设备屏幕与该预设显示比例不适配,在第一区域显示该第一界面,是用户触发应用界面显示的适配处理功能后执行的。Wherein, the first interface is an application interface. The first interface is displayed in the first region with a preset display ratio, which can realize clearer display. Considering that the screen of the electronic device does not match the preset display ratio, displaying the first interface in the first area is executed after the user triggers the adaptation processing function of displaying the application interface.
步骤102,响应于所述第一输入,在第二区域显示第二界面;其中,所述第一界面包括S个第一虚拟按键,所述第二界面包括所述第一界面中第三区域对应的图像,所述第三区域为所述S个第一虚拟按键中的N个第一虚拟按键对应的区域;且所述第二界面包括第二虚拟按键,所述第二虚拟按键与所述N个第一虚拟按键建立有关联关系;S、N为正整数且S≥N≥1。 Step 102, in response to the first input, display a second interface in a second area; wherein, the first interface includes S first virtual keys, and the second interface includes a third area in the first interface Corresponding image, the third area is the area corresponding to the N first virtual keys in the S first virtual keys; and the second interface includes a second virtual key, and the second virtual key is the same as the The N first virtual keys are associated with each other; S and N are positive integers and S≥N≥1.
本步骤中,响应于步骤101接收到的第一输入,会在第二区域显示第二界面,即,在第二区域中,显示第一界面中N个第一虚拟按键对应区域的图像,以及,显示与该N个第一虚拟按键建立有关联关系的第二虚拟按键。In this step, in response to the first input received in step 101, the second interface will be displayed in the second area, that is, in the second area, images of the areas corresponding to the N first virtual keys in the first interface will be displayed, and to display the second virtual keys associated with the N first virtual keys.
这里,第二虚拟按键的数量也为N个,与N个第一虚拟按键一一对应。而所建立的第二虚拟按键与N个第一虚拟按键关联关系,是该第二界面中第一虚拟按键的图像所处区域与第二虚拟按键的关联关系,以保证基于第二区域,用户在第一虚拟按键的图像所处区域的输入能够触发对应的第二虚拟按键。例如,第二界面中的虚拟按键A,与其具有关联关系的是该第二界面中 的特定区域,该特定区域是第一界面上虚拟按键A图像在该第二界面显示时所处的区域。Here, the number of the second virtual keys is also N, corresponding to the N first virtual keys one by one. The established second virtual key and N first virtual key associations are the associations between the area where the image of the first virtual key is located in the second interface and the second virtual key, so as to ensure that based on the second area, the user The input in the area where the image of the first virtual key is located can trigger the corresponding second virtual key. For example, the virtual key A in the second interface is associated with a specific area in the second interface, and the specific area is the area where the image of the virtual key A on the first interface is displayed on the second interface.
这样,电子设备按照上述步骤101-102,在接收到用户的第一输入后,响应于该第一输入,能够在第二区域显示第二界面,由于该第二界面包括第一界面中N个第一虚拟按键对应区域的图像,以及,与该N个第一虚拟按键建立有关联关系的第二虚拟按键,无需对第二虚拟按键进行操作,通过第一虚拟按键对应的区域的图像就能够触发关联的第二虚拟按键,避免直接对应用界面的虚拟按键进行操作而造成的操作不便,提升电子设备的便捷性。In this way, according to the above steps 101-102, after receiving the first input from the user, the electronic device can display the second interface in the second area in response to the first input, since the second interface includes N The image of the area corresponding to the first virtual key, and the second virtual key associated with the N first virtual keys can be obtained through the image of the area corresponding to the first virtual key without operating the second virtual key. Triggering the associated second virtual key avoids operation inconvenience caused by directly operating the virtual key on the application interface, and improves the convenience of the electronic device.
该实施例中,第二界面的第二虚拟按键与第一界面中第一虚拟按键能够触发相同的功能,仅是显示时对应的区域大小存在差异,也就是,第一界面和第二界面以不同的显示比例显示应用界面,可选地,第二界面的尺寸大于第一界面的尺寸。In this embodiment, the second virtual key in the second interface can trigger the same function as the first virtual key in the first interface, only the corresponding area size is different when displayed, that is, the first interface and the second interface are separated by The application interface is displayed with different display ratios. Optionally, the size of the second interface is larger than the size of the first interface.
其中,所述预设显示比例是针对标准屏幕设计的可选显示比例,如对角线6英寸,18:9。Wherein, the preset display ratio is an optional display ratio designed for a standard screen, such as a diagonal of 6 inches, 18:9.
可选地,第一区域与该最优显示比例适配,第二区域为电子设备的显示区域。Optionally, the first area is adapted to the optimal display ratio, and the second area is a display area of the electronic device.
应该知道的是,本申请实施例的方法,可由平板电脑执行,在平板电脑运行应用程序B,而该应用程序B(如某游戏程序)的界面是针对标准手机屏幕设计的场景下,如用户通过“游戏助手”或者其他入口,点击打开“游戏操作适配”,会触发将该应用程序B的界面以设计的最优显示比例在第一区域显示。之后,用户可通过第一输入,在第二区域显示第一界面中N个第一虚拟按键对应区域的图像,以及与该N个第一虚拟按键建立有关联关系的第二虚拟按键。It should be known that the method of the embodiment of the present application can be executed by a tablet computer, and the application program B is run on the tablet computer, and the interface of the application program B (such as a game program) is designed for a standard mobile phone screen, such as the user Through the "Game Assistant" or other portals, click to open "Game Operation Adaptation", which will trigger the display of the interface of the application B in the first area with the optimal display ratio designed. Afterwards, the user can display in the second area the images corresponding to the N first virtual keys in the first interface and the second virtual keys associated with the N first virtual keys through the first input.
可选地,该实施例中,步骤102之后,还包括:Optionally, in this embodiment, after step 102, it also includes:
接收所述用户对所述第二界面的第二输入;receiving a second input from the user on the second interface;
响应于所述第二输入,触发目标虚拟按键;triggering a target virtual key in response to the second input;
其中,所述目标虚拟按键是所述第二界面中,与所述第二输入对应的第 一虚拟按键相关联的第二虚拟按键。Wherein, the target virtual key is a second virtual key associated with the first virtual key corresponding to the second input in the second interface.
这里,第二输入是对应第二界面中第一虚拟按键的图像所处区域的输入,如对第二界面显示的第一虚拟按键的图像(虚拟按键C在第一界面上的图像)的点击。而由第二界面中第二虚拟按键(虚拟按键C)与特定区域(第一虚拟按键的图像在第二界面所处的区域)建立的关联关系,则触发该虚拟按键C。Here, the second input is an input corresponding to the area where the image of the first virtual button in the second interface is located, such as clicking on the image of the first virtual button displayed on the second interface (the image of virtual button C on the first interface) . The virtual key C is triggered by the association between the second virtual key (virtual key C) and a specific area (the area where the image of the first virtual key is located in the second interface) in the second interface.
也就是,在第二界面中的第二虚拟按键已与第二界面中特定图像(第一界面中第一虚拟按键所处区域的图像)所处区域建立有关联关系的情况下,若接收到用户对该特定图像所处区域的第二输入,则会响应于该第二输入,触发该第二界面中对应的第二虚拟按键,即目标虚拟按键。That is, in the case where the second virtual key in the second interface has established an association relationship with the area where the specific image (the image of the area where the first virtual key is located in the first interface) in the second interface is located, if the received The user's second input to the area where the specific image is located will trigger the corresponding second virtual key in the second interface, that is, the target virtual key, in response to the second input.
还应该知道的是,该实施例中,考虑到用户个性化需求,以及适配快捷实现性,一方面,可选地,步骤102中,在第二区域显示所述第二界面包括:It should also be known that, in this embodiment, considering the user's individual needs and the realization of fast adaptation, on the one hand, optionally, in step 102, displaying the second interface in the second area includes:
获取所述第一界面的图像;acquiring an image of the first interface;
识别出所述第一界面的图像中的S个第一虚拟按键;Recognizing S first virtual keys in the image of the first interface;
获取所述S个第一虚拟按键中的N个第一虚拟按键在所述第一界面的图像中的初始图像;Acquiring initial images of the N first virtual keys among the S first virtual keys in the image of the first interface;
将所述初始图像与按照第一显示比例处理后的第一界面合成,得到所述第二界面;combining the initial image with the first interface processed according to the first display ratio to obtain the second interface;
将所述第二界面显示在所述第二区域display the second interface in the second area
如此,接收的第一输入是自动识别的触发电子设备会基于第一界面的图像,自动识别出第一界面的图像中的S个第一虚拟按键,继而获取该S个第一虚拟按键中的N个第一虚拟按键在第一界面的图像中的初始图像,从而通过将该初始图像与按照第一显示比例处理后的第一界面合成,得到第二界面,实现快速适配处理。In this way, the electronic device automatically recognizes the S first virtual keys in the image of the first interface based on the image of the first interface when the first input received is automatically recognized, and then obtains the S first virtual keys in the S first virtual keys. The initial image of the N first virtual keys in the image of the first interface is synthesized by combining the initial image with the first interface processed according to the first display ratio to obtain a second interface to realize fast adaptation processing.
其中,第一界面显示应用界面,第一界面的图像,可以理解为第一界面显示应用界面时,第一界面的截图。具体地,识别虚拟按键的方式,如图2所示,电子设备识别屏幕1中第一界面201的图像中虚拟按键的边缘,从而 将第一界面201的图像划分为:第一虚拟按键图像区域202、第二虚拟按键图像区域203、第三虚拟按键图像区域204以及非虚拟按键图像区域205。这里,第一虚拟按键图像区域202、第二虚拟按键图像区域203、第三虚拟按键图像区域204即第三区域。Wherein, the first interface displays the application interface, and the image of the first interface may be understood as a screenshot of the first interface when the first interface displays the application interface. Specifically, the way of identifying the virtual key, as shown in FIG. 2 , the electronic device recognizes the edge of the virtual key in the image of the first interface 201 in the screen 1, thereby dividing the image of the first interface 201 into: the first virtual key image area 202 , the second virtual key image area 203 , the third virtual key image area 204 and the non-virtual key image area 205 . Here, the first virtual key image area 202 , the second virtual key image area 203 , and the third virtual key image area 204 are the third area.
其中,第一显示比例是预先设置的,可以是应用界面在电子设备屏幕上的全屏显示的显示比例,当然也可以是其他值,在此不再一一列举。Wherein, the first display ratio is preset, and may be the display ratio of the full-screen display of the application interface on the screen of the electronic device, or other values, which will not be listed here.
另一方面,可选地,步骤102中,所述在第二区域显示所述第二界面包括:On the other hand, optionally, in step 102, the displaying the second interface in the second area includes:
划分所述第一界面并获得所述第三区域的图像;dividing the first interface and obtaining an image of the third area;
将所述第三区域的图像与按照第一显示比例处理后的第一界面合并,得到所述第二界面;Merging the image in the third area with the first interface processed according to the first display ratio to obtain the second interface;
将所述第二界面显示在所述第二区域。displaying the second interface in the second area.
即,接收的第一输入是用户对第一界面的手动划分,电子设备响应于该第一输入,划分该第一界面。具体的,用户的第一输入实现对虚拟按键图像区域和非虚拟按键图像区域的手动划分。之后,由划分获得第三区域的图像,并通过将该第三区域的图像与按照第一显示比例处理后的第一界面合成,得到第二界面,实现快速适配处理。That is, the received first input is the user's manual division of the first interface, and the electronic device divides the first interface in response to the first input. Specifically, the user's first input implements manual division of the virtual key image area and the non-virtual key image area. Afterwards, the image of the third area is obtained by division, and the image of the third area is synthesized with the first interface processed according to the first display ratio to obtain a second interface, so as to realize fast adaptation processing.
例如,电子设备接收用户的第一输入后,如图3、图4所示,在屏幕1中显示第一界面301,此时第一界面处于第一区域。之后,若如图4所示,用户通过第一输入,在该第一界面301上画出两条分割线(图中弧形虚线),该第一界面301将基于该分割线划分为三个图像区域:第一图像区域401、第二图像区域402和第三图像区域403。其中,第一图像区域401和第二图像区域402因包括虚拟按键图像,为第三区域,而第三图像区域403因未包括虚拟按键图像是非虚拟按键图像区域。之后第一图像区域401、第二图像区域402会与以第一显示比例处理的第一界面合并,得到第二界面,并在第二区域如全屏显示区显示。For example, after the electronic device receives the user's first input, as shown in FIG. 3 and FIG. 4 , the first interface 301 is displayed on the screen 1, and the first interface is in the first area at this time. Afterwards, as shown in Figure 4, if the user draws two dividing lines (arc dotted lines in the figure) on the first interface 301 through the first input, the first interface 301 will be divided into three based on the dividing lines. Image areas: a first image area 401 , a second image area 402 and a third image area 403 . Wherein, the first image area 401 and the second image area 402 are the third area because they include virtual button images, and the third image area 403 is a non-virtual button image area because they do not include virtual button images. Afterwards, the first image area 401 and the second image area 402 are merged with the first interface processed at the first display ratio to obtain a second interface, which is displayed in a second area such as a full-screen display area.
而在第二界面中,第一图像区域、第二图像区域是与第二界面中对应的 虚拟按键相关联的,当用户在第二界面中的第一图像区域或第二图像区域点击,会触发与该点击位置所处区域建立有关联关系的第二虚拟按键执行对应操作。这里,点击位置所处区域对应的图像是第一虚拟按键的图像。In the second interface, the first image area and the second image area are associated with the corresponding virtual keys in the second interface. When the user clicks on the first image area or the second image area in the second interface, the Trigger the second virtual button associated with the area where the clicked position is located to execute the corresponding operation. Here, the image corresponding to the area where the clicked position is located is the image of the first virtual button.
此外,考虑到屏幕上,第一区域存在并未占用全屏显示区域,为突出该第一界面,可选地,所述方法还包括:In addition, considering that the first area exists on the screen and does not occupy the full-screen display area, in order to highlight the first interface, optionally, the method further includes:
在第一区域显示第一界面时,按照目标显示参数显示屏幕中除所述第一区域之外的区域。When the first interface is displayed in the first area, areas in the screen other than the first area are displayed according to target display parameters.
这里,目标显示参数可以是使用高斯模糊处理所得,可实现屏幕中除所述第一区域之外的区域(非图像区域)的模糊显示。具体的,如图3所示,电子设备在将第一区域显示第一界面301后,通过使用高斯模糊处理,将屏幕1上除该第一界面所处区域之外的区域302(即非图像区域)模糊显示。Here, the target display parameter may be obtained by using Gaussian blur processing, which can realize blurred display of areas (non-image areas) in the screen except the first area. Specifically, as shown in FIG. 3 , after displaying the first interface 301 in the first area, the electronic device uses Gaussian blur processing to blur the area 302 on the screen 1 except for the area where the first interface is located (that is, the non-image area) is blurred.
另外,由上述内容可知,自动识别或手动划分,会将第一界面划分为包括虚拟按键图像的区域和不包括虚拟按键图像的区域,而用户会在第二界面中,基于显示的该包括虚拟按键图像的区域进行第二输入。该实施例中,合并的第二界面包括两部分,如此,为避免该第二界面中,第三区域对应的图像对按照第一显示比例处理的第一界面显示的遮挡,可选地,所述第二界面包括的第一界面中第三区域对应的图像是可拖动的,以将其拖动至用户便于操作的位置。其中,当该图像拖动至屏幕边缘区域(如距离屏幕边缘为0~3cm的区域)时,图像可以自动吸附屏幕边缘。在拖动完成后,将其与按照第一显示比例处理的第一界面合并作为第二界面,并在第二区域显示。In addition, it can be seen from the above content that automatic recognition or manual division will divide the first interface into an area including virtual button images and an area not including virtual button images, and the user will, in the second interface, based on the displayed virtual button image. The area of the button image is used for the second input. In this embodiment, the merged second interface includes two parts. In this way, in order to avoid the image corresponding to the third area in the second interface from blocking the display of the first interface processed according to the first display ratio, optionally, the The image corresponding to the third area in the first interface included in the second interface is draggable, so as to drag it to a position convenient for the user to operate. Wherein, when the image is dragged to an edge area of the screen (for example, an area 0-3 cm away from the edge of the screen), the image can be automatically attached to the edge of the screen. After the dragging is completed, it is combined with the first interface processed according to the first display ratio as the second interface, and displayed in the second area.
当然,第一界面划分为包括虚拟按键图像的区域和不包括虚拟按键图像的区域后,两个区域都可自由拖动。但考虑到最终第二界面的最佳显示,可选地,该实施例中,步骤102之后,还包括:Certainly, after the first interface is divided into an area including the virtual key image and an area not including the virtual key image, both areas can be freely dragged. However, considering the optimal display of the final second interface, optionally, in this embodiment, after step 102, it also includes:
接收所述用户对划分所述第一界面后获得的剩余部分的第三输入,所述剩余部分为所述第一界面中除所述第三区域之外的部分;receiving a third input from the user on the remaining part obtained after dividing the first interface, where the remaining part is a part of the first interface other than the third area;
响应于所述第三输入,隐藏所述剩余部分。In response to the third input, the remainder is hidden.
这里,第三输入用于隐藏剩余部分(第一界面中除第三区域之外的部分) 的显示,来达到最终第二界面的最佳显示效果。具体的,该第三输入可以是用户对该剩余部分的三指操作,向内聚合滑动后,该剩余部分在屏幕中消失。Here, the third input is used to hide the display of the remaining part (the part except the third area in the first interface), so as to achieve the best display effect of the final second interface. Specifically, the third input may be the user's three-finger operation on the remaining part, and the remaining part disappears on the screen after flicking inward.
例如,对于图4所示第一图像区域401、第二图像区域402和第三图像区域403,如图5所示,在用户对屏幕1中第三图像区域403三指操作向内聚合滑动后,第三图像区域403在屏幕中消失;之后,用户分别拖动第一图像区域401和第二图像区域402至屏幕边缘区域。在拖动完成后,如图6所示,屏幕1中会显示第二界面601。而第二界面601包括按照第一显示比例处理的第一界面,以及第一图像区域401和第二图像区域402。其中,如第一图像区域401和第二图像区域402,第二界面中包括的第三区域的图像与屏幕边缘区域的边缘会产生明显的分割线,避免产生视觉错误。For example, for the first image area 401, the second image area 402, and the third image area 403 shown in FIG. 4, as shown in FIG. , the third image area 403 disappears in the screen; after that, the user respectively drags the first image area 401 and the second image area 402 to the edge area of the screen. After the dragging is completed, as shown in FIG. 6 , a second interface 601 will be displayed on the screen 1 . The second interface 601 includes the first interface processed according to the first display scale, and the first image area 401 and the second image area 402 . Wherein, like the first image area 401 and the second image area 402 , the image of the third area included in the second interface and the edge of the screen edge area will produce an obvious dividing line to avoid visual errors.
应该知道的是,在第二界面显示后,可能之前拖动的第三区域的图像会遮挡按照第一显示比例处理的第一界面中的关键部分,所以,可选地,该实施例中,步骤102之后,还包括:It should be known that after the second interface is displayed, the image of the third area dragged before may block the key part of the first interface processed according to the first display ratio, so, optionally, in this embodiment, After step 102, also include:
在显示所述第二界面的情况下,接收所述用户的第四输入;When the second interface is displayed, receiving a fourth input from the user;
响应于所述第四输入,调整所述第二界面中与所述第一界面的第三区域对应的图像的大小或位置。In response to the fourth input, adjusting the size or position of the image corresponding to the third area of the first interface in the second interface.
这里,第四输入用于唤醒第三区域对应的图像的调整状态,电子设备接收该第四输入后,进入调整状态,用户可在该状态缩放或移动与第一界面的第三区域对应的图像。Here, the fourth input is used to wake up the adjustment state of the image corresponding to the third area. After receiving the fourth input, the electronic device enters the adjustment state, and the user can zoom or move the image corresponding to the third area of the first interface in this state. .
该实施例中,建立关联关系的方式,可通过坐标建联实现。具体的,以屏幕为1920*1080为例,可针对第一界面建立1920*1080的坐标系,而第二界面也建立同样的坐标系。在第一界面分割并移动后,记录移动的距离,即偏移,以图2中第一虚拟按键图像区域202移动为例,记录第一虚拟按键图像区域202横纵方向分别移动了s1,s2。之后,对于第一虚拟按键图像区域202的点击事件,当前点击坐标为(x,y),基于坐标系和记录的偏移,在第二界面中坐标为(x+s1,y+s2)处模拟一个相同的点击事件。这样即使分割的虚拟按键图像已经被拖动到了其他位置,对这个虚拟按键图像所处区域的操 作,仍然会反馈到第二界面中的虚拟按键上,得以更方便的操作。In this embodiment, the manner of establishing an association relationship may be realized by establishing a coordinate relationship. Specifically, taking the screen size of 1920*1080 as an example, a coordinate system of 1920*1080 can be established for the first interface, and the same coordinate system can also be established for the second interface. After the first interface is divided and moved, record the moving distance, that is, the offset. Taking the movement of the first virtual key image area 202 in FIG. . Afterwards, for the click event of the first virtual button image area 202, the current click coordinates are (x, y), based on the offset of the coordinate system and records, the coordinates in the second interface are (x+s1, y+s2) Simulate an identical click event. In this way, even if the divided virtual button image has been dragged to another location, the operation on the area where the virtual button image is located will still be fed back to the virtual button in the second interface, enabling more convenient operation.
综上,本申请实施例的方法,能够对应用界面进行自动适配,解决应用界面上虚拟按键位置设计与电子设备的屏幕不适配,造成操作不便的问题。To sum up, the method of the embodiment of the present application can automatically adapt the application interface, and solve the problem of inconvenient operation caused by the incompatibility between the design of the virtual button position on the application interface and the screen of the electronic device.
需要说明的是,本申请实施例提供的界面显示的适配处理方法,执行主体可以为界面显示的适配处理装置,或者该界面显示的适配处理装置中的用于执行界面显示的适配处理方法的控制模块。本申请实施例中以界面显示的适配处理装置执行界面显示的适配处理方法为例,说明本申请实施例提供的界面显示的适配处理装置。It should be noted that, in the interface display adaptation processing method provided in the embodiment of the present application, the execution subject may be the interface display adaptation processing device, or the interface display adaptation processing device used to execute the interface display adaptation The control module for the processing method. In the embodiment of the present application, the interface display adaptation processing device performed by the interface display adaptation processing device is taken as an example to describe the interface display adaptation processing device provided in the embodiment of the present application.
图7是本申请一个实施例的界面显示的适配处理装置的框图。图7所示的界面显示的适配处理装置包括第一接收模块710和显示模块720。Fig. 7 is a block diagram of an adaptation processing device displayed on an interface according to an embodiment of the present application. The adaptation processing device shown in the interface shown in FIG. 7 includes a first receiving module 710 and a display module 720 .
第一接收模块710,用于在第一区域显示第一界面的情况下,接收用户的第一输入;The first receiving module 710 is configured to receive a first input from the user when the first interface is displayed in the first area;
显示模块720,用于响应于所述第一输入,在第二区域显示第二界面;a display module 720, configured to display a second interface in a second area in response to the first input;
其中,所述第一界面包括S个第一虚拟按键,所述第二界面包括所述第一界面中第三区域对应的图像,所述第三区域为所述S个第一虚拟按键中的N个第一虚拟按键对应的区域;且所述第二界面包括第二虚拟按键,所述第二虚拟按键与所述N个第一虚拟按键建立有关联关系;S、N为正整数且S≥N≥1。Wherein, the first interface includes S first virtual keys, the second interface includes an image corresponding to a third area in the first interface, and the third area is an image of the S first virtual keys The area corresponding to the N first virtual keys; and the second interface includes a second virtual key, and the second virtual key is associated with the N first virtual keys; S and N are positive integers and S ≥N≥1.
可选地,所述装置还包括:Optionally, the device also includes:
第二接收模块,用于接收所述用户对所述第二界面的第二输入;a second receiving module, configured to receive a second input from the user on the second interface;
第一处理模块,用于响应于所述第二输入,触发目标虚拟按键;A first processing module, configured to trigger a target virtual key in response to the second input;
其中,所述目标虚拟按键是所述第二界面中,与所述第二输入对应的第一虚拟按键相关联的第二虚拟按键。Wherein, the target virtual key is a second virtual key associated with the first virtual key corresponding to the second input in the second interface.
可选地,所述显示模块包括:Optionally, the display module includes:
第一获取子模块,用于获取所述第一界面的图像;A first acquiring submodule, configured to acquire the image of the first interface;
识别子模块,用于识别出所述第一界面的图像中的S个第一虚拟按键;An identification submodule, configured to identify the S first virtual keys in the image of the first interface;
第二获取子模块,用于获取所述S个第一虚拟按键中的N个第一虚拟按 键在所述第一界面的图像中的初始图像;The second obtaining submodule is used to obtain the initial image of the N first virtual buttons in the first interface image in the S first virtual buttons;
第一处理子模块,用于将所述初始图像与按照第一显示比例处理后的第一界面合成,得到所述第二界面;The first processing submodule is used to combine the initial image with the first interface processed according to the first display ratio to obtain the second interface;
第一显示子模块,用于将所述第二界面显示在所述第二区域a first display submodule, configured to display the second interface in the second area
可选地,所述显示模块包括:Optionally, the display module includes:
第二处理子模块,用于划分所述第一界面并获得所述第三区域的图像;A second processing submodule, configured to divide the first interface and obtain an image of the third area;
第三处理子模块,用于将所述第三区域的图像与按照第一显示比例处理后的第一界面合并,得到所述第二界面;A third processing submodule, configured to combine the image in the third area with the first interface processed according to the first display ratio to obtain the second interface;
第二显示子模块,用于将所述第二界面显示在所述第二区域。The second display submodule is configured to display the second interface in the second area.
可选地,所述装置还包括:Optionally, the device also includes:
第三接收模块,用于接收所述用户对划分所述第一界面后获得的剩余部分的第三输入,所述剩余部分为所述第一界面中除所述第三区域之外的部分;A third receiving module, configured to receive a third input from the user on the remaining part obtained after dividing the first interface, where the remaining part is a part of the first interface other than the third area;
第二处理模块,用于响应于所述第三输入,隐藏所述剩余部分。A second processing module, configured to hide the remaining part in response to the third input.
可选地,所述装置还包括:Optionally, the device also includes:
第四接收模块,用于在显示所述第二界面的情况下,接收所述用户的第四输入;A fourth receiving module, configured to receive a fourth input from the user when the second interface is displayed;
第三处理模块,用于响应于所述第四输入,调整所述第二界面中与所述第一界面的第三区域对应的图像的大小或位置。A third processing module, configured to adjust the size or position of the image corresponding to the third area of the first interface in the second interface in response to the fourth input.
该装置在接收到用户的第一输入后,响应于该第一输入,能够在第二区域显示第二界面,由于该第二界面包括第一界面中N个第一虚拟按键对应区域的图像,以及,与该N个第一虚拟按键建立有关联关系的第二虚拟按键,无需对第二虚拟按键进行操作,通过第一虚拟按键对应的区域的图像就能够触发关联的第二虚拟按键,避免直接对应用界面的虚拟按键进行操作而造成的操作不便,提升电子设备的便捷性。After receiving the first input from the user, the device can display the second interface in the second area in response to the first input, since the second interface includes images of areas corresponding to the N first virtual keys in the first interface, And, for the second virtual keys associated with the N first virtual keys, the image of the area corresponding to the first virtual keys can trigger the associated second virtual keys without operating the second virtual keys, avoiding The operation inconvenience caused by directly operating the virtual buttons on the application interface improves the convenience of the electronic device.
本申请实施例中的界面显示的适配处理装置可以是装置,也可以是终端中的部件、集成电路、或芯片。该装置可以是移动电子设备,也可以为非移动电子设备。示例性的,移动电子设备可以为手机、平板电脑、笔记本电脑、 掌上电脑、车载电子设备、可穿戴设备、超级移动个人计算机(ultra-mobile personal computer,UMPC)、上网本或者PDA等,非移动电子设备可以为服务器、网络附属存储器(Network Attached Storage,NAS)、个人计算机(personal computer,PC)、电视机(television,TV)、柜员机或者自助机等,本申请实施例不作具体限定。The adaptation processing device for interface display in the embodiment of the present application may be a device, or a component, an integrated circuit, or a chip in a terminal. The device may be a mobile electronic device or a non-mobile electronic device. Exemplarily, the mobile electronic device can be a mobile phone, tablet computer, notebook computer, palmtop computer, vehicle-mounted electronic device, wearable device, ultra-mobile personal computer (ultra-mobile personal computer, UMPC), netbook or PDA, etc., non-mobile electronic device The device may be a server, a network attached storage (Network Attached Storage, NAS), a personal computer (personal computer, PC), a television (television, TV), a teller machine or a self-service machine, etc., which are not specifically limited in this embodiment of the present application.
本申请实施例中的界面显示的适配处理装置可以为具有操作系统的装置。该操作系统可以为安卓(Android)操作系统,可以为ios操作系统,还可以为其他可能的操作系统,本申请实施例不作具体限定。The adaptation processing device for interface display in the embodiment of the present application may be a device with an operating system. The operating system may be an Android operating system, an ios operating system, or other possible operating systems, which are not specifically limited in this embodiment of the present application.
本申请实施例提供的界面显示的适配处理装置能够实现图1至图6的方法实施例中实现的各个过程,为避免重复,这里不再赘述。The interface display adaptation processing device provided in the embodiment of the present application can implement various processes implemented in the method embodiments in FIG. 1 to FIG. 6 , and details are not repeated here to avoid repetition.
可选的,如图8所示,本申请实施例还提供一种电子设备800,包括处理器801,存储器802,存储在存储器802上并可在所述处理器801上运行的程序或指令,该程序或指令被处理器801执行时实现上述界面显示的适配处理方法实施例的各个过程,且能达到相同的技术效果,为避免重复,这里不再赘述。Optionally, as shown in FIG. 8 , the embodiment of the present application further provides an electronic device 800, including a processor 801, a memory 802, and programs or instructions stored in the memory 802 and operable on the processor 801, When the program or instruction is executed by the processor 801, the various processes of the above-mentioned interface display adaptation processing method embodiment can be achieved, and the same technical effect can be achieved. To avoid repetition, details are not repeated here.
需要注意的是,本申请实施例中的电子设备包括上述所述的移动电子设备和非移动电子设备。It should be noted that the electronic devices in the embodiments of the present application include the above-mentioned mobile electronic devices and non-mobile electronic devices.
图9为实现本申请各个实施例的一种电子设备的硬件结构示意图。FIG. 9 is a schematic diagram of a hardware structure of an electronic device implementing various embodiments of the present application.
该电子设备900包括但不限于:射频单元901、网络模块902、音频输出单元903、输入单元904、传感器905、显示单元906、用户输入单元907、接口单元908、存储器909、以及处理器910等部件。The electronic device 900 includes, but is not limited to: a radio frequency unit 901, a network module 902, an audio output unit 903, an input unit 904, a sensor 905, a display unit 906, a user input unit 907, an interface unit 908, a memory 909, and a processor 910, etc. part.
本领域技术人员可以理解,电子设备900还可以包括给各个部件供电的电源(比如电池),电源可以通过电源管理系统与处理器910逻辑相连,从而通过电源管理系统实现管理充电、放电、以及功耗管理等功能。图9中示出的电子设备结构并不构成对电子设备的限定,电子设备可以包括比图示更多或更少的部件,或者组合某些部件,或者不同的部件布置,,在此不再赘述。Those skilled in the art can understand that the electronic device 900 can also include a power supply (such as a battery) for supplying power to various components, and the power supply can be logically connected to the processor 910 through the power management system, so that the management of charging, discharging, and function can be realized through the power management system. Consumption management and other functions. The structure of the electronic device shown in FIG. 9 does not constitute a limitation to the electronic device. The electronic device may include more or fewer components than shown in the illustration, or combine certain components, or arrange different components. repeat.
其中,输入单元904,用于接收用户的第一输入;Wherein, the input unit 904 is configured to receive the user's first input;
显示单元906,用于响应于所述第一输入,在第二区域显示第二界面;a display unit 906, configured to display a second interface in the second area in response to the first input;
其中,所述第一界面包括S个第一虚拟按键,所述第二界面包括所述第一界面中第三区域对应的图像,所述第三区域为所述S个第一虚拟按键中的N个第一虚拟按键对应的区域;且所述第二界面包括第二虚拟按键,所述第二虚拟按键与所述N个第一虚拟按键建立有关联关系;S、N为正整数且S≥N≥1。Wherein, the first interface includes S first virtual keys, the second interface includes an image corresponding to a third area in the first interface, and the third area is an image of the S first virtual keys The area corresponding to the N first virtual keys; and the second interface includes a second virtual key, and the second virtual key is associated with the N first virtual keys; S and N are positive integers and S ≥N≥1.
该电子设备接收到用户的第一输入后,响应于该第一输入,能够在第二区域显示第二界面,由于该第二界面包括第一界面中N个第一虚拟按键对应区域的图像,以及,与该N个第一虚拟按键建立有关联关系的第二虚拟按键,无需对第二虚拟按键进行操作,通过第一虚拟按键对应的区域的图像就能够触发关联的第二虚拟按键,避免直接对应用界面的虚拟按键进行操作而造成的操作不便,提升电子设备的便捷性。After the electronic device receives the user's first input, it can display the second interface in the second area in response to the first input, since the second interface includes images of areas corresponding to N first virtual keys in the first interface, And, for the second virtual keys associated with the N first virtual keys, the image of the area corresponding to the first virtual keys can trigger the associated second virtual keys without operating the second virtual keys, avoiding The operation inconvenience caused by directly operating the virtual buttons on the application interface improves the convenience of the electronic device.
可选的,输入单元904,还用于接收所述用户对所述第二界面的第二输入;Optionally, the input unit 904 is further configured to receive a second input from the user on the second interface;
处理器910,用于响应于所述第二输入,触发目标虚拟按键;a processor 910, configured to trigger a target virtual key in response to the second input;
其中,所述目标虚拟按键是所述第二界面中,与所述第二输入对应的第一虚拟按键相关联的第二虚拟按键Wherein, the target virtual key is a second virtual key associated with the first virtual key corresponding to the second input in the second interface
可选的,处理器910,还用于获取所述第一界面的图像;识别出所述第一界面的图像中的S个第一虚拟按键;获取所述S个第一虚拟按键中的N个第一虚拟按键在所述第一界面的图像中的初始图像;将所述初始图像与按照第一显示比例处理后的第一界面合成,得到所述第二界面;Optionally, the processor 910 is further configured to acquire the image of the first interface; identify S first virtual keys in the image of the first interface; acquire N of the S first virtual keys an initial image of the first virtual button in the image of the first interface; combining the initial image with the first interface processed according to the first display ratio to obtain the second interface;
显示单元906,还用于将所述第二界面显示在所述第二区域。The display unit 906 is further configured to display the second interface in the second area.
可选的,处理器910,还用于划分所述第一界面并获得所述第三区域的图像;将所述第三区域的图像与按照第一显示比例处理后的第一界面合并,得到所述第二界面;Optionally, the processor 910 is further configured to divide the first interface and obtain an image of the third area; merge the image of the third area with the first interface processed according to the first display ratio to obtain the second interface;
显示单元906,还用于将所述第二界面显示在所述第二区域。;The display unit 906 is further configured to display the second interface in the second area. ;
可选的,输入单元904,还用于接收所述用户对划分所述第一界面后获 得的剩余部分的第三输入,所述剩余部分为所述第一界面中除所述第三区域之外的部分;Optionally, the input unit 904 is further configured to receive a third input from the user on the remaining part obtained after dividing the first interface, and the remaining part is the first interface except the third area outside part;
处理器910,还用于响应于所述第三输入,隐藏所述剩余部分。The processor 910 is further configured to hide the remaining part in response to the third input.
可选的,输入单元904,还用于在显示所述第二界面的情况下,接收所述用户的第四输入;Optionally, the input unit 904 is further configured to receive a fourth input from the user when the second interface is displayed;
处理器910,还用于响应于所述第四输入,调整所述第二界面中与所述第一界面的第三区域对应的图像的大小或位置。The processor 910 is further configured to, in response to the fourth input, adjust the size or position of the image corresponding to the third area of the first interface in the second interface.
应理解的是,本申请实施例中,输入单元904可以包括图形处理器(Graphics Processing Unit,GPU)9041和麦克风9042,图形处理器9041对在视频捕获模式或图像捕获模式中由图像捕获装置(如摄像头)获得的静态图片或视频的图像数据进行处理。显示单元906可包括显示面板9061,可以采用液晶显示器、有机发光二极管等形式来配置显示面板9061。用户输入单元907包括触控面板9071以及其他输入设备9072。触控面板9071,也称为触摸屏。触控面板9071可包括触摸检测装置和触摸控制器两个部分。其他输入设备9072可以包括但不限于物理键盘、功能键(比如音量控制按键、开关按键等)、轨迹球、鼠标、操作杆,在此不再赘述。存储器909可用于存储软件程序以及各种数据,包括但不限于应用程序和操作系统。处理器910可集成应用处理器和调制解调处理器,其中,应用处理器主要处理操作系统、用户界面和应用程序等,调制解调处理器主要处理无线通信。可以理解的是,上述调制解调处理器也可以不集成到处理器910中It should be understood that, in the embodiment of the present application, the input unit 904 may include a graphics processor (Graphics Processing Unit, GPU) 9041 and a microphone 9042, and the graphics processor 9041 is used for the image capture device ( Such as the image data of the still picture or video obtained by the camera) for processing. The display unit 906 may include a display panel 9061, and the display panel 9061 may be configured in the form of a liquid crystal display, an organic light emitting diode, or the like. The user input unit 907 includes a touch panel 9071 and other input devices 9072 . The touch panel 9071 is also called a touch screen. The touch panel 9071 may include two parts, a touch detection device and a touch controller. Other input devices 9072 may include, but are not limited to, physical keyboards, function keys (such as volume control buttons, switch buttons, etc.), trackballs, mice, and joysticks, which will not be repeated here. The memory 909 can be used to store software programs as well as various data, including but not limited to application programs and operating systems. The processor 910 may integrate an application processor and a modem processor, wherein the application processor mainly processes an operating system, user interface, application program, etc., and the modem processor mainly processes wireless communication. It can be understood that, the above modem processor may not be integrated into the processor 910
本申请实施例还提供一种可读存储介质,所述可读存储介质上存储程序或指令,该程序或指令被处理器执行时实现上述界面显示的适配处理方法实施例的各个过程,且能达到相同的技术效果,为避免重复,这里不再赘述。The embodiment of the present application also provides a readable storage medium, on which a program or instruction is stored, and when the program or instruction is executed by the processor, each process of the above-mentioned interface display adaptation processing method embodiment is implemented, and The same technical effect can be achieved, so in order to avoid repetition, details will not be repeated here.
其中,所述处理器为上述实施例中所述的电子设备中的处理器。所述可读存储介质,包括计算机可读存储介质,如只读存储器(Read-Only Memory,简称ROM)、随机存取存储器(Random Access Memory,简称RAM)、磁碟或者光盘等。Wherein, the processor is the processor in the electronic device described in the above embodiments. The readable storage medium includes a computer readable storage medium, such as a read-only memory (Read-Only Memory, ROM for short), a random access memory (Random Access Memory, RAM for short), a magnetic disk or an optical disk, and the like.
本申请实施例另提供了一种芯片,所述芯片包括处理器和通信接口,所述通信接口和所述处理器耦合,所述处理器用于运行程序或指令,实现上述界面显示的适配处理方法实施例的各个过程,且能达到相同的技术效果,为避免重复,这里不再赘述。The embodiment of the present application further provides a chip, the chip includes a processor and a communication interface, the communication interface is coupled to the processor, the processor is used to run programs or instructions, and realize the adaptation processing of the above-mentioned interface display Each process of the method embodiment can achieve the same technical effect, and will not be repeated here to avoid repetition.
应理解,本申请实施例提到的芯片还可以称为系统级芯片、系统芯片、芯片系统或片上系统芯片等。It should be understood that the chips mentioned in the embodiments of the present application may also be called system-on-chip, system-on-chip, system-on-a-chip, or system-on-a-chip.
需要说明的是,在本文中,术语“包括”、“包含”或者其任何其他变体意在涵盖非排他性的包含,从而使得包括一系列要素的过程、方法、物品或者装置不仅包括那些要素,而且还包括没有明确列出的其他要素,或者是还包括为这种过程、方法、物品或者装置所固有的要素。在没有更多限制的情况下,由语句“包括一个……”限定的要素,并不排除在包括该要素的过程、方法、物品或者装置中还存在另外的相同要素。此外,需要指出的是,本申请实施方式中的方法和装置的范围不限按示出或讨论的顺序来执行功能,还可包括根据所涉及的功能按基本同时的方式或按相反的顺序来执行功能,例如,可以按不同于所描述的次序来执行所描述的方法,并且还可以添加、省去、或组合各种步骤。另外,参照某些示例所描述的特征可在其他示例中被组合。It should be noted that, in this document, the term "comprising", "comprising" or any other variation thereof is intended to cover a non-exclusive inclusion such that a process, method, article or apparatus comprising a set of elements includes not only those elements, It also includes other elements not expressly listed, or elements inherent in the process, method, article, or device. Without further limitations, an element defined by the phrase "comprising a ..." does not preclude the presence of additional identical elements in the process, method, article, or apparatus comprising that element. In addition, it should be pointed out that the scope of the methods and devices in the embodiments of the present application is not limited to performing functions in the order shown or discussed, and may also include performing functions in a substantially simultaneous manner or in reverse order according to the functions involved. Functions are performed, for example, the described methods may be performed in an order different from that described, and various steps may also be added, omitted, or combined. Additionally, features described with reference to certain examples may be combined in other examples.
通过以上的实施方式的描述,本领域的技术人员可以清楚地了解到上述实施例方法可借助软件加必需的通用硬件平台的方式来实现,当然也可以通过硬件,但很多情况下前者是更佳的实施方式。基于这样的理解,本申请的技术方案本质上或者说对现有技术做出贡献的部分可以以计算机软件产品的形式体现出来,该计算机软件产品存储在一个存储介质(如ROM/RAM、磁碟、光盘)中,包括若干指令用以使得一台终端(可以是手机,计算机,服务器,或者网络设备等)执行本申请各个实施例所述的方法。Through the description of the above embodiments, those skilled in the art can clearly understand that the methods of the above embodiments can be implemented by means of software plus a necessary general-purpose hardware platform, and of course also by hardware, but in many cases the former is better implementation. Based on such an understanding, the technical solution of the present application can be embodied in the form of computer software products, which are stored in a storage medium (such as ROM/RAM, magnetic disk, etc.) , optical disc), including several instructions to enable a terminal (which may be a mobile phone, computer, server, or network device, etc.) to execute the methods described in various embodiments of the present application.
上面结合附图对本申请的实施例进行了描述,但是本申请并不局限于上述的具体实施方式,上述的具体实施方式仅仅是示意性的,而不是限制性的,本领域的普通技术人员在本申请的启示下,在不脱离本申请宗旨和权利要求 所保护的范围情况下,还可做出很多形式,均属于本申请的保护之内。The embodiments of the present application have been described above in conjunction with the accompanying drawings, but the present application is not limited to the above-mentioned specific implementations. The above-mentioned specific implementations are only illustrative and not restrictive. Those of ordinary skill in the art will Under the inspiration of this application, without departing from the purpose of this application and the scope of protection of the claims, many forms can also be made, all of which belong to the protection of this application.

Claims (17)

  1. 一种界面显示的适配处理方法,包括:An adaptation processing method for interface display, comprising:
    在第一区域显示第一界面的情况下,接收用户的第一输入;When the first interface is displayed in the first area, receiving a first input from the user;
    响应于所述第一输入,在第二区域显示第二界面;displaying a second interface in a second area in response to the first input;
    其中,所述第一界面包括S个第一虚拟按键,所述第二界面包括所述第一界面中第三区域对应的图像,所述第三区域为所述S个第一虚拟按键中的N个第一虚拟按键对应的区域;且所述第二界面包括第二虚拟按键,所述第二虚拟按键与所述N个第一虚拟按键建立有关联关系;S、N为正整数且S≥N≥1。Wherein, the first interface includes S first virtual keys, the second interface includes an image corresponding to a third area in the first interface, and the third area is an image of the S first virtual keys The area corresponding to the N first virtual keys; and the second interface includes a second virtual key, and the second virtual key is associated with the N first virtual keys; S and N are positive integers and S ≥N≥1.
  2. 根据权利要求1所述的方法,其中,所述响应于所述第一输入,在第二区域显示虚拟按键图像之后,还包括:The method according to claim 1, wherein, in response to the first input, after the virtual button image is displayed in the second area, further comprising:
    接收所述用户对所述第二界面的第二输入;receiving a second input from the user on the second interface;
    响应于所述第二输入,触发目标虚拟按键;triggering a target virtual key in response to the second input;
    其中,所述目标虚拟按键是所述第二界面中,与所述第二输入对应的第一虚拟按键相关联的第二虚拟按键。Wherein, the target virtual key is a second virtual key associated with the first virtual key corresponding to the second input in the second interface.
  3. 根据权利要求1所述的方法,其中,所述在第二区域显示所述第二界面包括:The method according to claim 1, wherein the displaying the second interface in the second area comprises:
    获取所述第一界面的图像;acquiring an image of the first interface;
    识别出所述第一界面的图像中的S个第一虚拟按键;Recognizing S first virtual keys in the image of the first interface;
    获取所述S个第一虚拟按键中的N个第一虚拟按键在所述第一界面的图像中的初始图像;Acquiring initial images of the N first virtual keys among the S first virtual keys in the image of the first interface;
    将所述初始图像与按照第一显示比例处理后的第一界面合成,得到所述第二界面;combining the initial image with the first interface processed according to the first display ratio to obtain the second interface;
    将所述第二界面显示在所述第二区域。displaying the second interface in the second area.
  4. 根据权利要求1所述的方法,其中,所述在第二区域显示所述第二界面包括:The method according to claim 1, wherein the displaying the second interface in the second area comprises:
    划分所述第一界面并获得所述第三区域的图像;dividing the first interface and obtaining an image of the third area;
    将所述第三区域的图像与按照第一显示比例处理后的第一界面合并,得到所述第二界面;Merging the image in the third area with the first interface processed according to the first display ratio to obtain the second interface;
    将所述第二界面显示在所述第二区域。displaying the second interface in the second area.
  5. 根据权利要求4所述的方法,其中,所述划分所述第一界面并获得所述第三区域对应的图像之后,还包括:The method according to claim 4, wherein, after dividing the first interface and obtaining the image corresponding to the third area, further comprising:
    接收所述用户对划分所述第一界面后获得的剩余部分的第三输入,所述剩余部分为所述第一界面中除所述第三区域之外的部分;receiving a third input from the user on the remaining part obtained after dividing the first interface, where the remaining part is a part of the first interface other than the third area;
    响应于所述第三输入,隐藏所述剩余部分。In response to the third input, the remainder is hidden.
  6. 根据权利要求1所述的方法,其中,所述响应于所述第一输入,在第二区域显示第二界面之后,还包括:The method according to claim 1, wherein in response to the first input, after the second interface is displayed in the second area, further comprising:
    在显示所述第二界面的情况下,接收所述用户的第四输入;When the second interface is displayed, receiving a fourth input from the user;
    响应于所述第四输入,调整所述第二界面中与所述第一界面的第三区域对应的图像的大小或位置。In response to the fourth input, adjusting the size or position of the image corresponding to the third area of the first interface in the second interface.
  7. 一种界面显示的适配处理装置,包括:An adaptive processing device for interface display, comprising:
    第一接收模块,用于在第一区域显示第一界面的情况下,接收用户的第一输入;A first receiving module, configured to receive a first input from a user when the first interface is displayed in the first area;
    显示模块,用于响应于所述第一输入,在第二区域显示第二界面;a display module, configured to display a second interface in a second area in response to the first input;
    其中,所述第一界面包括S个第一虚拟按键,所述第二界面包括所述第一界面中第三区域对应的图像,所述第三区域为所述S个第一虚拟按键中的N个第一虚拟按键对应的区域;且所述第二界面包括第二虚拟按键,所述第二虚拟按键与所述N个第一虚拟按键建立有关联关系;S、N为正整数且S≥N≥1。Wherein, the first interface includes S first virtual keys, the second interface includes an image corresponding to a third area in the first interface, and the third area is an image of the S first virtual keys The area corresponding to the N first virtual keys; and the second interface includes a second virtual key, and the second virtual key is associated with the N first virtual keys; S and N are positive integers and S ≥N≥1.
  8. 根据权利要求7所述的装置,其中,还包括:The device according to claim 7, further comprising:
    第二接收模块,用于接收所述用户对所述第二界面的第二输入;a second receiving module, configured to receive a second input from the user on the second interface;
    第一处理模块,用于响应于所述第二输入,触发目标虚拟按键;A first processing module, configured to trigger a target virtual key in response to the second input;
    其中,所述目标虚拟按键是所述第二界面中,与所述第二输入对应的第 一虚拟按键相关联的第二虚拟按键。Wherein, the target virtual key is a second virtual key associated with the first virtual key corresponding to the second input in the second interface.
  9. 根据权利要求7所述的装置,其中,所述显示模块包括:The device according to claim 7, wherein the display module comprises:
    第一获取子模块,用于获取所述第一界面的图像;A first acquiring submodule, configured to acquire the image of the first interface;
    识别子模块,用于识别出所述第一界面的图像中的S个第一虚拟按键;An identification submodule, configured to identify the S first virtual keys in the image of the first interface;
    第二获取子模块,用于获取所述S个第一虚拟按键中的N个第一虚拟按键在所述第一界面的图像中的初始图像;The second acquisition submodule is used to acquire the initial images of the N first virtual keys among the S first virtual keys in the image of the first interface;
    第一处理子模块,用于将所述初始图像与按照第一显示比例处理后的第一界面合成,得到所述第二界面;The first processing submodule is used to combine the initial image with the first interface processed according to the first display ratio to obtain the second interface;
    第一显示子模块,用于将所述第二界面显示在所述第二区域a first display submodule, configured to display the second interface in the second area
  10. 根据权利要求7所述的装置,其中,所述显示模块包括:The device according to claim 7, wherein the display module comprises:
    第二处理子模块,用于划分所述第一界面并获得所述第三区域的图像;A second processing submodule, configured to divide the first interface and obtain an image of the third area;
    第三处理子模块,用于将所述第三区域的图像与按照第一显示比例处理后的第一界面合并,得到所述第二界面;A third processing submodule, configured to combine the image in the third area with the first interface processed according to the first display ratio to obtain the second interface;
    第二显示子模块,用于将所述第二界面显示在所述第二区域。The second display submodule is configured to display the second interface in the second area.
  11. 根据权利要求10所述的装置,其中,所述装置还包括:The device according to claim 10, wherein the device further comprises:
    第三接收模块,用于接收所述用户对划分所述第一界面后获得的剩余部分的第三输入,所述剩余部分为所述第一界面中除所述第三区域之外的部分;A third receiving module, configured to receive a third input from the user on the remaining part obtained after dividing the first interface, where the remaining part is a part of the first interface other than the third area;
    第二处理模块,用于响应于所述第三输入,隐藏所述剩余部分。A second processing module, configured to hide the remaining part in response to the third input.
  12. 根据权利要求7所述的装置,其中,所述装置还包括:The device according to claim 7, wherein the device further comprises:
    第四接收模块,用于在显示所述第二界面的情况下,接收所述用户的第四输入;A fourth receiving module, configured to receive a fourth input from the user when the second interface is displayed;
    第三处理模块,用于响应于所述第四输入,调整所述第二界面中与所述第一界面的第三区域对应的图像的大小或位置。A third processing module, configured to adjust the size or position of the image corresponding to the third area of the first interface in the second interface in response to the fourth input.
  13. 一种电子设备,包括处理器、存储器及存储在所述存储器上并可在所述处理器上运行的程序或指令,其中,所述程序或指令被所述处理器执行时实现如权利要求1至6中任一项所述的界面显示的适配处理方法的步骤。An electronic device, comprising a processor, a memory, and a program or instruction stored on the memory and operable on the processor, wherein the program or instruction is executed by the processor to achieve claim 1 The steps of the adaptation processing method for interface display described in any one of to 6.
  14. 一种可读存储介质,所述可读存储介质上存储程序或指令,其中, 所述程序或指令被处理器执行时实现如权利要求1至6中任一项所述的界面显示的适配处理方法的步骤。A readable storage medium, on which a program or instruction is stored, wherein, when the program or instruction is executed by a processor, the interface display adaptation according to any one of claims 1 to 6 is realized The steps of the processing method.
  15. 一种芯片,包括处理器和通信接口,其中,所述通信接口和所述处理器耦合,所述处理器用于运行程序或指令,实现如权利要求1至6中任一项所述的界面显示的适配处理方法。A chip comprising a processor and a communication interface, wherein the communication interface is coupled to the processor, and the processor is used to run programs or instructions to realize the interface display according to any one of claims 1 to 6 Adaptive processing method.
  16. 一种计算机程序产品,其中,所述程序产品被存储在非易失的存储介质中,所述程序产品被至少一个处理器执行以实现如权利要求1至6中任一项所述的界面显示的适配处理方法。A computer program product, wherein the program product is stored in a non-volatile storage medium, and the program product is executed by at least one processor to realize the interface display according to any one of claims 1 to 6 Adaptive processing method.
  17. 一种通信设备,其中,被配置为执行如权利要求1至6中任一项所述的界面显示的适配处理方法。A communication device, wherein it is configured to execute the interface display adaptation processing method according to any one of claims 1 to 6.
PCT/CN2022/113628 2021-08-26 2022-08-19 Interface display adaptation processing method and apparatus, and electronic device WO2023025060A1 (en)

Applications Claiming Priority (2)

Application Number Priority Date Filing Date Title
CN202110986863.0A CN113655929A (en) 2021-08-26 2021-08-26 Interface display adaptation processing method and device and electronic equipment
CN202110986863.0 2021-08-26

Publications (1)

Publication Number Publication Date
WO2023025060A1 true WO2023025060A1 (en) 2023-03-02

Family

ID=78482120

Family Applications (1)

Application Number Title Priority Date Filing Date
PCT/CN2022/113628 WO2023025060A1 (en) 2021-08-26 2022-08-19 Interface display adaptation processing method and apparatus, and electronic device

Country Status (2)

Country Link
CN (1) CN113655929A (en)
WO (1) WO2023025060A1 (en)

Families Citing this family (3)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN113655929A (en) * 2021-08-26 2021-11-16 维沃移动通信有限公司 Interface display adaptation processing method and device and electronic equipment
CN114217732A (en) * 2021-12-13 2022-03-22 深圳Tcl新技术有限公司 Display page switching method and device, storage medium and display equipment
CN114510194A (en) * 2022-01-30 2022-05-17 维沃移动通信有限公司 Input method, input device, electronic equipment and readable storage medium

Citations (7)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US20130038544A1 (en) * 2011-08-10 2013-02-14 Samsung Electronics Co., Ltd. Input and output method in touch screen terminal and apparatus therefor
CN105094609A (en) * 2015-07-20 2015-11-25 小米科技有限责任公司 Method and device for achieving key operation in single-handed mode
CN109224436A (en) * 2018-08-28 2019-01-18 努比亚技术有限公司 Virtual key based on interface defines method, terminal and storage medium
CN111651109A (en) * 2020-05-11 2020-09-11 广州视源电子科技股份有限公司 Display interface layout adjusting method and device, electronic equipment and storage medium
CN112035052A (en) * 2020-09-27 2020-12-04 深圳市恒晋升科技有限公司 Computer device and method for operating game on touch computer device
CN112306351A (en) * 2020-10-30 2021-02-02 腾讯科技(深圳)有限公司 Virtual key position adjusting method, device, equipment and storage medium
CN113655929A (en) * 2021-08-26 2021-11-16 维沃移动通信有限公司 Interface display adaptation processing method and device and electronic equipment

Patent Citations (7)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US20130038544A1 (en) * 2011-08-10 2013-02-14 Samsung Electronics Co., Ltd. Input and output method in touch screen terminal and apparatus therefor
CN105094609A (en) * 2015-07-20 2015-11-25 小米科技有限责任公司 Method and device for achieving key operation in single-handed mode
CN109224436A (en) * 2018-08-28 2019-01-18 努比亚技术有限公司 Virtual key based on interface defines method, terminal and storage medium
CN111651109A (en) * 2020-05-11 2020-09-11 广州视源电子科技股份有限公司 Display interface layout adjusting method and device, electronic equipment and storage medium
CN112035052A (en) * 2020-09-27 2020-12-04 深圳市恒晋升科技有限公司 Computer device and method for operating game on touch computer device
CN112306351A (en) * 2020-10-30 2021-02-02 腾讯科技(深圳)有限公司 Virtual key position adjusting method, device, equipment and storage medium
CN113655929A (en) * 2021-08-26 2021-11-16 维沃移动通信有限公司 Interface display adaptation processing method and device and electronic equipment

Also Published As

Publication number Publication date
CN113655929A (en) 2021-11-16

Similar Documents

Publication Publication Date Title
WO2023025060A1 (en) Interface display adaptation processing method and apparatus, and electronic device
US9207838B2 (en) Device, method, and graphical user interface for managing and interacting with concurrently open software applications
US8683363B2 (en) Device, method, and graphical user interface for managing user interface content and user interface elements
US20120030624A1 (en) Device, Method, and Graphical User Interface for Displaying Menus
US20120032891A1 (en) Device, Method, and Graphical User Interface with Enhanced Touch Targeting
WO2022048633A1 (en) Display method and apparatus and electronic device
US20110163966A1 (en) Apparatus and Method Having Multiple Application Display Modes Including Mode with Display Resolution of Another Apparatus
WO2022063022A1 (en) Video preview method and apparatus and electronic device
TW201145150A (en) Automatically displaying and hiding an on-screen keyboard
CN112099705B (en) Screen projection method and device and electronic equipment
CN112162665B (en) Operation method and device
WO2023072156A1 (en) Photographing method, photographing apparatus, electronic device, and readable storage medium
CN112433693B (en) Split screen display method and device and electronic equipment
WO2018010316A1 (en) Desktop page management method and device
WO2023083089A1 (en) Photographing control display method and apparatus, and electronic device and medium
WO2023005828A1 (en) Message display method and apparatus, and electronic device
CN112911147A (en) Display control method, display control device and electronic equipment
WO2022242542A1 (en) Application icon management method and electronic device
WO2022068721A1 (en) Screen capture method and apparatus, and electronic device
CN112099714B (en) Screenshot method and device, electronic equipment and readable storage medium
WO2023231871A1 (en) Display control method and apparatus, and electronic device and readable storage medium
WO2023030304A1 (en) Prompt information display method and apparatus, and electronic device
WO2023125238A1 (en) Unlocking control method and apparatus, electronic device, and readable storage medium
WO2023160443A1 (en) Application processing method and device
WO2023169499A1 (en) Single-hand control method and control apparatus for touch screen, electronic device, and storage medium

Legal Events

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

Ref document number: 22860406

Country of ref document: EP

Kind code of ref document: A1