Information display method and device, electronic equipment, computer readable storage medium and computer program product
By using a target display method to keep the information state unchanged when the display orientation of the electronic device page changes, the problem of target information being obscured is solved, thereby improving the visibility of information and the user experience.
Patent Information
- Authority / Receiving Office
- CN · China
- Patent Type
- Applications(China)
- Current Assignee / Owner
- TENCENT TECHNOLOGY (SHENZHEN) CO LTD
- Filing Date
- 2024-10-12
- Publication Date
- 2026-04-14
AI Technical Summary
When the orientation of a page on an electronic device changes, the target information can easily be obscured by other page elements, making it impossible for users to view or for other devices to recognize it, thus reducing the user experience.
By maintaining the display state of the target information when the page display orientation changes, including displaying the target information in a pop-up or overlay under a preset orientation, and adjusting the transparency or position of page elements, the information can be ensured to be visible.
This effectively prevents target information from being obscured after the display orientation changes, ensuring that users and other devices can recognize the information, thus improving the effectiveness of information display and user experience.
Smart Images

Figure CN121858191A_ABST
Abstract
Description
Technical Field
[0001] This application relates to the field of computer technology, and in particular to an information display method, apparatus, electronic device, computer-readable storage medium, and computer program product. Background Technology
[0002] In related technologies, the display orientation of the electronic device's pages changes during user operation. For example, when a user holds the electronic device and changes the screen's orientation from landscape to portrait, the display orientation of the electronic device's pages changes.
[0003] When users need to display target information on a page, the display state of the target information will also change due to the change in the page's display orientation. For example, when the display orientation of an electronic device's page changes, the layout of various page elements in the page may change, resulting in the target information being obscured by other page elements. In other words, the display state of the target information changes, which may prevent users from viewing the target information or prevent other electronic devices from recognizing the target information. Summary of the Invention
[0004] This application provides an information display method, apparatus, electronic device, computer-readable storage medium, and computer program product, which can improve the effectiveness of displaying target information and enhance the user experience.
[0005] The technical solution of this application embodiment is implemented as follows:
[0006] This application provides an information display method, the method comprising:
[0007] A page containing target information is displayed on the screen of an electronic device;
[0008] During the display of the page, in response to a change in the display orientation of the page and a screen orientation that satisfies a preset orientation, the target information is displayed using a target display method.
[0009] The target display mode is used to keep the display state of the target information unchanged before and after the change in display direction.
[0010] This application provides an information display device, the device comprising:
[0011] The display module is used to display a page containing target information on the screen of an electronic device;
[0012] The response module is used to display the target information in a target display mode when the display direction of the page changes and the orientation of the screen meets the preset orientation during the display of the page.
[0013] The target display mode is used to keep the display state of the target information unchanged before and after the change in display direction.
[0014] In the above scheme, the response module is further configured to display the target information in a preset area of the screen in response to a change in the display orientation of the page and the orientation of the screen satisfying a preset orientation; wherein the preset area corresponds to the preset orientation.
[0015] In the above scheme, the response module is also used to respond to a change in the display orientation of the page and the orientation of the screen satisfying a preset orientation, to display a pop-up window or a floating layer on the page, and to display the target information in the pop-up window or the floating layer.
[0016] In the above scheme, when the display orientation of the page changes from landscape to portrait or vice versa, the response module is also used to display the target information in the pop-up window or the floating layer in a landscape mode.
[0017] In the above scheme, the target information is a graphic code. The response module is also used to display the target information rotated by a preset angle in the pop-up window or the floating layer in a landscape display mode.
[0018] In the above solution, the target information includes a graphic code, a response module, and is also used to display a pop-up window on the page. The pop-up window includes an opaque first background image, the size of which is the same as the size of the page, and the first background image covers the page. The graphic code is displayed in the first background image.
[0019] Alternatively, an overlay may be displayed on the page, the overlay including an opaque second background image, the second background image being the same size as the page and covering the page, and the graphic code being displayed in the second background image.
[0020] In the above scheme, the size of the target information on the page is a first display size. The response module is also used to display the target information with a second display size in the pop-up window or the floating layer; wherein the second display size is adapted to the size of the pop-up window or the size of the floating layer, and is obtained by scaling the first display size.
[0021] In the above scheme, the target information includes a graphic code, the graphic code having a first color, and the response module is further configured to display the graphic code using a pop-up window with a second color or a floating layer with a third color, wherein the first color is different from the second color and the first color is different from the third color.
[0022] In the above scheme, the page is the page of the target application; the response module is further configured to display the target information in a target display mode in response to a change in the display orientation of the page and the orientation of the screen satisfying a preset orientation corresponding to the target application.
[0023] In the above scheme, the target information is text information, and the font size of the text information is a first font size; the response module is also used to respond to a change in the display direction of the page and the orientation of the screen satisfying a preset orientation, and to scroll and display the text information with a font size of a second font size, wherein the second font size is greater than the first font size.
[0024] In the above scheme, the response module is further configured to respond to a change in the display orientation of the page and the orientation of the screen satisfying a preset orientation, detect the page after the change in display orientation, and obtain a detection result; if the detection result indicates that there are page elements on the page that obscure the target information, adjust the transparency of the page elements to zero; and display the target information based on the page elements with adjusted transparency.
[0025] In the above scheme, the response module is further configured to respond to a change in the display orientation of the page and the orientation of the screen satisfying a preset orientation, and adjust the display position of the target information on the page based on the changed display orientation of the page, so that the display position adapts to the changed display orientation of the page; wherein, if there are page elements in the page after the change in display orientation that overlap with the display position, the transparency of the page elements is set to zero.
[0026] In the above scheme, the target information includes a graphic code. After the target information is displayed using the target display method, the response module is further configured to display a new graphic code obtained after refreshing the graphic code using the target display method if the duration of displaying the graphic code is greater than a preset duration threshold.
[0027] In the above scheme, the target information is a graphic code. After the target information is displayed using the target display method, the display module is further configured to perform at least one of the following: cancel the display of the target information using the target display method; or display the scanning result of the target information using the target display method.
[0028] In the above solution, the response module is also used to respond to a change in the display orientation of the page and a screen orientation that does not meet the preset orientation, and to display the page based on the changed display orientation;
[0029] Wherein, the changed page does not include the target information, or the display state of the target information in the changed page corresponds to the changed display direction, and the display state of the target information in the changed page is different from that before the change.
[0030] In the above scheme, the display module is also used to display a smart mode switch before displaying the target information using the target display method, the smart mode switch being used to control the display mode of the target information on the page;
[0031] The response module is further configured to, in response to a trigger operation on the smart mode switch, control the display mode of the target information on the page to smart mode. In smart mode, in response to a change in the display orientation of the page and a preset orientation of the screen, the target information is displayed using a target display method.
[0032] In the above scheme, the display module is further configured to display a page including multiple initial information; in response to a setting operation for at least one of the multiple initial information, the initial information set by the setting operation is used as target information, and a page including the target information is displayed.
[0033] This application provides an electronic device, the electronic device comprising:
[0034] Memory is used to store executable instructions or computer programs.
[0035] The processor, when executing computer-executable instructions or computer programs stored in the memory, implements any of the information display methods provided in the embodiments of this application.
[0036] This application provides a computer-readable storage medium storing a computer program or computer-executable instructions, which, when executed by a processor, implements any of the information display methods provided in this application.
[0037] This application provides a computer program product, including a computer program or computer executable instructions. When the computer program or computer executable instructions are executed by a processor, they implement any of the information display methods provided in this application.
[0038] The embodiments of this application have the following beneficial effects:
[0039] In the information display method provided in this application embodiment, a page including target information can be displayed on the screen of an electronic device. During the page display process, in response to a change in the display direction of the page and a screen orientation that satisfies a preset orientation, the target information is displayed using a target display mode. The target display mode is used to keep the display state of the target information unchanged before and after the change in display direction.
[0040] The information display method provided in this application embodiment can maintain the display state of the target information unchanged before and after the change in display orientation, even when the display orientation of the page changes and the screen orientation meets a preset orientation. Compared with related technologies, this avoids situations where other users cannot view the target information or other electronic devices cannot recognize the target information due to changes in display orientation. In other words, even when the display orientation of the page changes, users or other electronic devices can still obtain the target information, effectively displaying the target information, improving the effectiveness of displaying the target information, and enhancing the user experience. Attached Figure Description
[0041] Figure 1 This is a schematic diagram of the structure of the information display system provided in the embodiments of this application;
[0042] Figure 2 This is a schematic diagram of the structure of the electronic device provided in the embodiments of this application;
[0043] Figure 3 This is a flowchart illustrating the information display method provided in the embodiments of this application. Figure 1 ;
[0044] Figure 4 This is a schematic diagram of a page provided in an embodiment of this application. Figure 1 ;
[0045] Figure 5 This is a schematic diagram of a page provided in an embodiment of this application. Figure 2 ;
[0046] Figure 6 This is a schematic diagram of the screen orientation provided in the embodiments of this application. Figure 1 ;
[0047] Figure 7 This is a schematic diagram of the axis of the gyroscope provided in the embodiments of this application. Figure 1 ;
[0048] Figure 8 This is a schematic diagram of the axis of the gyroscope provided in the embodiments of this application. Figure 2 ;
[0049] Figure 9This is a schematic diagram of the axis of the gyroscope provided in the embodiments of this application. Figure 3 ;
[0050] Figure 10 This is a schematic diagram of the axis of the gyroscope provided in the embodiments of this application. Figure 4 ;
[0051] Figure 11 This is a schematic diagram of the gyroscope usage prompt information provided in the embodiments of this application;
[0052] Figure 12 This is a schematic diagram of a page provided in an embodiment of this application. Figure 3 ;
[0053] Figure 13 This is a schematic diagram of a page provided in an embodiment of this application. Figure 4 ;
[0054] Figure 14 This is a schematic diagram of a page in related technologies;
[0055] Figure 15 This is a schematic diagram of a page provided in an embodiment of this application. Figure 5 ;
[0056] Figure 16 This is a schematic diagram of a page provided in an embodiment of this application. Figure 6 ;
[0057] Figure 17 This is a schematic diagram of a page provided in an embodiment of this application. Figure 7 ;
[0058] Figure 18 This is a schematic diagram of a page provided in an embodiment of this application. Figure 8 ;
[0059] Figure 19 This is a schematic diagram of the graphic code provided in the embodiments of this application. Figure 1 ;
[0060] Figure 20 This is a schematic diagram of the graphic code provided in the embodiments of this application. Figure 2 ;
[0061] Figure 21 This is a schematic diagram of a page provided in an embodiment of this application. Figure 9 ;
[0062] Figure 22 This is a schematic diagram of a page provided in an embodiment of this application. Figure 10 ;
[0063] Figure 23 This is a schematic diagram of a page provided in an embodiment of this application. Figure 10 one;
[0064] Figure 24 This is a schematic diagram of a page provided in an embodiment of this application. Figure 10 two;
[0065] Figure 25 This is a schematic diagram of a page provided in an embodiment of this application. Figure 10 three;
[0066] Figure 26 This is a schematic diagram of a page provided in an embodiment of this application. Figure 10 Four;
[0067] Figure 27 This is a schematic diagram of a page provided in an embodiment of this application. Figure 10 five;
[0068] Figure 28 This is a flowchart illustrating the information display method provided in the embodiments of this application. Figure 2 ;
[0069] Figure 29 This is a schematic diagram of the gate provided in an embodiment of this application;
[0070] Figure 30 This is a schematic diagram of the screen orientation provided in the embodiments of this application. Figure 2 ;
[0071] Figure 31 This is a schematic diagram of a page provided in an embodiment of this application. Figure 10 six. Detailed Implementation
[0072] To make the objectives, technical solutions, and advantages of this application clearer, the application will be further described in detail below with reference to the accompanying drawings. The described embodiments should not be regarded as limitations on this application. All other embodiments obtained by those skilled in the art without creative effort are within the scope of protection of this application.
[0073] In the following description, references are made to “some embodiments,” which describe a subset of all possible embodiments. However, it is understood that “some embodiments” may be the same subset or different subsets of all possible embodiments and may be combined with each other without conflict.
[0074] In the following description, the terms "first, second, third" are used merely to distinguish similar objects and do not represent a specific ordering of objects. It is understood that "first, second, third" may be interchanged in a specific order or sequence where permitted, so that the embodiments of this application described herein can be implemented in an order other than that illustrated or described herein.
[0075] In this application embodiment, the terms "module" or "unit" refer to a computer program or part of a computer program that has a predetermined function and works with other related parts to achieve a predetermined goal, and can be implemented wholly or partially using software, hardware (such as processing circuitry or memory), or a combination thereof. Similarly, a processor (or multiple processors or memory) can be used to implement one or more modules or units. Furthermore, each module or unit can be part of an overall module or unit that includes the functionality of that module or unit.
[0076] Unless otherwise defined, all technical and scientific terms used in the embodiments of this application have the same meaning as commonly understood by one of ordinary skill in the art. The terminology used in the embodiments of this application is for the purpose of describing the embodiments of this application only and is not intended to limit this application.
[0077] In the implementation of this application, the collection and processing of relevant data should strictly comply with the requirements of relevant laws and regulations, obtain the informed consent or separate consent of the personal information subject, and carry out subsequent data use and processing within the scope of laws and regulations and the authorization of the personal information subject.
[0078] Before providing a further detailed description of the embodiments of this application, the nouns and terms involved in the embodiments of this application will be explained, and the nouns and terms involved in the embodiments of this application shall be interpreted as follows.
[0079] 1) Responding to: used to indicate the conditions or states on which the operation is performed depends. When the conditions or states on which it depends are met, one or more operations can be performed in real time or with a set delay. Unless otherwise specified, there is no restriction on the order in which the multiple operations are performed.
[0080] 2) Human-computer interaction interface, which is an interface used to display target information to provide human-computer interaction functions, that is, the page containing target information in this application. For example, graphical user interface (GUI) display, such as augmented reality (AR) interface, virtual reality (VR) interface, voice user interface (VUI), interactive projection interface (using projection technology to display information on a plane), eye-tracking interface (an interface controlled by detecting the user's gaze), holographic interface (a three-dimensional hologram formed by projecting images using holographic projection technology, which can be seen without wearing special glasses), multimodal interface (an interactive interface that combines multiple interaction methods, such as tactile, visual, and auditory interaction), brain-computer interface (BMI), etc.
[0081] 3) Client, also known as user terminal, refers to the program that provides local services to users in contrast to the server. Except for some applications that can only run locally, it is generally installed on ordinary client machines and needs to cooperate with the server to run. That is, there needs to be a corresponding server and service program in the network to provide the corresponding services. Thus, a specific communication connection needs to be established between the client and the server to ensure the normal operation of the application, such as a game client.
[0082] 4) Hyper Text Markup Language (HTML) 5, the fifth version of HTML, is a standard markup language used to create web pages and web applications. Canvas is a page element introduced in HTML5 that defines a rectangular area within which users can draw.
[0083] Cascading Style Sheets (CSS) is a style sheet language used to describe HTML documents. CSS can not only statically style web pages, but also dynamically change their appearance and formatting, and respond to user interactions. CSS provides a rich set of style properties, including fonts, colors, spacing, and layout, making web designs both aesthetically pleasing and dynamic.
[0084] 5) Scan code, an electronic voucher, is typically used to verify and enforce discounts, redeem gifts or services, and confirm order consumption. Scan code is also known as graphic code, which refers to an encoding method that represents and stores data information in graphic form. Graphic codes can include barcodes, QR codes, etc.
[0085] During the research process, the inventors discovered the following technical problems in the relevant technologies.
[0086] Technical Issue 1: When the display orientation of a page on an electronic device changes, the layout of various page elements changes, causing the target information to be obscured by other page elements. This changes the display status of the target information, making it impossible for the user to view the target information or for other electronic devices to recognize it.
[0087] For example, when the target information is a QR code, the user needs to align the screen of the electronic device displaying the QR code with the scanning device (i.e., another electronic device). However, if the screen orientation of the electronic device is not locked, the display orientation of the electronic device's page will change, causing the QR code to be obscured by other page elements, thus preventing scanning. When the user re-aligns the screen of the electronic device with themselves, the display orientation of the electronic device's page will return to the initial orientation, making it impossible for the user to know that the display status of the target information has changed. Consequently, the user is unclear about why the scanning cannot be completed, greatly reducing the user experience.
[0088] Technical Issue 2: In scenarios such as offline gaming and concert viewing, users need to display text information to other users. However, the relevant technologies require users to adjust the font and click on the display control to enlarge the text information in landscape mode, which reduces the user experience.
[0089] This application provides an information display method, an information display device, an electronic device, a computer-readable storage medium, and a computer program product, which can improve the effectiveness of displaying target information and enhance the user experience.
[0090] See Figure 1 , Figure 1 This is a schematic diagram of the structure of the information display system provided in the embodiments of this application. Figure 1 The information display system 100 shown supports an information display application. The terminal connects to the server 200 through the network 300. The terminal may include terminal 400-1 and terminal 400-2. The network 300 may be a wide area network or a local area network, or a combination of both.
[0091] When a user needs to display target information on the screen of an electronic device (i.e., terminal 400-1), in response to a target information acquisition instruction triggered on terminal 400-1, terminal 400-1 can send a target information acquisition request to server 200, and server 200 can send the target information to terminal 400-1 based on the target information acquisition request.
[0092] On the screen of terminal 400-1, page 410-1 containing target information is displayed. During the display of page 410-1, in response to a change in the display orientation of page 410-1 and a preset orientation of the screen, the target information is displayed using a target display mode. This target display mode is used to maintain the display state of the target information unchanged before and after the change in display orientation. Terminal 400-2 can be used to scan the target information displayed on terminal 400-1, thereby displaying the scan results on both page 410-1 of terminal 400-1 and page 410-2 of terminal 400-2.
[0093] The following describes the electronic device provided in the embodiments of this application. The electronic device that performs the information display method provided in the embodiments of this application can be a terminal, a server, or a combination of the two. Other electronic devices are only used to distinguish them from electronic devices. The terminal can be implemented as a laptop computer, tablet computer, desktop computer, set-top box, smartphone, smart speaker, smartwatch, smart TV, vehicle terminal, and other types of terminals.
[0094] The server can be a standalone physical server, a server cluster or distributed system composed of multiple physical servers, or a cloud server providing basic cloud computing services such as cloud services, cloud databases, cloud computing, cloud functions, cloud storage, network services, cloud communication, middleware services, domain name services, security services, content delivery networks (CDNs), and big data and artificial intelligence platforms. The terminal and server can be connected directly or indirectly via wired or wireless communication, which is not limited in this embodiment.
[0095] See Figure 2 , Figure 2 This is a schematic diagram of the structure of the electronic device provided in the embodiments of this application. Figure 2 The illustrated electronic device includes at least one processor 410, a memory 450, at least one network interface 420, and a user interface 430. The various components of the electronic device are coupled together via a bus system 440. It is understood that the bus system 440 is used to implement communication between these components. In addition to a data bus, the bus system 440 also includes a power bus, a control bus, and a status signal bus. However, for clarity, in… Figure 2 The general labeled all buses as Bus System 440.
[0096] The processor 410 can be an integrated circuit chip with signal processing capabilities, such as a general-purpose processor, a digital signal processor (DSP), or other programmable logic devices, discrete gate or transistor logic devices, discrete hardware components, etc. The general-purpose processor can be a microprocessor or any conventional processor, etc.
[0097] User interface 430 includes one or more output devices 431 that enable the presentation of media content, including one or more speakers and / or one or more visual displays. User interface 430 also includes one or more input devices 432, including user interface components that facilitate user input, such as a keyboard, mouse, microphone, touch screen display, camera, other input buttons and controls.
[0098] The memory 450 may be removable, non-removable, or a combination thereof. Exemplary hardware devices include solid-state storage, hard disk drives, optical disk drives, etc. The memory 450 may optionally include one or more storage devices physically located away from the processor 410.
[0099] The memory 450 may include volatile memory or non-volatile memory, or both. The non-volatile memory may be read-only memory (ROM), and the volatile memory may be random access memory (RAM). The memory 450 described in this application embodiment is intended to include any suitable type of memory.
[0100] In some embodiments, memory 450 is capable of storing data to support various operations, examples of which include programs, modules, and data structures or subsets or supersets thereof, as illustrated below.
[0101] Operating system 451 includes system programs for handling various basic system services and performing hardware-related tasks, such as the framework layer, core library layer, driver layer, etc., for implementing various basic business functions and handling hardware-based tasks;
[0102] The network communication module 452 is used to reach other electronic devices via one or more (wired or wireless) network interfaces 420, exemplary network interfaces 420 including: Bluetooth, WiFi, and Universal Serial Bus (USB), etc.
[0103] Presentation module 453 is configured to enable the presentation of information (e.g., a user interface for operating peripheral devices and displaying content and information) via one or more output devices 431 (e.g., a display screen, a speaker, etc.) associated with user interface 430;
[0104] The input processing module 454 is used to detect and translate one or more user inputs or interactions from one or more input devices 432.
[0105] In some embodiments, the information display device provided in this application can be implemented in software. Figure 2 An information display device 455 stored in memory 450 is shown. This device can be software in the form of programs and plug-ins, and includes the following software modules: a display module 4551 and a response module 4552. These modules are logically linked and can therefore be arbitrarily combined or further separated according to the functions they implement. The functions of each module will be described below.
[0106] In other embodiments, the information display device provided in this application can be implemented in hardware. As an example, the information display device provided in this application can be a processor in the form of a hardware decoding processor, which is programmed to execute the information display method provided in this application. For example, the processor in the form of a hardware decoding processor can be one or more application-specific integrated circuits (ASICs), digital signal processors (DSPs), programmable logic devices (PLDs), complex programmable logic devices (CPLDs), field-programmable gate arrays (FPGAs), or other electronic components.
[0107] In some embodiments, the terminal or server can implement the information display method provided in this application by running various computer-executable instructions or computer programs. For example, computer-executable instructions can be microprogram-level commands, machine instructions, or software instructions. Computer programs can be native programs or software modules in an operating system; they can be native applications (APPs), i.e., programs that need to be installed in the operating system to run, such as instant messaging APPs, transportation APPs, or gaming APPs; or they can be mini-programs that can be embedded in any APP, i.e., programs that only need to be downloaded to a browser environment to run. In summary, the aforementioned computer-executable instructions can be any form of instruction, and the aforementioned computer programs can be any form of application, module, or plugin.
[0108] The following describes the information display method provided in the embodiments of this application. The electronic device implementing the information display method of the embodiments of this application can be a terminal, a server, or a combination of both. Therefore, the executing entity of each step will not be described again below.
[0109] See Figure 3 , Figure 3 This is a flowchart illustrating the information display method provided in the embodiments of this application. Figure 1 The following is combined with Figure 3 The steps shown are illustrated using an electronic device as a terminal as an example to explain the information display method provided in the embodiments of this application.
[0110] In step 101, a page including target information is displayed on the screen of the electronic device.
[0111] In practice, the terminal (i.e., electronic device) is equipped with an application that supports displaying target information. This application can be an instant messaging application, a transportation application, a gaming application, a video application, a payment application, a utility application, etc. Users can display target information based on the application according to their actual usage needs.
[0112] Among these, transportation apps can be used to take public transportation, while entertainment apps can be used to view and purchase tickets for attractions; for example, an entertainment app can purchase tickets for an exhibition, with the target information being a graphic code. Video apps are used to watch videos and view other users' interactions with the videos.
[0113] Payment applications are used to make payments for real or virtual items, while utility applications can provide users with tools to display target information using the information display method provided in the embodiments of this application. For example, a utility application can be an application that can automatically enlarge text information.
[0114] The target information can be information displayed to users or other electronic devices. Target information can include text, images, videos, etc. Text can be user-inputted text, text copied by the user, text from web pages, text from e-books, text posted by the user, etc. Images can include images of scenery, portraits, buildings, etc., and can also be graphic codes. Videos can be videos taken by the user or videos from video websites.
[0115] For example, for payment applications, the target information could be a graphic code. As another example, for utility applications, the target information could be text edited by the user, which can then be displayed to other users.
[0116] In some embodiments, depending on the user's actual usage needs, the page including the target information can be displayed in full screen, or the page including the target information can be displayed in a split screen. The ratio of the split screen to the full screen can be set according to actual usage needs. For example, the page including the target information can be displayed in half screen (i.e., split screen).
[0117] In some embodiments, the page may also display other information (i.e., initial information). The meaning of this other information may vary depending on the application. This other information can be text, images, videos, controls, etc. For example, in a payment application, the target information might be a graphic code, and the other information could be prompts indicating how to use the target information. The other information could also be descriptions of controls that redirect to other pages. Each piece of initial information (other information) and each piece of target information corresponds to a page element.
[0118] For example, for video applications, the target information could be the video currently playing, other information could be the video's description, or other comments made by other users about the video; the specifics can be determined based on the actual situation.
[0119] The following is combined Figure 4 The pages provided in the embodiments of this application will be described, see [link to documentation]. Figure 4 , Figure 4 This is a schematic diagram of a page provided in an embodiment of this application. Figure 1 The page includes a graphic code 404 (i.e., target information) and other information.
[0120] exist Figure 4 Other information includes the name 401 corresponding to the graphic code 404. The name 401 is used to represent the purpose of the graphic code 404. The name 401 can be the name of an exhibition, the name of a scenic spot, the name of an item, etc.
[0121] Other information may include the usage date 402 of the graphic code 404, wherein the usage date 402 may be a period of time during which the graphic code 404 can be used, or the usage date 402 may be that the graphic code 404 can be used before a certain date, etc.
[0122] Other information may include the scope of application 403 of the graphic code 404, which limits the scenarios in which the graphic code 404 can be used, and may also limit the items in which the graphic code 404 can be used. For the graphic code 404, other information may also include a voucher code, which uniquely identifies the order corresponding to the graphic code 404. In cases where the graphic code 404 cannot be used, the voucher code can be used to verify the order.
[0123] Other information may include a refresh control 407 for refreshing the graphic code 404, and a description of the refresh control 407: "Refresh page". Other information may also include a save control 408 for saving the graphic code 404, and a description of the save control 408: "Save to local". Other information may also include a share control 409 for sharing the graphic code 404, with a description of the share control 409: "Share with friends".
[0124] Other information may include traveler information 405, scenic spot information 406, and refund control 411. Traveler information 405 is used to identify the user information corresponding to graphic code 404, scenic spot information 406 is used to identify the scenic spot information corresponding to graphic code 404, and refund control 411 is used to perform a refund operation for the order corresponding to graphic code 404.
[0125] In some embodiments, a page including multiple initial information may be displayed. In response to a setting operation on at least one (or more) of the multiple initial information, the initial information set by the setting operation can be used as the target information, thereby allowing a page including the target information to be displayed. The initial information can be found in the description of the other information, and will not be repeated here.
[0126] In some embodiments, a settings control may also be displayed on a page that displays multiple initial information. In response to a setting operation on the settings control, all initial information on the page can be obtained, thereby allowing a settings page for all initial information to be displayed.
[0127] The settings page can display settings controls for each initial piece of information. In response to a setting operation on at least one of the initial pieces of information (i.e., in response to a setting operation on one or more of the initial pieces of information's settings controls), the initial information set in the setting operation is used as the target information, thus displaying a page that includes the target information. This method allows users to set target information according to their actual needs, thereby improving the user experience.
[0128] In step 102, during the display of the page, in response to a change in the display orientation of the page and the orientation of the screen satisfying a preset orientation, the target information is displayed using a target display method.
[0129] To facilitate understanding of step 102, the terms involved in step 102 will be explained below. The process of displaying the page refers to maintaining the page containing the target information on the screen. The process of displaying the page can also be a time period consisting of a first time point and a second time point.
[0130] The first time point is the time when the first page jumps to the page containing the target information, and the second time point is the time when the page containing the target information jumps to the second page. The first page and the second page are other pages in the electronic device besides the page containing the target information, or they can be other pages in the application corresponding to the target information but not containing the target information.
[0131] Display orientation refers to the orientation of various page elements on a webpage. Display orientation can include landscape (corresponding to horizontal screen display), portrait (corresponding to vertical screen display), and inverted (corresponding to landscape) orientations. Landscape orientation means that the page elements are laid out horizontally. For example, for a mobile phone, landscape orientation means that the width of the phone is greater than its height, i.e., a horizontal screen display.
[0132] Portrait mode refers to the vertical expansion of page elements. For example, on a mobile phone, portrait mode means the height of the phone is greater than its width, i.e., a vertical screen display. Inverted mode refers to the vertical reversal of page elements. The inverted and horizontal modes correspond to the two different ways of displaying in landscape mode, respectively. Page elements can include text, images, videos, forms, controls, etc.
[0133] The following is an example of the display orientation. When the electronic device is a mobile phone, the positive orientation is set from the end closer to the charging port to the end closer to the front camera. When the page display orientation is positive, the page element at the top of the page is the page element set at the end closer to the front camera, and the page element at the bottom of the page is the page element set at the end closer to the charging port.
[0134] The display orientation changes, meaning the display orientation of each page element changes. For example, before the page orientation changes, the page element at the top of the page is the one located near the front camera, and the page element at the bottom of the page is the one located near the charging port.
[0135] After the page orientation changes, the page elements at the top of the page become the page elements closest to the first side, and the page elements at the bottom of the page become the page elements closest to the second side. In other words, the page orientation changes from portrait to landscape. The first and second sides refer to the two sides of the screen, excluding the sides near the charging port and the front-facing camera.
[0136] The display orientation changes, meaning there is an angle between the new display orientation and the original (positive) display orientation. The angle between the new display orientation and the original orientation can be any angle between 0 degrees and 360 degrees. For example, if the angle between the new display orientation and the original orientation is 90 degrees, the page's display orientation changes from portrait to landscape.
[0137] In some embodiments, the number of page elements displayed on the page changes before and after the page's display orientation changes; that is, the amount of page information displayed on the page changes. For example, see... Figure 4 ,exist Figure 4 In this context, the page is displayed in portrait orientation, meaning it includes pages with graphic code 404. For information on changes in display orientation, please refer to [link / reference]. Figure 5 , Figure 5 This is a schematic diagram of a page provided in an embodiment of this application. Figure 2 The angle between the changed display direction and the positive direction is 90 degrees, and Figure 5 The amount of other information displayed is less than Figure 4 The amount of other information displayed.
[0138] The display orientation can also change from landscape to portrait, from portrait to landscape, or even be an inverted display. Of course, the angle between the display orientation and the normal orientation can also change, which is also acceptable.
[0139] The orientation of the screen refers to the orientation of the electronic device's screen, or the direction in which the electronic device is used. For example, with the ground as the reference plane, the orientation of the electronic device's screen can be parallel to the ground, perpendicular to the ground, or at an angle of 50 degrees to the ground, etc. The specific orientation can be set according to actual usage needs.
[0140] See Figure 6 , Figure 6 This is a schematic diagram of the screen orientation provided in the embodiments of this application. Figure 1 The screen of electronic device 602 is oriented at a 90-degree angle to the ground 601, meaning the screen of electronic device 602 is perpendicular to the ground 601. The screen of electronic device 603 is oriented at a 0-degree angle to the ground 601, meaning the screen of electronic device 602 is parallel to the ground 601.
[0141] In some embodiments, whether the display orientation of the page changes and whether the orientation of the electronic screen meets the preset orientation can be determined by information from the gyroscope. The gyroscope, also known as an angular momentum sensor, is a device used to sense and maintain orientation. The physical orientation information of the electronic device can be obtained through the gyroscope.
[0142] The gyroscope provides three values: alpha (first angle), beta (second angle), and gamma (third angle). alpha represents the rotation angle of the electronic device around the z-axis, ranging from 0 to 360 degrees. beta represents the rotation angle of the electronic device around the x-axis, ranging from -180 to 180 degrees. gamma represents the rotation angle of the electronic device around the y-axis, ranging from -90 to 90 degrees.
[0143] The y-axis is the positive axis, pointing from the end near the charging port to the end near the front-facing camera. The z-axis is perpendicular to the screen, pointing from the back of the electronic device to the screen. The x-axis is parallel to the side, perpendicular to both the z-axis and y-axis, and parallel to the screen. The gyroscope's coordinate system follows the right-hand rule, meaning the x, y, and z axes are all governed by this rule. The information obtained from the gyroscope can be angle or radian information.
[0144] See Figure 7 , Figure 7 This is a schematic diagram of the axis of the gyroscope provided in the embodiments of this application. Figure 1 , Figure 7 The diagram illustrates the x-axis, y-axis, and z-axis for electronic device 701. For the x-axis, +x represents the positive direction along the x-axis, and -x represents the negative direction along the x-axis. For the y-axis, +y represents the positive direction along the y-axis, and -y represents the negative direction along the y-axis. For the z-axis, +z represents the positive direction along the z-axis, and -z represents the negative direction along the z-axis.
[0145] See Figure 8 , Figure 8 This is a schematic diagram of the axis of the gyroscope provided in the embodiments of this application. Figure 2 , Figure 8 The x-axis for electronic device 801 is shown. Figure 8 The rotation trajectory 802 of the electronic device 801 about the x-axis is also shown, and beta (second angle) can be obtained when the electronic device 801 rotates about the x-axis.
[0146] See Figure 9 , Figure 9 This is a schematic diagram of the axis of the gyroscope provided in the embodiments of this application. Figure 3 , Figure 9The y-axis for electronic device 801 is shown. Figure 9 The rotation trajectory 803 of the electronic device 801 about the y-axis is also shown, and gamma (the third angle) can be obtained when the electronic device 801 rotates about the y-axis.
[0147] See Figure 10 , Figure 10 This is a schematic diagram of the axis of the gyroscope provided in the embodiments of this application. Figure 4 , Figure 10 The z-axis for electronic device 801 is shown. Figure 10 The rotation trajectory 804 of the electronic device 801 about the z-axis is also shown, and alpha (the first angle) can be obtained when the electronic device 801 rotates about the z-axis.
[0148] In some embodiments, in response to a user's triggering action on the application, a gyroscope usage prompt message can be displayed. The gyroscope usage prompt message can be displayed in the form of a pop-up window or an overlay. The gyroscope usage prompt message can include descriptive information describing the application's use of the gyroscope, and can also include an allow control for allowing the use of the gyroscope and a deny control for disallowing the use of the gyroscope.
[0149] See Figure 11 , Figure 11 This is a schematic diagram of the gyroscope usage prompt information provided in the embodiment of this application. The gyroscope usage prompt information can be displayed in the form of a pop-up window on page 1102. The gyroscope usage prompt information may include description information 1105 describing the application's use of the gyroscope. The description information 1105 is the action and direction that "application 1101" wants to access. The gyroscope usage prompt information may also include an allow control 1103 and a deny control 1104.
[0150] In response to the triggering operation of the rejection control 1104, which disallows the application from using the gyroscope, the display orientation of the application's page will not change. Therefore, the target information will not be obscured by other page elements due to the change in the page's display orientation.
[0151] In response to a trigger operation on the allow control 1103, which allows the application to use the gyroscope, if the display orientation of the page representing the gyroscope information is detected to have changed, the screen orientation can be further determined to meet the preset orientation by using the gyroscope information.
[0152] The preset orientation can be set according to actual usage needs. Different preset orientations can be set for different applications, and different preset orientations can also be set for different target information. The preset orientation can be set so that the angle between the screen of the electronic device and the ground is within a preset angle range. For example, the preset orientation can be set so that the angle between the screen of the electronic device and the ground is between 0 degrees and 85 degrees.
[0153] In some embodiments, if the display orientation of the page does not change during the display process, the display method of the target information can remain unchanged. If the display orientation of the page changes, but the screen orientation does not meet the preset orientation, the display method of the target information will remain unchanged.
[0154] In some embodiments, in response to a change in the display orientation of the page and a screen orientation that does not meet a preset orientation, the page is displayed based on the changed display orientation, wherein the changed page does not include target information.
[0155] Alternatively, the display state of the target information on the changed page corresponds to the changed display orientation, and the display state of the target information on the changed page is different from that before the change. For example, if the page display orientation changes from landscape to portrait, the display state of the target information is the same as that in portrait mode, where the target information can be displayed completely.
[0156] When the page orientation changes from portrait to landscape, the target information will be displayed in the same way as in landscape mode. In landscape mode, the target information may not be fully displayed.
[0157] If the page's display orientation changes, and the screen's orientation meets the preset orientation, then the target information is displayed using the target display mode. The target display mode is used to maintain the target information's display state before and after the orientation change. The display state is the visual representation of the target information; a change in the display state means a change in the visibility of the target information. The display state can include displaying the target information completely or displaying it incompletely.
[0158] Full display of target information means that the target information is not obscured by other page elements, and all content of the target information is displayed on the screen. Incomplete display of target information can occur when the target information is obscured by other page elements, or when part of the target information is not displayed on the screen.
[0159] For example, see Figures 4-5 ,exist Figure 4 In the image, the 404 error code is displayed in full. Figure 5In the process, due to the change from portrait to landscape display, the layout of page elements has changed, and part of the content of graphic code 404 is not displayed on the screen, that is, graphic code 404 is not displayed completely.
[0160] Regarding step 102, there are multiple ways to display the target information, meaning there are multiple ways to display the target. These are described in detail below. The first display method responds to changes in the page's display orientation, and if the screen's orientation satisfies a preset orientation, the target information can be displayed in a preset area on the screen. This preset area corresponds to the preset orientation.
[0161] When a user holds an electronic device or uses a clamping tool to hold the device in place, there will be an area on the screen that is obstructed, which will block the target information. As a result, other users or other electronic devices will not be able to view the target information completely, and the display status will be that the target information is not fully displayed.
[0162] To ensure that other users or other electronic devices can view the target information completely, that is, to ensure that the target information can be displayed completely, a correspondence between preset areas and preset orientations can be set according to the user's usage habits or needs. Different preset orientations correspond to different preset areas.
[0163] For example, the preset orientation is that the angle between the screen of the electronic device and the ground is 160 to 200 degrees. That is, when the screen of the electronic device is facing upwards, in order to avoid the user's thumb from blocking the target information, the target information can be displayed in an area (i.e., the preset area) that is close to the front camera on the screen of the electronic device and occupies 60% of the screen.
[0164] For example, see Figure 12 , Figure 12 This is a schematic diagram of a page provided in an embodiment of this application. Figure 3 The screen 1201 of the electronic device displays graphic code 1203, which is the target information. This graphic code 1203 responds to a change in the page display orientation from portrait to landscape (corresponding to...). Figure 12 To prevent the user's finger 1202 from obscuring the graphic code 1203, the graphic code 1203 can be displayed in a preset area. The preset area is the area of the electronic device's screen that is close to the front-facing camera and occupies 60% of the screen.
[0165] For example, the preset orientation is that the angle between the screen of the electronic device and the ground is 80 to 120 degrees. In order to prevent the user's fingers or clamping tools from obscuring the target information, the target information can be displayed in the area formed by the preset distance between the screen of the electronic device and the first and second sides of the screen, as well as the side near the charging port and the side near the front camera (i.e., the preset area). The first and second sides are the two sides other than the side near the charging port and the side near the front camera.
[0166] For example, see Figure 13 , Figure 13 This is a schematic diagram of a page provided in an embodiment of this application. Figure 4 The screen 1301 of the electronic device displays graphic code 1304, which is the target information. This graphic code 1304 responds to a change in the page display orientation from landscape to portrait (corresponding to...). Figure 13 To prevent users' fingers or clamping tools from obscuring the graphic code 1304, the graphic code 1203 can be displayed in a preset area. The preset area is the area formed by the straight line corresponding to one centimeter from the first side 1302, the straight line corresponding to one centimeter from the second side 1303, the edge near the charging port, and the edge near the front camera.
[0167] In some embodiments, a preset region can be set for the positions of other page elements on the page. The preset region is a region that is distinct from the positions of other page elements. For example, see [link to relevant documentation]. Figure 14 , Figure 14 This is a schematic diagram of a page in the related technology. When the display direction of page 1401 changes from portrait to landscape, the layout of each page element in page 1401 changes, causing the graphic code 1402 to be obscured by the return control 1403 (other information, i.e. other page elements).
[0168] The solution proposed in this application can automatically adjust the position of the graphic code 1402 when it is detected that the graphic code 1402 is obscured by other page elements. During the adjustment process, the display size of the graphic code 1402 can also be enlarged or reduced to ensure that the graphic code 1402 can be fully displayed on the page.
[0169] For example, see Figure 15 , Figure 15 This is a schematic diagram of a page provided in an embodiment of this application. Figure 5When the display orientation of page 1401 changes from portrait to landscape, in response to the change in the display orientation of page 1401 and the orientation of the screen meets the preset orientation, the display position of graphic code 1402 can be adjusted, that is, the display position of graphic code 1402 is adjusted away from the return control 1403, so that graphic code 1402 can be fully displayed.
[0170] The first display method, which uses a target display approach, displays the target information within a preset area of the screen. This ensures complete display of the target information and avoids situations where other users cannot view the target information due to changes in the display state, or where other electronic devices cannot recognize the target information due to changes in the display state. In other words, even if the page's display orientation changes, users or other electronic devices can still perceive the target information, effectively displaying it, improving the effectiveness of target information display, and enhancing the user experience.
[0171] The second display method involves displaying a pop-up window on the page in response to a change in the page's display orientation and the screen's orientation meeting a preset orientation. The pop-up window displays the target information on the page.
[0172] Regarding the method of displaying target information in a pop-up window, the longest side of the pop-up window must be less than or equal to the longest side of the screen. A pop-up window displaying target information can obscure page elements in the corresponding position on the page.
[0173] For example, see 16. Figure 16 This is a schematic diagram of a page provided in an embodiment of this application. Figure 6 , Figure 16 Accept Figure 4 In response to a change in the page's display orientation from portrait to landscape, and provided the screen orientation meets the preset orientation, a pop-up window 1601 can be displayed on the page, containing graphic code 404.
[0174] In some embodiments, the target information includes a graphic code, which can be displayed as a pop-up window on the page. The pop-up window includes an opaque first background image, the size of which is the same as the size of the page and covers the page. The graphic code is displayed in the first background image. In this application, opaque means that the transparency is 1, or the transparency is greater than a preset second transparency threshold, which is greater than the first transparency threshold.
[0175] For example, see 17. Figure 17 This is a schematic diagram of a page provided in an embodiment of this application. Figure 7 , Figure 17 Accept Figure 4In response to a change in page orientation from portrait to landscape, and provided the screen orientation matches a preset orientation, a pop-up window 1701 can be displayed on the page. Pop-up window 1701 displays a first background image, which can obscure page elements, effectively covering the entire page. The first background image contains a 404 error code. (Comparison) Figure 17 as well as Figure 16 The size of pop-up 1701 is larger than the size of pop-up 1601.
[0176] In some embodiments, pop-ups can be created using Canvas technology or traditional page structures using HTML and CSS. Both methods are supported in browsers and can achieve the same effect of placing the created pop-up on the page.
[0177] The second display method involves showing a pop-up window on the page, which then displays the target information. This ensures the complete display of the target information and avoids situations where other users cannot view the target information due to changes in the display state, or where other electronic devices cannot recognize the target information due to changes in the display state. In other words, even if the page's display orientation changes, users or other electronic devices can still access the target information, effectively displaying it, improving the effectiveness of the displayed target information, and enhancing the user experience.
[0178] The third display method responds to a change in the page's display orientation and the screen's orientation meets a preset orientation by displaying a floating layer on the page and correspondingly displaying the target information within the floating layer, wherein the floating layer is displayed above the page.
[0179] In some embodiments, the overlay may have a preset transparency, which can be any value between 0 and 1 (including 1 but excluding 0). The transparency may also be a preset transparency greater than a preset first transparency threshold.
[0180] In this context, 0 indicates that the overlay is transparent, meaning it is not visible, while 1 indicates that the overlay is opaque, meaning it is visible. The overlay can obscure page elements at corresponding positions on the page, and the obscured page elements are completely invisible.
[0181] For example, see 18. Figure 18 This is a schematic diagram of a page provided in an embodiment of this application. Figure 8 , Figure 18 Accept Figure 4 In response to a change in the page's display orientation from portrait to landscape, and provided the screen orientation meets the preset orientation, a floating layer 1801 can be displayed on the page, containing graphic code 404.
[0182] In some embodiments, a floating layer is displayed on the page, the floating layer including an opaque second background image, the second background image being the same size as the page and covering the page, and a graphic code being displayed in the second background image. See also the documentation for details. Figure 17 The explanation will not be repeated here. The first and second background images can be the same or different, depending on the actual usage requirements.
[0183] For the second and third display methods, in response to a change in page orientation from landscape to portrait, or vice versa, and provided the screen orientation meets a preset orientation, the target information can be displayed in a landscape mode within a pop-up window or overlay. Landscape mode is defined as the width of the electronic device being greater than its width. This method effectively displays the target information, improving its effectiveness and enhancing the user experience.
[0184] For the second and third display methods, if the target information is a graphic code, the graphic code has "code eyes," which are the positioning points of the graphic code. There can be multiple code eyes, which can be located at preset positions on the graphic code. For example, see [link to relevant documentation]. Figure 19 , Figure 19 This is a schematic diagram of the graphic code provided in the embodiments of this application. Figure 1 The graphic code includes three code eyes, specifically the first code eye 1901, the second code eye 1902, and the third code eye 1903. Figure 19 In the image, the first keyhole 1901 is located in the upper right corner of the image code, the second keyhole 1901 is located in the upper left corner of the image code, and the third keyhole 1903 is located in the lower left corner of the image code.
[0185] Before the page orientation changes, the graphic code is displayed on the page as follows: Figure 19 When the display orientation of the page changes, the display orientation of the graphic code will also change accordingly. For example, when the display orientation of the page changes from portrait to landscape, the first code eye 1901 and the second code eye 1902 will change from the edge closer to the front camera to the edge closer to the first side.
[0186] For example, when the display direction of the page changes from the first direction to the second direction, and the first direction and the second direction are opposite, that is, when it is displayed upside down, the graphic code can be rotated 180 degrees, that is, the preset angle is 180 degrees.
[0187] When displaying target information in landscape mode, in order to ensure compatibility with recognition devices (other electronic devices) that do not support arbitrary rotation of graphic codes and thus guarantee the completion of graphic code scanning, the graphic code can be further rotated if the display orientation of the page changes.
[0188] In some embodiments, target information rotated by a preset angle along a preset direction can be displayed in a pop-up window or overlay in landscape mode. The preset angle is consistent with the change angle of the page's display direction, and the preset direction is opposite to the change direction of the page's display direction.
[0189] See Figure 20 , Figure 20 This is a schematic diagram of the graphic code provided in the embodiments of this application. Figure 2 When the page display orientation changes from portrait to landscape, the direction of the change is clockwise and the angle of change is 90 degrees. The graphic code can be displayed in a pop-up window or overlay in landscape mode, rotating 90 degrees counterclockwise.
[0190] exist Figure 20 In comparison Figure 19 The first keyhole 1901 is located in the upper left corner of the graphic code, the second keyhole 1901 is located in the lower left corner of the graphic code, and the third keyhole 1903 is located in the lower right corner of the graphic code. This design ensures compatibility with recognition devices that do not support arbitrary rotation of the graphic code, expands the application scenarios of the information display method provided in this application embodiment, and further improves the user experience.
[0191] For the second and third display methods, the target information on the page is the first display size. In the pop-up or overlay, the target information with the second display size is displayed. The second display size is adapted to the size of the pop-up or overlay. The second display size is obtained by scaling the first display size.
[0192] The second display size can be larger than the first display size, or it can be smaller than the first display size; both are reasonable. Depending on the size of the pop-up and overlay, the size of the displayed target information can be the same or different.
[0193] For example, see Figure 21 , Figure 21 This is a schematic diagram of a page provided in an embodiment of this application. Figure 9 Corresponding to Figure 17 ,exist Figure 4 as well as Figure 17 In this context, the size of graphic code 404 is the primary display size, meaning that the size of the target information on the page is the primary display size.
[0194] exist Figure 21 In response to the change of the page display orientation from portrait to landscape, and the screen orientation meets the preset orientation, a pop-up window 1701 can be displayed on the page, and then a graphic code 404 of a second display size can be displayed in the pop-up window 1701, the second display size being larger than the first display size.
[0195] In some embodiments, the second display size of the target information may be less than or equal to the size of the pop-up window, and the second display size of the target information may be less than or equal to the size of the overlay. In some embodiments, the longest side corresponding to the target information is less than or equal to the shortest side of the pop-up window, and the longest side corresponding to the target information is less than or equal to the shortest side of the overlay. These are all reasonable.
[0196] In some embodiments, the number of pixels on the shortest side of the screen can be obtained. Then, based on the number of pixels on the shortest side of the screen, the number of pixels corresponding to the side length of the target information can be increased, where the number of pixels corresponding to the side length of the target information is less than or equal to the number of pixels on the shortest side of the screen. This achieves the goal of enlarging the size of the target information.
[0197] In some embodiments, when the target information is displayed in landscape mode, the display size of the target information can be further enlarged. That is, the second display size is larger than the first display size. In this way, the target information can be enlarged while ensuring that the target information is fully displayed, so that other users or other electronic devices can more clearly understand the target information. This can further improve the effectiveness of displaying the target information and enhance the user experience.
[0198] For the second and third display methods, the target information includes a graphic code, which has a first color, and the first color may include one or more colors. The graphic code can be displayed using a pop-up window with a second color, or it can be displayed using an overlay with a third color.
[0199] In this design, the first color differs from the second color, and the first color also differs from the third color. The second color can be the same as or different from the third color. By differentiating the pop-up's color from the target information's color, the target information can be further highlighted. Similarly, by differentiating the overlay's color from the target information's color, the target information can also be further highlighted, thereby more effectively displaying the target information, improving the effectiveness of displaying the target information, and enhancing the user experience.
[0200] Accordingly, when the target information is text or an image, the text and / or image may have a first color, may be displayed in a pop-up window with a second color, or may be displayed in an overlay with a third color.
[0201] For the second and third display methods, a close control for the pop-up or overlay can also be displayed. In response to a trigger action on the close control, the display of the target information using the target display method can be cancelled. This improves the user experience.
[0202] The fourth display method is for the page of the target application. In response to a change in the display orientation of the page and the screen orientation satisfying the preset orientation corresponding to the target application, the target information is displayed using the target display method.
[0203] Different applications may have different preset orientations. For example, an application may include application 1, which is an instant messaging application. The preset orientation of application 1 may be a first preset orientation, which may be parallel to the ground.
[0204] If the page orientation changes and the screen is no longer parallel to the ground (i.e., the screen orientation does not meet the first preset orientation), the display method of the target information can remain unchanged. If the page orientation changes and the screen is parallel to the ground (i.e., the screen orientation meets the first preset orientation), the target information can be displayed using the target display method. The target display method can be one or more of the first to third display methods mentioned above.
[0205] For example, the application may include application 2, which is a video application. The preset orientation of application 2 may be a second preset orientation, which may be the angle between the application and the ground within a preset angle range, which is from 40 degrees to 150 degrees between the application and the ground.
[0206] If the page orientation changes and the angle between the screen and the ground is not within a preset angle range, indicating that the screen orientation does not meet the first preset orientation, then the display method of the target information can remain unchanged. If the page orientation changes and the angle between the screen and the ground is within a preset angle range, indicating that the screen orientation meets the first preset orientation, then a pop-up window displaying the target information can be used in a preset area corresponding to the preset orientation.
[0207] In this way, different applications can have different preset orientations. The target information is only displayed in the target display mode when the page display orientation changes and the screen orientation meets the preset orientation corresponding to the target application, which can further improve the user experience.
[0208] The fifth display method involves text information as the target information, with the text information having the first font size. In response to a change in the page's display orientation and the screen's orientation meeting a preset orientation, the text information with the second font size is displayed in a scrolling manner, and the second font size is larger than the first font size.
[0209] In other words, when the display orientation of the page changes and the screen orientation meets the preset orientation, text information with the first font size can be enlarged to text information with the second font size, thereby displaying the enlarged text information.
[0210] In some embodiments, the second font size corresponds to the screen size, that is, the second font size can be the largest font size that the screen size can fully display a single character. In order to facilitate other users to view the text information, the text information with the second font size can be scrolled and displayed.
[0211] See Figure 22 , Figure 22 This is a schematic diagram of a page provided in an embodiment of this application. Figure 10 In response to user input, the text "text1 text2 text3" entered by the user can be displayed on page 2201, with the font size of "text1 text2 text3" being the first font size.
[0212] During page display, in response to a change in page orientation from portrait to landscape, and provided the screen orientation meets the preset orientation, text information with the second font size is scrolled and displayed. See also Figure 23 , Figure 23 This is a schematic diagram of a page provided in an embodiment of this application. Figure 10 First, in response to the change of the display orientation of page 2201 from portrait to landscape and the orientation of the screen meeting the preset orientation, text information "text1 text2" with the second font size can be displayed.
[0213] See Figure 24 , Figure 24 This is a schematic diagram of a page provided in an embodiment of this application. Figure 10 Second, in response to the change of display orientation of page 2201 from portrait to landscape, and with the screen orientation meeting the preset orientation, after displaying the text information "Text1 Text2" in the second font size, the text information can scroll to display the text information "1 Text2 Text3". See [link / reference]. Figures 23-24 This allows for scrolling display of "Text1 Text2 Text3".
[0214] The fifth display method can be applied to scenarios where other users need to view text information. For example, in a concert scenario, after the audience enters the text information they want the performers to see on their mobile phones, the display orientation of the page changes from portrait to landscape, and the screen orientation meets the preset orientation. The scrolled text information is displayed with the font size enlarged, which can solve the above-mentioned technical problem 2.
[0215] The fifth display method can automatically enlarge the font size of text information and display the enlarged text information in a scrolling manner, which can effectively display the target information, improve the effectiveness of displaying the target information, and enhance the user experience.
[0216] The sixth display method responds to a change in the display orientation of the page and the screen orientation meets the preset orientation. It detects the page after the change in display orientation and obtains the detection result. The detection result is used to characterize whether there are page elements on the page that obscure the target information.
[0217] If there are no page elements obscuring the target information on the detection results representation page, the display method of the target information can remain unchanged. To avoid changes in the layout of page elements due to changes in display orientation, if there are page elements obscuring the target information on the detection results representation page, the transparency of these page elements can be set to zero.
[0218] In other words, if the detection results indicate that there are page elements on the page that obscure the target information, the transparency of the page elements can be adjusted to zero, and then the target information can be displayed based on the page elements with adjusted transparency.
[0219] For example, in Figure 14 When the display orientation of page 1401 changes from portrait to landscape, the layout of the various page elements in page 1401 changes, causing the graphic code 1402 to be obscured by the return control 1403.
[0220] See Figure 25 , Figure 25 This is a schematic diagram of a page provided in an embodiment of this application. Figure 10 Third, accepting Figure 14 The opacity of the return control 1403 (page element) can be adjusted to zero, and then the graphic code 1402 can be displayed based on the page element with the adjusted opacity.
[0221] In some embodiments, in response to a change in the display orientation of the page and the orientation of the screen satisfying a preset orientation, the display position of the target information on the page is adjusted based on the changed display orientation of the page so that the display position adapts to the changed display orientation of the page. If there are page elements in the page after the change in display orientation that overlap with the display position, the transparency of the page elements is set to zero.
[0222] The sixth display method allows setting the transparency of page elements that overlap with the display position in the page after the display orientation has changed to 0, thereby achieving complete display of the target information. This effectively displays the target information, improves the effectiveness of the displayed target information, and enhances the user experience.
[0223] By employing the first to sixth display methods described above, even when the page's display orientation changes and the screen's orientation meets a preset requirement, the display state of the target information remains unchanged before and after the orientation change. Compared to related technologies, this avoids situations where other users cannot view the target information due to changes in display state, or where other electronic devices cannot recognize the target information. In other words, even when the page's display orientation changes, users or other electronic devices can still access the target information, effectively displaying it, improving the effectiveness of displaying the target information, and enhancing the user experience. Therefore, it solves the aforementioned technical problem 1.
[0224] For example, when the target information is a graphic code, the user needs to align the screen of the electronic device displaying the graphic code with the scanning device (i.e., other electronic devices). If the screen orientation of the electronic device is not locked, the display orientation of the page on the electronic device will change, and the orientation of the screen will meet the preset orientation. This ensures that the display state of the target information remains unchanged before and after the change in display orientation, meaning that the target information can be displayed completely. Therefore, scanning can be achieved, thereby improving the user experience and solving the aforementioned technical problem 1.
[0225] In some embodiments, the target information includes a graphic code, in Figure 3 After step 102, that is, after displaying the target information using the target display mode, if the duration of displaying the graphic code is less than or equal to the preset duration threshold, the target information can continue to be displayed using the target display mode.
[0226] If the duration of displaying the graphic code exceeds a preset duration threshold, a new graphic code obtained after refreshing the graphic code is displayed using the target display method. The new graphic code serves the same purpose as the original graphic code, only used to distinguish it from the original. The target display method can be any one or more of the first through sixth display methods described above.
[0227] For example, to undertake Figure 21 After displaying the graphic code 404 of the second display size in the pop-up window 1701, the graphic code 404 of the second display size can be displayed in the pop-up window 1701 if the duration of displaying the graphic code is less than or equal to the preset duration threshold.
[0228] See Figure 26 , Figure 26 This is a schematic diagram of a page provided in an embodiment of this application. Figure 10 Fourth, if the duration of displaying the graphic code exceeds a preset duration threshold, a new graphic code 2601 with a second display size can be displayed in pop-up window 1701. In this way, when the graphic code is refreshed, the refreshed graphic code can be displayed using a target display method, which improves the effectiveness of the displayed target information while ensuring the security of the graphic code, thereby further enhancing the user experience.
[0229] In some embodiments, the target information is a graphic code. Figure 3 After step 102 shown, that is, after displaying the target information in the target display mode, the display of the target information in the target display mode can be cancelled in response to the scanning of the graphic code.
[0230] In response to the scanning of the graphic code, the target information can be displayed in the target display mode instead of the target display mode. The target display mode can be any one or more of the first to sixth display modes mentioned above. In response to the scanning of the graphic code, the target information can be displayed in the target display mode.
[0231] In some embodiments, the scan result is used to indicate whether the graphic code has been scanned. The scan result can indicate a successful scan or a failed scan. For example, the scan result can be "Scan successful." Another example is "Graphic code expired." In this way, scanning of graphic codes displayed using the target display method can be completed without the user's awareness, and the user can easily obtain the scan result, thereby improving the user experience.
[0232] In some embodiments, Figure 3Prior to step 101, a smart mode switch can be displayed on the page. This smart mode switch controls the display mode of the target information on the page. In response to a trigger operation on the smart mode switch, the display mode of the target information on the page is controlled to smart mode.
[0233] The intelligent mode is used to characterize whether the information display method provided in this application embodiment is adopted. When the intelligent mode is not enabled, in response to the change of the display direction of the page and the orientation of the screen satisfying the preset orientation, the page is displayed based on the changed display direction. The changed page does not include target information, or the display state of the target information in the changed page corresponds to the changed display direction and the display state of the target information in the changed page is different from that before the change.
[0234] With smart mode enabled Figure 3 Step 102 shown can be implemented in the following way: In smart mode, in response to a change in the display orientation of the page and the screen orientation meeting a preset orientation, target information is displayed using a target display method. For details, please refer to the description of step 102, which will not be repeated here.
[0235] For example, see Figure 27 , Figure 27 This is a schematic diagram of a page provided in an embodiment of this application. Figure 10 Fifth, display the smart mode switch 2702 on the page. When the smart mode switch 2702 indicates that the smart mode is not turned on, the page should be displayed based on the changed display orientation, provided that the screen orientation meets the preset orientation. The changed page does not include the graphic code 2701, or the display state of the graphic code 2701 on the changed page corresponds to the changed display orientation and the display state of the graphic code 2701 on the changed page is different from that before the change.
[0236] When the smart mode switch 2702 indicates that smart mode is not enabled, the graphic code 2701 can be displayed using the target display method if the page display orientation changes and the screen orientation meets the preset orientation. In this way, users can set whether to enable smart mode according to their usage needs, further improving the user experience.
[0237] For example, when a user is lying down and using the terminal to view a video, the video displayed on the terminal will change its display orientation as the user turns over. However, the user does not need the video display orientation to change, so a smart mode switch can be displayed on the page.
[0238] In response to the trigger operation of the smart mode switch, smart mode can be turned on. In smart mode, in response to the change of the page display orientation and the screen orientation meeting the preset orientation, other video playback applications can be launched and the video can be displayed in the form of a pop-up window. The size of the pop-up window is the same as the size of the page, the display orientation of the video does not change, and the video can be displayed in its entirety, that is, the display state of the video does not change.
[0239] To further facilitate understanding of the information display method provided in the embodiments of this application, the following examples illustrate the information display method provided in the embodiments of this application. (See also...) Figure 28 , Figure 28 This is a flowchart illustrating the information display method provided in the embodiments of this application. Figure 2 The following is combined with Figure 28 The steps shown illustrate the information display method provided in the embodiments of this application.
[0240] In step 2801, a page including multiple initial information is displayed.
[0241] See for Figure 4 The explanation, Figure 4 The following information is initially set: Name 401, Date of Use 402, Scope of Application 403, Graphic Code 404, Traveler Information 405, Scenic Area Information 406, Refresh Control 407, Description of Refresh Control 407: "Refresh Page", Save Control 408, Description of Save Control 408: "Save to Local", Share Control 409, Description of Share Control 409: "Share with Friends", and Refund Control 411.
[0242] In step 2802, in response to a setting operation for at least one of a plurality of initial information, the initial information set by the setting operation is used as the target information, and a page including the target information is displayed.
[0243] In some embodiments, in response to Figure 4 The setting operation for graphic code 404 can use graphic code 404 as target information. In some embodiments, in response to targeting Figure 4 The description information of the sharing control 409 in the middle is the setting operation of "share with friends" (i.e., text information), and "share with friends" can be used as the target information.
[0244] In some embodiments, when displaying a page including target information, the information display method provided in this application embodiment can be executed. The information display method provided in this application embodiment can be performed through other applications that are different from the application corresponding to the target application.
[0245] In other words, when displaying a page that includes target information, the application corresponding to the information display method provided in this application embodiment can be launched. In this way, it is possible to be compatible with target information in different scenarios. For example, if the target information is a graphic code that is displayed after a video is played, the application corresponding to the information display method provided in this application embodiment can be launched after the video is played, which can avoid interrupting the user's other operations and thus improve the user experience.
[0246] In step 2803, a pop-up window displays a prompt message for using the gyroscope.
[0247] The gyroscope usage prompt message may include a description of the application's use of the gyroscope, and may also include an allow control to allow gyroscope use and a deny control to disallow gyroscope use. For step 2803, please refer to [link to relevant documentation]. Figure 11 The explanation will not be repeated here.
[0248] In some embodiments, authorization to the gyroscope can be initiated using window.DeviceOrientationEvent.requestPermission(gyroscope usage initiation command). After launching the application corresponding to the information display method provided in this application embodiment, the gyroscope usage initiation command can run, thereby displaying gyroscope usage prompt information in a pop-up window.
[0249] Following step 2802, after launching the application corresponding to the information display method provided in this application embodiment, a pop-up window can display gyroscope usage prompts. If step 2803 is executed before the video has finished playing, it will cause confusion for the user. Launching the application corresponding to the information display method provided in this application embodiment only after the video has finished playing, and then displaying the gyroscope usage prompts, can avoid interrupting the user's other operations, thereby improving the user experience.
[0250] In step 2804, information from the gyroscope is acquired in response to a trigger operation on the enabled control.
[0251] In response to a trigger operation on the rejection control, step 2805 can be executed. In step 2805, in response to a change in the display orientation of the page and the orientation of the screen satisfying a preset orientation, the page is displayed based on the changed display orientation.
[0252] In some embodiments, the changed page does not include the target information, or the display state of the target information on the changed page corresponds to the changed display direction, and the display state of the target information on the changed page is different from that before the change. In some embodiments, the gyroscope information can be stored in the cache of the electronic device.
[0253] In step 2806, based on the information from the gyroscope, it is determined whether the display orientation of the page has changed.
[0254] If the page display orientation remains unchanged, proceed to step 2807 without altering the display method of the target information. In some embodiments, the gyroscope information stored in the cache can be identified, that is, the code corresponding to the gyroscope information can be identified.
[0255] In some embodiments, an information identification instruction can be used to execute code corresponding to the information of the gyroscope. The information identification instruction can be a first information identification instruction deviceorientation or a second information identification instruction orientationchange.
[0256] In some embodiments, when the second information recognition instruction identifies 0 degrees or 180 degrees, it indicates that the display orientation of the page is landscape; when the second information recognition instruction identifies -90 degrees or 90 degrees, it indicates that the display orientation of the page is portrait; if the second information recognition instruction identifies a change from 0 degrees to 90 degrees, it indicates that the display orientation of the page has changed from landscape to portrait.
[0257] In step 2808, based on the information from the gyroscope, it is determined whether the orientation of the screen meets the preset orientation.
[0258] If the screen orientation meets the preset orientation, proceed to step 2809; if the screen orientation does not meet the preset orientation, proceed to step 2805. In some embodiments, the screen orientation can be determined using the beta and gamma of the gyroscope.
[0259] See Figure 29 , Figure 29 This is a schematic diagram of the gate provided in an embodiment of this application. Figure 29 The diagram shows a turnstile 2902. The turnstile 2902 has a scanning area 2901, which can scan the graphic code (i.e., target information) in the scanning area 2901. If the scan is successful, the automatic door 2903 of the turnstile 2902 can be opened, thus facilitating the user to pass through the turnstile.
[0260] against Figure 29 The gate shown may have a preset orientation, which may include: for beta, beta is between -180 degrees and -145 degrees, or beta is between 145 degrees and 180 degrees; for gamma, gamma is between -30 degrees and 30 degrees. If the screen orientation meets the preset orientation, it means that the screen of the electronic device is aligned with the scanning area 2901 of the gate 2902.
[0261] For example, see Figure 30 , Figure 30 This is a schematic diagram of the screen orientation provided in the embodiments of this application. Figure 2 User 3002 can hold electronic device 3003. When the display orientation of the page on electronic device 3003 changes, and the orientation of the screen of electronic device 3003 meets the preset orientation (that is, when the angle between the display screen of electronic device 3003 and the ground 3001 is within the preset angle range), it indicates that the screen of electronic device 3003 is aligned. Figure 29 The scanning area 2901 of the gate 2902 is shown.
[0262] In step 2809, in response to a change in the page's display orientation and the screen's orientation meeting a preset orientation, the target information is displayed using a target display method. In step 2809, in response to the graphic code being scanned, the display of the target information using the target display method is cancelled.
[0263] In some embodiments, in response to a change in the display orientation of the page and a preset orientation of the screen, a pop-up window can be displayed on the page. The pop-up window includes an opaque first background image, the size of which is the same as the size of the page, and the first background image covers the page. For example, see... Figure 31 , Figure 31 This is a schematic diagram of a page provided in an embodiment of this application. Figure 10 Sixth, a pop-up window 3102 can be displayed on top of page 3101, and the first background image included in pop-up window 3102 covers page 3101.
[0264] Then, a graphic code rotated by a preset angle can be displayed in the first background image. In some embodiments, the display size of the graphic code can be a second display size, while the display size of the graphic code displayed on the page is a first display size, and the second display size is larger than the first display size.
[0265] The information display method provided in this application embodiment can maintain the display state of the target information unchanged before and after the change in display orientation, even when the display orientation of the page changes and the screen orientation meets a preset orientation. Compared with related technologies, this avoids situations where other users cannot view the target information or other electronic devices cannot recognize the target information due to changes in display orientation. In other words, even when the display orientation of the page changes, users or other electronic devices can still obtain the target information, effectively displaying the target information, improving the effectiveness of displaying the target information, and enhancing the user experience.
[0266] The information display method provided in this application allows users to view target information from any handheld angle even without locking the phone screen orientation, improving the user's interactive experience when using the turnstile. Furthermore, the information display method provided in this application does not interfere with page design and development, reducing page compatibility difficulties and improving project development efficiency.
[0267] The following description continues to illustrate the exemplary structure of the information display device 455 provided in the embodiments of this application as a software module. In some embodiments, such as Figure 2 As shown, the software module stored in the information display device 455 in the memory 450 may include:
[0268] Display module 4551 is used to display a page containing target information on the screen of an electronic device.
[0269] The response module 4552 is used to display the target information in a target display mode in response to a change in the display orientation of the page and the orientation of the screen satisfying a preset orientation during the display of the page.
[0270] The target display mode is used to keep the display state of the target information unchanged before and after the change in display direction.
[0271] In some embodiments, the response module 4552 is further configured to display the target information in a preset area of the screen in response to a change in the display orientation of the page and the orientation of the screen satisfying a preset orientation; wherein the preset area corresponds to the preset orientation.
[0272] In some embodiments, the response module 4552 is further configured to display a pop-up window or overlay on the page in response to a change in the display orientation of the page and the orientation of the screen satisfying a preset orientation, and to display the target information in the pop-up window or overlay.
[0273] In some embodiments, when the display orientation of the page changes from landscape to portrait or vice versa, the response module 4552 is further configured to display the target information in the pop-up window or overlay using a landscape display mode.
[0274] In some embodiments, the target information is a graphic code, and the response module 4552 is also used to display the target information rotated by a preset angle in the pop-up window or overlay in a landscape mode.
[0275] In some embodiments, the target information includes a graphic code. The response module 4552 is also used to display a pop-up window on the page. The pop-up window includes an opaque first background image. The size of the first background image is the same as the size of the page, and the first background image covers the page. The graphic code is displayed in the first background image.
[0276] Alternatively, an overlay may be displayed on the page, the overlay including an opaque second background image, the second background image being the same size as the page and covering the page, and the graphic code being displayed in the second background image.
[0277] In some embodiments, the size of the target information in the page is a first display size, and the response module 4552 is further configured to display the target information having a second display size in the pop-up window or floating layer; wherein the second display size is adapted to the size of the pop-up window or the size of the floating layer, and is obtained by scaling the first display size.
[0278] In some embodiments, the target information includes a graphic code having a first color. The response module 4552 is further configured to display the graphic code using a pop-up window with a second color or an overlay with a third color, wherein the first color is different from the second color and the first color is different from the third color.
[0279] In some embodiments, the page is the page of the target application; the response module 4552 is further configured to display the target information in a target display mode in response to a change in the display orientation of the page and the orientation of the screen satisfying a preset orientation corresponding to the target application.
[0280] In some embodiments, the target information is text information, and the font size of the text information is a first font size; the response module 4552 is further configured to respond to a change in the display direction of the page and the orientation of the screen satisfying a preset orientation, and scroll to display the text information with a font size of a second font size, wherein the second font size is greater than the first font size.
[0281] In some embodiments, the response module 4552 is further configured to, in response to a change in the display orientation of the page and the orientation of the screen satisfying a preset orientation, detect the page after the change in display orientation and obtain a detection result; if the detection result indicates that there is a page element in the page that obscures the target information, adjust the transparency of the page element to zero; and display the target information based on the page element with adjusted transparency.
[0282] In some embodiments, the response module 4552 is further configured to, in response to a change in the display orientation of the page and the orientation of the screen satisfying a preset orientation, adjust the display position of the target information on the page based on the changed display orientation of the page, so that the display position adapts to the changed display orientation of the page; wherein, if there are page elements in the page after the change in display orientation that overlap with the display position, the transparency of the page elements is set to zero.
[0283] In some embodiments, the target information includes a graphic code. After the target information is displayed using the target display method, the response module 4552 is further configured to display a new graphic code obtained after refreshing the graphic code using the target display method if the duration of displaying the graphic code is greater than a preset duration threshold.
[0284] In some embodiments, the target information is a graphic code. After the target information is displayed using the target display mode, the display module 4551 is further configured to perform at least one of the following: cancel the display of the target information using the target display mode; or display the scanning result of the target information using the target display mode.
[0285] In some embodiments, the response module 4552 is further configured to display the page based on the changed display orientation in response to a change in the display orientation of the page and a screen orientation that does not meet a preset orientation;
[0286] Wherein, the changed page does not include the target information, or the display state of the target information in the changed page corresponds to the changed display direction, and the display state of the target information in the changed page is different from that before the change.
[0287] In some embodiments, the display module 4551 is further configured to display a smart mode switch before displaying the target information using the target display method, the smart mode switch being configured to control the display mode of the target information in the page;
[0288] The response module 4552 is further configured to, in response to a trigger operation on the smart mode switch, control the display mode of the target information on the page to smart mode. In smart mode, in response to a change in the display orientation of the page and the orientation of the screen satisfying a preset orientation, the target information is displayed using a target display method.
[0289] In some embodiments, the display module 4551 is further configured to display a page including a plurality of initial information; in response to a setting operation for at least one of the plurality of initial information, the initial information set by the setting operation is used as target information, and a page including the target information is displayed.
[0290] This application provides a computer program product, which includes a computer program or computer-executable instructions stored in a computer-readable storage medium. The processor of an electronic device reads the computer-executable instructions from the computer-readable storage medium and executes the computer-executable instructions, causing the electronic device to perform the information display method described in this application.
[0291] This application provides a computer-readable storage medium storing computer-executable instructions or a computer program. When the computer-executable instructions or the computer program are executed by a processor, the processor will execute the information display method provided in this application. For example, ... Figure 3 The method for displaying information is shown.
[0292] In some embodiments, the computer-readable storage medium may be a memory such as RAM, ROM, flash memory, magnetic surface memory, optical disk, or CD-ROM; or it may be a variety of devices including one or any combination of the above-mentioned memories.
[0293] In some embodiments, computer-executable instructions may take the form of programs, software, software modules, scripts, or code, written in any form of programming language (including compiled or interpreted languages, or declarative or procedural languages), and may be deployed in any form, including as stand-alone programs or as modules, components, subroutines, or other units suitable for use in a computing environment.
[0294] As an example, computer-executable instructions may, but do not necessarily, correspond to files in a file system. They may be stored as part of a file that holds other programs or data, for example, in one or more scripts in a Hyper Text Markup Language (HTML) document, in a single file dedicated to the program in question, or in multiple co-located files (e.g., files that store one or more modules, subroutines, or code sections).
[0295] As an example, computer-executable instructions can be deployed to execute on a single electronic device, or on multiple electronic devices located at one location, or on multiple electronic devices distributed across multiple locations and interconnected via a communication network.
[0296] The information display method provided in this application embodiment can maintain the display state of the target information unchanged before and after the change in display orientation, even when the display orientation of the page changes and the screen orientation meets a preset orientation. Compared with related technologies, this avoids situations where other users cannot view the target information or other electronic devices cannot recognize the target information due to changes in display orientation. In other words, even when the display orientation of the page changes, users or other electronic devices can still obtain the target information, effectively displaying the target information, improving the effectiveness of displaying the target information, and enhancing the user experience.
[0297] The above description is merely an embodiment of this application and is not intended to limit the scope of protection of this application. Any modifications, equivalent substitutions, and improvements made within the spirit and scope of this application are included within the scope of protection of this application.
Claims
1. An information display method, characterized in that, The method includes: A page containing target information is displayed on the screen of an electronic device; During the display of the page, in response to a change in the display orientation of the page and a screen orientation that satisfies a preset orientation, the target information is displayed using a target display method. The target display mode is used to keep the display state of the target information unchanged before and after the change in display direction.
2. The method according to claim 1, characterized in that, The step of displaying the target information in response to a change in the display orientation of the page and the orientation of the screen satisfying a preset orientation includes: In response to a change in the display orientation of the page and a screen orientation that satisfies a preset orientation, the target information is displayed in a preset area of the screen; wherein the preset area corresponds to the preset orientation.
3. The method according to claim 1, characterized in that, The step of displaying the target information in response to a change in the display orientation of the page and the orientation of the screen satisfying a preset orientation includes: In response to a change in the display orientation of the page and the orientation of the screen satisfying a preset orientation, a pop-up window or overlay is displayed on the page, and the target information is displayed in the pop-up window or overlay.
4. The method according to claim 3, characterized in that, When the page display orientation changes from landscape to portrait or vice versa, displaying the target information in the pop-up window or the overlay includes: The target information is displayed in landscape mode in the pop-up window or the overlay.
5. The method according to claim 4, characterized in that, The target information is a graphic code, and displaying the target information in the pop-up window or the overlay using a landscape display mode includes: The target information, rotated by a preset angle, is displayed in the pop-up window or the floating layer in landscape mode.
6. The method according to claim 3, characterized in that, The target information includes a graphic code. Displaying a pop-up window or overlay on the page, and displaying the target information in the pop-up window or overlay, includes: A pop-up window is displayed on the page, the pop-up window including an opaque first background image, the size of the first background image being the same as the size of the page and covering the page, and the graphic code being displayed in the first background image; Alternatively, an overlay may be displayed on the page, the overlay including an opaque second background image, the second background image being the same size as the page and covering the page, and the graphic code being displayed in the second background image.
7. The method according to claim 3, characterized in that, The size of the target information on the page is a first display size, and displaying the target information in the pop-up window or the overlay includes: The target information with a second display size is displayed in the pop-up window or the floating layer; The second display size is adapted to the size of the pop-up window or the size of the floating layer, and is obtained by scaling the first display size.
8. The method according to claim 3, characterized in that, The target information includes a graphic code, the graphic code having a first color; displaying the target information in the pop-up window or the overlay includes: The graphic code is displayed using a pop-up window with a second color or an overlay with a third color, wherein the first color is different from the second color and the third color is different from the third color.
9. The method according to claim 1, characterized in that, The page in question is a page of the target application; The step of displaying the target information in response to a change in the display orientation of the page and the orientation of the screen satisfying a preset orientation includes: In response to a change in the display orientation of the page and the orientation of the screen satisfying a preset orientation corresponding to the target application, the target information is displayed using a target display method.
10. The method according to claim 1, characterized in that, The target information is text information, and the font size of the text information is the first font size; The step of displaying the target information in response to a change in the display orientation of the page and the orientation of the screen satisfying a preset orientation includes: In response to a change in the display orientation of the page and the orientation of the screen satisfying a preset orientation, the text information with a second font size is scrolled and displayed, where the second font size is larger than the first font size.
11. The method according to claim 1, characterized in that, The step of displaying the target information in response to a change in the display orientation of the page and the orientation of the screen satisfying a preset orientation includes: In response to a change in the display orientation of the page and the orientation of the screen satisfying a preset orientation, the page after the change in display orientation is detected, and a detection result is obtained; If the detection result indicates that there are page elements on the page that obscure the target information, adjust the transparency of the page elements to zero; The target information is displayed based on the page elements with adjusted transparency.
12. The method according to claim 11, characterized in that, The step of displaying the target information in response to a change in the display orientation of the page and the orientation of the screen satisfying a preset orientation includes: In response to a change in the display orientation of the page and the orientation of the screen satisfying a preset orientation, the display position of the target information on the page is adjusted based on the changed display orientation of the page, so that the display position adapts to the changed display orientation of the page. If there are page elements in the page after the display orientation change that overlap with the display position, the transparency of the page elements is set to zero.
13. The method according to claim 1, characterized in that, The target information includes a graphic code. After displaying the target information using a target display method, the method further includes: If the duration of displaying the graphic code exceeds a preset duration threshold, the new graphic code obtained after refreshing the graphic code is displayed using the target display method.
14. The method according to claim 1, characterized in that, The target information is a graphic code. After displaying the target information using a target display method, the method further includes: In response to the scanning of the graphic code, perform at least one of the following: Cancel the display of the target information using the target display method; The scanning results of the target information are displayed using the target display method described above.
15. The method according to claim 1, characterized in that, The method further includes: In response to a change in the display orientation of the page and a screen orientation that does not meet a preset orientation, the page is displayed based on the changed display orientation; Wherein, the modified page does not include the target information, or; The display state of the target information on the changed page corresponds to the changed display direction, and the display state of the target information on the changed page is different from that before the change.
16. The method according to claim 1, characterized in that, Before displaying the target information using a target display method, the method further includes: The display smart mode switch is used to control the display mode of the target information on the page; In response to a trigger operation on the smart mode switch, the display mode of the target information on the page is controlled to be smart mode; The step of displaying the target information in response to a change in the display orientation of the page and the orientation of the screen satisfying a preset orientation includes: In the intelligent mode, in response to a change in the display orientation of the page and the orientation of the screen satisfying a preset orientation, the target information is displayed using a target display method.
17. The method according to claim 1, characterized in that, The page displaying the target information includes, Displays a page that includes multiple initial information; In response to a setting operation for at least one of the plurality of initial information, the initial information set by the setting operation is used as the target information, and a page including the target information is displayed.
18. An information display device, characterized in that, The device includes: The display module is used to display a page containing target information on the screen of an electronic device; The response module is used to display the target information in a target display mode when the display direction of the page changes and the orientation of the screen meets the preset orientation during the display of the page. The target display mode is used to keep the display state of the target information unchanged before and after the change in display direction.
19. An electronic device, characterized in that, The electronic device includes: Memory is used to store executable instructions or computer programs. A processor, when executing computer-executable instructions or computer programs stored in the memory, implements the information display method according to any one of claims 1 to 17.
20. A computer-readable storage medium storing computer-executable instructions or a computer program, characterized in that, When the computer-executable instructions or computer program are executed by a processor, the information display method according to any one of claims 1 to 17 is implemented.
21. A computer program product comprising computer-executable instructions or a computer program, characterized in that, When the computer-executable instructions or computer program are executed by a processor, the information display method according to any one of claims 1 to 17 is implemented.