Page display method, system, electronic device and computer readable storage medium

Abstract

Embodiments of the present application provide a page display method, system, electronic device and computer readable storage medium. The method comprises: establishing a screen projection connection; in response to a touch operation of a view control by a user, displaying a function menu area, wherein the function menu area comprises a plurality of areas corresponding to functions; in response to a drag operation of the view control by the user, determining a target function selected by the user from the plurality of functions; and sending page data of the target function to a vehicle terminal, so that the vehicle terminal gradually displays a target function page corresponding to the target function. Through the page display method of the embodiments of the present application, in the process of dragging the control, the vehicle terminal can gradually display the target function page corresponding to the target function selected by the user according to the drag operation of the user, thereby increasing the practicability and fun of the interaction between the intelligent terminal and the vehicle terminal, and bringing the user the association and interaction between the screen projection device (the intelligent terminal and the vehicle terminal).

Description

Technical Field

[0001] The embodiments of the present invention relate to the field of vehicle networking technology, and in particular to a page display method, system, electronic device and computer-readable storage medium. Background Technology

[0002] With the rapid development of vehicle networking technology, in-vehicle terminals (such as central control screens) now support screen mirroring. Users can project the display page of their smart terminals (such as mobile phones, iPads, etc.) onto the in-vehicle terminal according to their needs, enabling both the smart terminal and the in-vehicle terminal to support touch operation for user convenience. However, in traditional in-vehicle screen mirroring solutions, both the in-vehicle terminal and the smart terminal display the same page, and the in-vehicle terminal directly displays the same page as the smart terminal. Therefore, this does not provide users with the interactive fun between the smart terminal and the in-vehicle terminal, lacking entertainment value. Summary of the Invention

[0003] One objective of this invention is to provide a page display method, system, electronic device, and computer-readable storage medium. Its advantage lies in that after establishing a screen projection connection, as the user drags the view control, the vehicle terminal can gradually move the target function page corresponding to the user's selected target function according to the user's drag operation, thereby increasing the practicality and enjoyment of the interaction between the smart terminal and the vehicle terminal, and bringing users the connection and interaction between screen projection devices.

[0004] Another objective of this invention is to provide a page display method, system, electronic device, and computer-readable storage medium, the advantage of which is that when the view control is dragged to the selected area, the vehicle terminal and the smart terminal display different pages, breaking the traditional method of displaying the same page at both ends in vehicle screen projection, thereby enhancing the interaction and entertainment between screen projection devices.

[0005] Another objective of this invention is to provide a page display method, system, electronic device, and computer-readable storage medium, the advantage of which is that when the view control moves in the reverse direction or returns directly to the initial position, the vehicle terminal can provide users with a variety of screen projection cancellation interaction experiences, thereby further enhancing the user's operating experience at both ends during screen projection.

[0006] Another objective of this invention is to provide a page display method, system, electronic device, and computer-readable storage medium. Its advantage lies in that the vehicle terminal initializes the animation effect according to the animation effect triggering command sent by the smart terminal, thereby switching the state of the vehicle terminal and preparing for the vehicle terminal to move the target function page in real time and in reverse.

[0007] Another objective of this invention is to provide a page display method, system, electronic device, and computer-readable storage medium, the advantage of which is that the smart terminal can determine the target function selected by the user according to the angle range, thereby enabling the user's selection to be automatically identified quickly and accurately, preparing for the subsequent vehicle terminal to move the target function page in real time according to the movement operation of the view control.

[0008] To achieve the above objectives, a first aspect of the present invention provides a page display method. The method includes: establishing a projection connection; displaying a function menu area in response to a user's touch operation on a view control, wherein the function menu area includes areas corresponding to multiple functions; determining the target function selected by the user from the multiple functions in response to a user's drag operation on the view control; sending page data of the target function to an in-vehicle terminal so that the in-vehicle terminal gradually displays the target function page corresponding to the target function; the page data of the target function includes the identifier of the target function, the movement displacement of the view control, and the movement speed of the view control; the speed at which the in-vehicle terminal gradually displays the target function page is determined based on the movement speed of the view control, and the proportion of the target function page gradually displayed by the in-vehicle terminal relative to the complete target function page is determined based on the movement displacement of the view control.

[0009] A second aspect of this invention provides a page display system. The system includes: a smart terminal and a vehicle-mounted terminal, wherein the smart terminal and the vehicle-mounted terminal establish a screen projection connection;

[0010] The smart terminal, in response to the user's touch operation on the view control, displays a function menu area, which contains areas corresponding to multiple functions; in response to the user's drag operation on the view control, it determines the target function selected by the user from multiple functions; and sends the page data of the target function to the vehicle terminal, the page data of the target function including the identifier of the target function, the movement displacement of the view control, and the movement speed of the view control.

[0011] The vehicle-mounted terminal receives page data for the target function and gradually displays the corresponding target function page based on the page data. The speed at which the vehicle-mounted terminal gradually displays the target function page is determined by the movement speed of the view control, and the proportion of the target function page gradually displayed relative to the complete target function page is determined by the movement displacement of the view control.

[0012] A third aspect of the present invention provides an electronic device. The electronic device includes a memory, a processor, and a computer program stored in the memory and executable on the processor. When executed by the processor, the computer program implements the page display method as described in the first aspect of the present invention.

[0013] A fourth aspect of this invention provides a computer-readable storage medium. This computer-readable storage medium stores a computer program, which, when executed by a processor, implements the page display method of the first aspect of this invention. Attached Figure Description

[0014] To more clearly illustrate the technical solutions of the embodiments of the present invention, the drawings used in the description of the embodiments of the present invention will be briefly introduced below. Obviously, the drawings described below are only some embodiments of the present invention. For those skilled in the art, other drawings can be obtained based on these drawings without creative effort.

[0015] Figure 1 This is a schematic diagram illustrating an application environment according to an embodiment of the present invention;

[0016] Figure 2 This is a flowchart illustrating a page display method according to an embodiment of the present invention;

[0017] Figure 3 This is a flowchart illustrating a page display method according to an embodiment of the present invention;

[0018] Figure 4 This is a flowchart illustrating a page display method according to an embodiment of the present invention;

[0019] Figure 5 This is a flowchart illustrating a page display method according to an embodiment of the present invention;

[0020] Figure 6 This is a flowchart illustrating a page display method according to an embodiment of the present invention;

[0021] Figure 7 This is a flowchart illustrating a page display method according to an embodiment of the present invention;

[0022] Figure 8 This is a flowchart illustrating a page display method according to an embodiment of the present invention;

[0023] Figure 9 This is a schematic diagram of a function menu area shown in one embodiment of the present invention;

[0024] Figure 10 This is a structural block diagram of a page display system provided in one embodiment of the present invention;

[0025] Figure 11 This is a schematic diagram of an electronic device according to an embodiment of the present invention. Detailed Implementation

[0026] The technical solutions of the embodiments of the present invention will be clearly and completely described below with reference to the accompanying drawings. Obviously, the described embodiments are only some, not all, of the embodiments of the present invention. Based on the embodiments of the present invention, all other embodiments obtained by those skilled in the art without creative effort are within the scope of protection of the present invention.

[0027] As mentioned above, in traditional in-vehicle screen mirroring solutions, the in-vehicle terminal and the smart terminal display the same page on both ends. That is, after the smart terminal sends a screen mirroring command to the in-vehicle terminal, the in-vehicle terminal directly displays the same page as the smart terminal to achieve screen mirroring. However, if only the smart terminal displays the page, and the in-vehicle terminal displays the same page as the mobile device, and both sides can perform clicks and other operations, this does not provide users with the feeling of interaction between the two ends (smart terminal and in-vehicle terminal), and lacks entertainment value.

[0028] To at least partially solve one or more of the above-mentioned problems and other potential problems, embodiments of the present invention propose a page display method. This method enables the vehicle terminal to gradually display the target function page corresponding to the user's selected target function based on the user's dragging operation after the in-vehicle terminal and the smart terminal establish a screen projection connection. This increases the practicality and enjoyment of the interaction between the smart terminal and the in-vehicle terminal, and enhances the connection and interaction between the screen projection devices (smart terminal and in-vehicle terminal).

[0029] The following sections will describe specific examples of this solution in more detail with reference to the accompanying drawings.

[0030] Figure 1 This is a schematic diagram illustrating an application environment according to an embodiment of the present invention. Figure 1 In this application environment, a vehicle 100, a smart terminal 110, and an in-vehicle terminal 120 are included. The smart terminal 110 and the in-vehicle terminal 120 are located within the vehicle 100, and a communication connection is established between them. In this embodiment, the vehicle can be any type of vehicle, the smart terminal can be any device capable of intelligent communication with other devices, and the in-vehicle terminal can include, but is not limited to, a vehicle infotainment system. A vehicle infotainment system is a shorthand for an in-vehicle infotainment product installed in a car. Functionally, the vehicle infotainment system must enable information communication between people and the vehicle, and between the vehicle and the outside world (vehicle-to-vehicle communication). Furthermore, it should be noted that... Figure 1 This is just one example provided in this embodiment. This embodiment does not impose any restrictions on the specific types of the smart terminal 110 and the vehicle terminal 120. When the smart terminal 110 communicates with the vehicle terminal 120, the smart terminal 110 can also be located outside the vehicle 100. This embodiment does not impose any restrictions on this either.

[0031] refer to Figure 2, Figure 2 This is a flowchart illustrating a page display method according to an embodiment of the present invention. This method is applied to a smart terminal, which in this embodiment can be a mobile phone, computer, tablet, smartwatch, or any other device capable of intelligent communication with other devices. Figure 2 As shown, the page display method in this embodiment may include the following steps:

[0032] Step S11: Establish a screen mirroring connection.

[0033] In this embodiment, a communication connection needs to be established between the smart terminal and the vehicle-mounted terminal (e.g., a vehicle infotainment system). This connection can be established via Bluetooth, Wi-Fi, or USB. Alternatively, the smart terminal may initiate a communication request to the vehicle-mounted terminal, and the vehicle-mounted terminal may agree to establish the connection. This embodiment does not impose any specific limitations on either approach.

[0034] After establishing a communication connection, the smart terminal can send a screen mirroring request to the vehicle terminal to request the establishment of a screen mirroring connection. Once the vehicle terminal receives and agrees to the screen mirroring request, the screen mirroring connection between the smart terminal and the vehicle terminal is successfully established. When a screen mirroring connection is established between the smart terminal and the vehicle terminal, the smart terminal displays view controls. This can be achieved by the smart terminal displaying a new screen mirroring function page on top of the existing display page, which includes view controls; or by the smart terminal directly displaying view controls on the existing display page. This embodiment does not impose specific limitations on this. Furthermore, the view controls in this embodiment refer to controls that support screen mirroring functionality. These can be general function controls that support screen mirroring when a connection is established; or they can be dedicated screen mirroring controls used for screen mirroring selection operations. This embodiment does not impose specific limitations on this either.

[0035] Step S12: In response to the user's touch operation on the view control, display the function menu area, wherein the function menu area contains multiple areas corresponding to functions.

[0036] In this embodiment, the user can perform touch operations on the view controls displayed on the smart terminal, such as long press, single click, double click, etc. The smart terminal responds to the user's touch operation on the view control by displaying a function menu area. In this embodiment, the function menu area contains multiple areas corresponding to different functions; that is, the function menu area contains multiple areas, each corresponding to a function. The functions in this embodiment include, but are not limited to: navigation, radio, listening to music, checking the weather, controlling in-vehicle devices, viewing memos, etc. The function menu area can be displayed with a floating effect or a normal display without a floating effect.

[0037] Step S13: In response to the user's drag operation on the view control, determine the target function selected by the user from the plurality of functions.

[0038] In this embodiment, the user can select functions based on the view controls and function menu area displayed on the smart terminal. The user drags the view control to the function area corresponding to the function they want to select. The smart terminal responds to the user's drag operation on the view control and determines the target function selected by the user from the multiple functions included in the function menu area. The target function indicates that the user wants to display the function page corresponding to that function on the in-vehicle terminal to realize the screen projection operation of that function.

[0039] Step S14: Send the page data of the target function to the vehicle terminal so that the vehicle terminal can gradually display the target function page corresponding to the target function; the page data of the target function includes the identifier of the target function, the movement displacement of the view control, and the movement speed of the view control; the speed at which the vehicle terminal gradually displays the target function page is determined according to the movement speed of the view control, and the proportion of the target function page gradually displayed by the vehicle terminal to the complete target function page is determined according to the movement displacement of the view control.

[0040] In this embodiment, after the smart terminal determines the target function selected by the user, it sends the page data of the target function to the vehicle terminal. The page data of the target function includes at least: the identifier of the target function, the movement displacement of the view control, and the movement speed of the view control. In this embodiment, the smart terminal can determine the target function identifier corresponding to the target function. Responding to the user's dragging of the view control, the smart terminal acquires the movement displacement and movement speed of the view control in real time, and then sends the target function identifier, movement displacement, and movement speed of the view control to the vehicle terminal. After receiving the target function identifier, movement displacement, and movement speed of the view control, the vehicle terminal can obtain the target function display page data corresponding to the target function based on the target function identifier of the view control. This target function display page data is used to display the target function page.

[0041] The vehicle-mounted terminal can obtain the target function display page data corresponding to the target function identifier from the local (vehicle-mounted terminal) based on the target function identifier, or it can directly obtain the target function display page data corresponding to the target function identifier from the smart terminal. The local (vehicle-mounted terminal) pre-stores mapping relationships between function identifiers and their corresponding function display page data for multiple functions, as well as multiple function display page data. The vehicle-mounted terminal can find the mapping relationship in the local (vehicle-mounted terminal) based on the target function identifier, and then find the target function display page data corresponding to the target function identifier based on the mapping relationship.

[0042] In a preferred embodiment, the page data for the target function further includes target function display page data. The smart terminal sends the page data for the target function to the vehicle terminal, which can directly obtain the target function display page data included in the page data for the target function, and thus display the page according to the target function display page data. This preferred embodiment can be applied to any vehicle terminal with display function, without being limited by vehicle model.

[0043] After receiving the target function display page data, the vehicle terminal gradually displays the target function page based on the movement displacement and speed of the received view controls. This can be understood as the vehicle terminal generating the target function page based on the target function display page data but not displaying it directly. Instead, it gradually moves the target function page based on the movement displacement and speed of the view controls when dragged by the user, resulting in the vehicle terminal displaying the target function page step by step.

[0044] The speed at which the in-vehicle terminal gradually displays the target function page is determined based on the movement speed of the view control. The proportion of the target function page gradually displayed relative to the complete target function page is determined based on the movement displacement of the view control. In a preferred embodiment, the in-vehicle terminal gradually moves the target function page using animation, such as fade-in, fly-in, or bounce animations. This enhances the entertainment value of the in-vehicle terminal page display, combining animation effects with the gradual page display to increase the fun of the interactive design, thereby further strengthening the connection and interaction between the two ends.

[0045] In this embodiment, the user drags the view control on the smart terminal, and the vehicle terminal gradually displays the target function page corresponding to the target function selected by the user according to the user's drag operation, bringing different screen projection experience to the user (the user only needs to operate on the smart terminal, and the smart terminal and the vehicle terminal simultaneously show different response results to the operation), thereby increasing the practicality and fun of the interaction between the smart terminal and the vehicle terminal, and bringing the connection and interaction between the screen projection devices (smart terminal and vehicle terminal) to the user.

[0046] In conjunction with the above embodiments, in one implementation, the present invention also provides a page display method, such as... Figure 3 As shown. Figure 3 This is a flowchart illustrating a page display method according to an embodiment of the present invention. Specifically, in this method, each function in the function menu area includes a selected area, step S13 includes step S21, and step S14 includes step S22:

[0047] Step S21: In response to the view control being dragged to the selected area of ​​the target function, the selection result is displayed.

[0048] In this embodiment, each function in the function menu area includes a selection area. Only when a view control is dragged to the selection area within a function area does it mean the user has successfully selected that function. In other words, each function area within the function menu area is divided into a selection area and a candidate area. When a control is dragged to a candidate area (i.e., not yet to the selection area), it means the user is still hesitating. Only when a control is dragged to the selection area within a function area does it mean the user has confirmed the selection of the target function. At this point, the smart terminal displays the selection result. For example, if the user selects the target function "Open Music," the smart terminal displays a completion status of "Completed Open Music."

[0049] Step S22: The page data of the target function also includes an operation completion instruction. The operation completion instruction is sent to the vehicle terminal so that the vehicle terminal displays the target function page according to the operation completion instruction. The operation completion instruction indicates that the user has selected the target function.

[0050] In this embodiment, in response to the view control being dragged to the selected area of ​​the target function, the smart terminal also sends an operation completion command to the vehicle terminal. The operation completion command indicates that the user has selected the target function, and the vehicle terminal directly displays the complete target function page based on the received operation completion command. In other words, when the user selects a target function on the smart terminal, the vehicle terminal directly displays the complete target function page corresponding to that target function.

[0051] In a preferred embodiment, during the dragging process before the view control is selected by the user, the speed at which the vehicle terminal gradually displays the target function page is determined based on the movement speed of the view control, and the proportion of the target function page gradually displayed by the vehicle terminal relative to the complete target function page is determined based on the movement displacement of the view control.

[0052] For example, if a user drags a view control a distance of a first length, the smart terminal receives the first length as the displacement of the view control. The proportion of the area of ​​the target function page gradually displayed (moved) by the in-vehicle terminal to the area of ​​the complete target function page is the ratio of the first length to the effective total distance the view control can move. The effective total distance is the straight-line distance between the initial position of the view control and the nearest boundary of the selected area from the initial area of ​​the view control. For instance, if the user drags the control halfway to the nearest boundary of the selected area, only half of the target function page will be displayed on the in-vehicle terminal. During the dragging process, the in-vehicle terminal displays (i.e., moves) the target function page in real time based on the real-time displacement and speed of the control.

[0053] In this embodiment, when the view control is dragged to the selected area, the vehicle terminal displays the complete target function page, while the smart terminal displays the selection result of the target function. The two terminals display different pages, thus breaking the tradition of vehicle screen projection methods, bringing users a different operating experience, and enhancing the interaction and entertainment between screen projection devices.

[0054] In conjunction with the above embodiments, in another implementation, the present invention also provides a page display method, such as... Figure 4 As shown. Figure 4 This is a flowchart illustrating a page display method according to an embodiment of the present invention. Specifically, in this method, step S13 includes step S31, and step S14 includes step S32:

[0055] Step S31: In response to the view control not being dragged into the selected area of ​​the target function, the view control returns directly to its initial position.

[0056] In this embodiment, when a user wants to cancel the screen mirroring operation or wants to select another function as the target function, they can release the control while dragging the view control. The view control will return directly to its initial position, which means that the user has canceled the screen mirroring operation.

[0057] Step S32: The page data of the target function also includes an operation cancellation instruction. The operation cancellation instruction is sent to the vehicle terminal so that the vehicle terminal can restore the target function page from the initial state according to the operation cancellation instruction. The operation cancellation instruction indicates that the user has given up selecting the target function.

[0058] When the smart terminal responds to the fact that the view control has not been dragged into the selected area of ​​the target function and the view control returns directly to its initial position, it sends an operation cancellation command to the vehicle terminal indicating that the user has given up selecting the target function. Based on the received operation cancellation command, the vehicle terminal restores itself from the target function page to the initial state of the vehicle terminal.

[0059] The initial state of the vehicle terminal refers to the page display state before the view control was dragged. This can be understood as follows: when the user deselects the target function, and the view control directly returns to its initial state, the vehicle terminal directly hides the previously displayed target function page (the part of the target function page that was previously displayed) and returns to the initial state before the view control was dragged.

[0060] In this embodiment, when the view control is released and returns directly to its initial position, the vehicle terminal restores from the target function page when the control was dragged to the initial state of the vehicle terminal before the view control was dragged. This allows the user to easily and cleanly cancel the screen projection operation, and both ends are restored to their initial states for the user to select later.

[0061] In conjunction with the above embodiments, in one implementation, the present invention also provides a page display method, such as... Figure 5 As shown. Figure 5 This is a flowchart illustrating a page display method according to an embodiment of the present invention. Specifically, in this method, step S13 includes step S41, and step S14 includes step S42:

[0062] Step S41: In response to the view control not being dragged into the selected area of ​​the target function, and the movement direction of the view control changing in the opposite direction.

[0063] In this embodiment, when a user wants to cancel the screen mirroring operation or wants to select another function as the target function, the user can also drag the view control in the opposite direction during the dragging process. That is, when the smart terminal responds to the view control being dragged towards the selected area of ​​the target function, but not yet dragged into the selected area of ​​the target function, and the movement direction of the view control changes in the opposite direction, it means that the user has canceled the screen mirroring operation. Here, "reverse change" means that the current dragging direction of the view control is opposite to the direction in which the view control is dragged towards the selected area.

[0064] Step S42: The page data of the target function also includes an operation cancellation instruction. The operation cancellation instruction is sent to the vehicle terminal so that the vehicle terminal can restore the target function page from its initial state, or so that the vehicle terminal can reverse its movement from moving the target function page to moving the target function page in the opposite direction. The operation cancellation instruction indicates that the user has abandoned the selection of the target function.

[0065] In this embodiment, in response to the reverse movement of the view control, the smart terminal sends an operation cancellation command to the vehicle terminal, indicating that the user has given up selecting the target function. According to the received operation cancellation command, the vehicle terminal restores itself from the target function page to the initial state of the vehicle terminal, or changes from the target function page to the reverse target function page.

[0066] The reversal of the movement direction of the view control can be caused by the view control returning to its initial position at a pre-set movement speed after the user releases the view control, or by the user actively dragging the view control back to cause the reversal. This embodiment does not impose specific restrictions on this.

[0067] The initial state of the vehicle terminal is the same as in the previous embodiment, which is the page display state of the vehicle terminal before the view control is dragged. This can be understood as follows: when the user deselects the target function, and the view control is dragged in the opposite direction (meaning the view control moves towards its initial position), the vehicle terminal can directly hide the previously displayed target function page (the part of the target function page that was already displayed), returning to the initial state of the vehicle terminal before the view control was dragged; alternatively, it can move the displayed target function page (the part of the target function page that was already displayed) in the opposite direction until the displayed target function page (the part of the target function page that was already displayed) is completely hidden.

[0068] In a preferred embodiment, the vehicle terminal can move the target function page in reverse in the form of animation, such as fading out, flying out of the boundary, bouncing, etc., to enhance the interaction and entertainment between the two ends, increase the fun of the interaction design, and bring a better experience to the user.

[0069] In this embodiment, when the view control moves in the opposite direction while moving towards the selected area, the vehicle terminal can restore the target function page from when the control was dragged to the initial state of the vehicle terminal before the view control was dragged, or it can display the target function page after the reverse movement. The vehicle terminal can provide users with a variety of screen casting cancellation interaction experiences, further enhancing the user's operating experience at both ends during screen casting.

[0070] In conjunction with the above embodiments, in another implementation, the present invention also provides a page display method, such as... Figure 6 As shown. Figure 6 This is a flowchart illustrating a page display method according to an embodiment of the present invention. In this method, the page data for the target function further includes the reverse movement displacement and reverse movement speed of the view control. Specifically, in this method, step S42 includes step S51:

[0071] Step S51: Send the reverse movement displacement and reverse movement speed of the view control to the vehicle terminal, so that the vehicle terminal can gradually reverse the target function page according to the reverse movement displacement and the reverse movement speed; wherein, the speed at which the vehicle terminal gradually reverses the target function page is determined according to the reverse movement speed, and the proportion of the target function page gradually reversed by the vehicle terminal to the complete target function page is determined according to the reverse movement displacement.

[0072] In this embodiment, when the smart terminal responds to the view control not being dragged into the selected area of ​​the target function and the movement direction of the view control changes in the opposite direction, the smart terminal obtains the reverse movement displacement and reverse movement speed of the view control and sends them to the vehicle terminal. After receiving the reverse movement displacement and reverse movement speed of the view control, the vehicle terminal gradually moves the displayed target function page (the part of the target function page that has already been displayed) in the reverse direction according to the reverse movement displacement and reverse movement speed.

[0073] The speed at which the vehicle terminal gradually moves the target function page in the reverse direction is determined based on the reverse movement speed, and the proportion of the target function page that the vehicle terminal gradually moves in the reverse direction to the complete target function page is determined by the reverse movement displacement.

[0074] For example, the reverse movement of the in-vehicle terminal is similar to the forward movement in the aforementioned embodiment. The user drags the view control and moves it backward by a distance of a second length. The smart terminal obtains the reverse movement displacement of the view control as the second length. The ratio of the area of ​​the displayed target function page that the in-vehicle terminal gradually hides (moves backward) to the area of ​​the complete target function page is the ratio of the second length to the distance of the current view control from its initial position. During the reverse dragging of the control, the in-vehicle terminal hides (i.e., reverses) the displayed target function page in real time based on the real-time reverse movement displacement and real-time reverse movement speed of the control.

[0075] In a preferred embodiment, when the control is manually dragged backward by the user, since the user may drag the view control forward again in the next moment (i.e., drag it toward the selected area), the vehicle terminal will not return to the initial state of the vehicle terminal. Instead, it will only gradually move the displayed target function page (the part of the target function page that has been displayed) backward according to the backward movement displacement and backward movement speed. This is so that if the user drags the control forward in the future, the vehicle terminal can achieve the effect of seamless connection between moving the target function page forward and backward.

[0076] In this embodiment, the vehicle terminal can achieve the effect of real-time reverse movement of the displayed target function page based on the reverse movement speed and reverse movement displacement of the view control, thereby bringing different screen projection experiences to users (users only need to operate on the smart terminal, and the smart terminal and the vehicle terminal simultaneously display different response results to the operation), increasing the practicality and fun of the interaction between the smart terminal and the vehicle terminal, and bringing users the connection and interaction between the screen projection devices (smart terminal and vehicle terminal).

[0077] In conjunction with the above embodiments, in another implementation, the present invention also provides a page display method, such as... Figure 7 As shown. Figure 7 This is a flowchart illustrating a page display method according to an embodiment of the present invention. Specifically, in this method, step S61 is included after step S12:

[0078] Step S61: In response to the user's touch operation on the view control, an animation effect triggering command is sent to the vehicle terminal. The animation effect triggering command is used to instruct the vehicle terminal to initialize the animation effect, wherein the animation effect is a dynamic display effect carried when moving the target function page.

[0079] In this embodiment, in response to the user's touch operation on the view control (such as a long press operation), the smart terminal will also send an animation effect trigger command to the vehicle terminal so that the vehicle terminal can initialize the animation effect according to the animation effect trigger command. The animation effect is a dynamic display effect carried by the vehicle terminal when moving the target function page (such as jumping, fade-in and fade-out, side fly-in, etc.).

[0080] In this embodiment, the vehicle terminal initializes the animation effect according to the animation effect trigger command sent by the smart terminal, and switches the state of the vehicle terminal to prepare for the vehicle terminal to move the target function page in real time and in reverse.

[0081] In conjunction with the above embodiments, in another implementation, the present invention also provides a page display method, such as... Figure 8 As shown. Figure 8 This is a flowchart illustrating a page display method according to an embodiment of the present invention. In this method, the angle ranges corresponding to the multiple function-corresponding areas are different, and the angle ranges corresponding to the multiple function-corresponding areas include: the angle range of the directions of the multiple function-corresponding areas in the function menu area relative to the initial position of the view control; specifically, in this method, step S13 includes: steps S71 and S72:

[0082] Step S71: In response to the user dragging the view control, determine the angle to which the dragging direction of the view control belongs.

[0083] In this embodiment, within the multiple function-corresponding areas of the function menu area, the angular range of each function-corresponding area relative to the initial position of the view control is different; that is, different function areas correspond to different angular ranges and do not overlap. For example, as... Figure 9 As shown, Figure 9 This is a schematic diagram illustrating a function menu area according to an embodiment of the present invention. Figure 9In the example, the angular range corresponding to the "Open Music" function area is: north-northeast (0 to 90 degrees east of north) centered on the initial position of the view control; the angular range corresponding to the "Navigation" function area is: east-southeast (0 to 90 degrees south of east) centered on the initial position of the view control; the angular range corresponding to the "Open Air Conditioner" function area is: south-west (0 to 90 degrees west of south) centered on the initial position of the view control; and the angular range corresponding to the "Weather Forecast" function area is: west-northwest (0 to 90 degrees north of west) centered on the initial position of the view control. It should be noted that the above is only an example, and this embodiment does not impose any restrictions on the shape of the function menu area, the shape of the view control, the shape of the selected area in each function area, the specific angular range corresponding to each function area, or the position of the initial position of the view control relative to the function menu area.

[0084] When a user drags a view control, the view control changes its position. The direction of the dragged view control relative to its initial position is the drag direction. In response to the user's dragging, the smart terminal can determine the drag direction. For example, the smart terminal might determine the drag direction to be at an angle of 30 degrees east of north.

[0085] Step S72: Compare the angle of the dragging direction of the view control with the angle range corresponding to the area of ​​the multiple functions, and determine the target function selected by the user from the multiple functions.

[0086] In this embodiment, after the smart terminal determines the angle range corresponding to the area of ​​each function and the drag direction of the view control, it compares the angle of the drag direction of the view control with the angle range corresponding to the areas of multiple functions. For example, it determines which function's area the angle of the drag direction of the view control falls within, thereby determining the target function selected by the user from multiple functions. For example, the smart terminal determines that the angle of the drag direction of the view control is 30 degrees east of north. The east-north direction (0 to 90 degrees east of north) is the angle range corresponding to the "turn on the air conditioner" function area. Since 30 degrees east of north falls within the east-north direction (0 to 90 degrees east of north), the smart terminal can determine that the target function selected by the user is the "turn on the air conditioner" function.

[0087] In this embodiment, the smart terminal can determine the target function selected by the user based on the angle range, thereby enabling it to quickly and accurately identify the user's selection automatically, preparing for the subsequent vehicle terminal to move the target function page in real time based on the movement operation of the view control.

[0088] It should be noted that, for the sake of simplicity, the method embodiments are all described as a series of actions. However, those skilled in the art should understand that the embodiments of the present invention are not limited to the described order of actions, because according to the embodiments of the present invention, some steps can be performed in other orders or simultaneously. Furthermore, those skilled in the art should also understand that the embodiments described in the specification are preferred embodiments, and the actions involved are not necessarily essential to the embodiments of the present invention.

[0089] Based on the same inventive concept, one embodiment of the present invention provides a page display system 200. (See reference...) Figure 10 , Figure 10 This is a structural block diagram of a page display system provided in an embodiment of the present invention. For example... Figure 10 As shown, the system 200 includes a smart terminal 201 and a vehicle terminal 202, wherein the smart terminal 201 and the vehicle terminal 202 establish a screen projection connection;

[0090] The smart terminal 201, in response to a user's touch operation on a view control, displays a function menu area, wherein the function menu area includes areas corresponding to multiple functions; in response to a user's drag operation on the view control, it determines the target function selected by the user from the multiple functions; and sends the page data of the target function to the vehicle terminal, wherein the page data of the target function includes the identifier of the target function, the movement displacement of the view control, and the movement speed of the view control.

[0091] The vehicle terminal 202 receives the page data of the target function and gradually displays the target function page corresponding to the target function according to the page data of the target function; the speed at which the vehicle terminal gradually displays the target function page is determined according to the movement speed of the view control, and the proportion of the target function page gradually displayed by the vehicle terminal to the complete target function page is determined according to the movement displacement of the view control.

[0092] Based on the same inventive concept, another embodiment of the present invention provides an electronic device 300. Figure 11 This is a schematic diagram of an electronic device according to an embodiment of the present invention. Figure 11 The electronic device shown is merely an example and should not be construed as limiting the functionality or scope of the embodiments of the present invention. Figure 11 As shown, the electronic device 300 is manifested in the form of a general-purpose computing device, and its components may include, but are not limited to: one or more processors or processing units 16, system memory 28, and bus 18 connecting different system components (including system memory 28 and processing unit 16).

[0093] Bus 18 represents one or more of several bus architectures, including a memory bus or memory controller, a peripheral bus, a graphics acceleration port, a processor, or a local bus using any of the various bus architectures. For example, these architectures include, but are not limited to, the Industry Standard Architecture (ISA) bus, the Micro Channel Architecture (MAC) bus, the Enhanced ISA bus, the Video Electronics Standards Association (VESA) local bus, and the Peripheral Component Interconnect (PCI) bus.

[0094] The electronic device 300 typically includes a variety of computer system readable media. These media can be any available media that can be accessed by the electronic device 300, including volatile and non-volatile media, removable and non-removable media.

[0095] System memory 28 may include computer system readable media in the form of volatile memory, such as random access memory (RAM) 30 and / or cache memory 32. Electronic device 300 may further include other removable / non-removable, volatile / non-volatile computer system storage media. By way of example only, storage system 34 may be used to read and write non-removable, non-volatile magnetic media (…). Figure 11 Not shown; usually referred to as a "hard drive"). Although Figure 11 Not shown, a disk drive for reading and writing to a removable non-volatile disk (e.g., a "floppy disk") and an optical disk drive for reading and writing to a removable non-volatile optical disk (e.g., a CD-ROM, DVD-ROM, or other optical media) may be provided. In these cases, each drive may be connected to bus 18 via one or more data media interfaces. Memory 28 may include at least one program product having a set (e.g., at least one) of program modules configured to perform the functions of the embodiments of the present invention.

[0096] A program / utility 40 having a set (at least one) of program modules 42 may be stored, for example, in memory 28. Such program modules 42 include—but are not limited to—an operating system, one or more application programs, other program modules, and program data. Each or some combination of these examples may include an implementation of a network environment. Program modules 42 typically perform the page display methods and / or functions described in any of the above embodiments of the present invention.

[0097] Electronic device 300 can also communicate with one or more external devices 14 (e.g., keyboard, speakers, display 24, etc.), and with one or more devices that enable a user to interact with the electronic device 300, and / or with any device that enables the electronic device 300 to communicate with one or more other computing devices (e.g., network card, modem, etc.). This communication can be performed through input / output (I / O) interface 22. Furthermore, electronic device 300 can also communicate with one or more networks (e.g., local area network (LAN), wide area network (WAN), and / or public networks, such as the Internet) via network adapter 20. Figure 11 As shown, network adapter 20 communicates with other modules of electronic device 300 via bus 18. It should be understood that, although not shown in the figure, other hardware and / or software modules may be used in conjunction with electronic device 300, including but not limited to: microcode, device drivers, redundant processing units, external disk drive arrays, RAID systems, tape drives, and data backup storage systems.

[0098] Based on the same inventive concept, another embodiment of the present invention provides a computer-readable storage medium storing a computer program, which, when executed by a processor, implements the page display method described in any of the above embodiments of the present invention.

[0099] The various embodiments in this specification are described in a progressive manner, with each embodiment focusing on the differences from other embodiments. The same or similar parts between the various embodiments can be referred to each other.

[0100] Those skilled in the art will understand that embodiments of the present invention can be provided as methods, systems, or computer program products. Therefore, embodiments of the present invention can take the form of entirely hardware embodiments, entirely software embodiments, or embodiments combining software and hardware aspects. Furthermore, embodiments of the present invention can take the form of computer program products implemented on one or more computer-usable storage media (including but not limited to disk storage, CD-ROM, optical storage, etc.) containing computer-usable program code.

[0101] This invention is described with reference to flowchart illustrations and / or block diagrams of methods, terminal devices (systems), and computer program products according to embodiments of the invention. It will be understood that each block of the flowchart illustrations and / or block diagrams, and combinations of blocks in the flowchart illustrations and / or block diagrams, can be implemented by computer program instructions. These computer program instructions can be provided to a processor of a general-purpose computer, special-purpose computer, embedded processor, or other programmable data processing terminal device to produce a machine, such that the instructions, which execute via the processor of the computer or other programmable data processing terminal device, generate instructions for implementing the flowchart illustrations and / or block diagrams. Figure 1 One or more processes and / or boxes Figure 1 A device that provides the functions specified in one or more boxes.

[0102] These computer program instructions may also be stored in a computer-readable storage medium that can direct a computer or other programmable data processing terminal device to operate in a particular manner, such that the instructions stored in the computer-readable storage medium produce an article of manufacture including instruction means, which are implemented in a process Figure 1 One or more processes and / or boxes Figure 1 The function specified in one or more boxes.

[0103] These computer program instructions can also be loaded onto a computer or other programmable data processing terminal equipment, causing a series of operational steps to be performed on the computer or other programmable terminal equipment to produce a computer-implemented process, thereby providing instructions that execute on the computer or other programmable terminal equipment for implementing the process. Figure 1 One or more processes and / or boxes Figure 1 The steps of the function specified in one or more boxes.

[0104] Although preferred embodiments of the present invention have been described, those skilled in the art, upon learning the basic inventive concept, can make other changes and modifications to these embodiments. Therefore, the appended claims are intended to be interpreted as including the preferred embodiments as well as all changes and modifications falling within the scope of the embodiments of the present invention.

[0105] Finally, it should be noted that in this document, relational terms such as "first" and "second" are used only to distinguish one entity or operation from another, and do not necessarily require or imply any such actual relationship or order between these entities or operations. Furthermore, the terms "comprising," "including," or any other variations thereof are intended to cover non-exclusive inclusion, such that a process, method, article, or terminal device that comprises a list of elements includes not only those elements but also other elements not expressly listed, or elements inherent to such a process, method, article, or terminal device. Without further limitations, an element defined by the phrase "comprising one..." does not exclude the presence of other identical elements in the process, method, article, or terminal device that includes said element.

[0106] The present invention has provided a detailed description of a page display method, system, electronic device, and computer-readable storage medium. Specific examples have been used to illustrate the principles and implementation methods of the present invention. The descriptions of the above embodiments are only for the purpose of helping to understand the method and core ideas of the present invention. At the same time, those skilled in the art will recognize that, based on the ideas of the present invention, there will be changes in the specific implementation methods and application scope. Therefore, the content of this specification should not be construed as a limitation of the present invention.

Claims

1. A page display method, comprising the following steps: Establish a screen mirroring connection; The smart terminal responds to the user's touch operation on the view control of the smart terminal and displays a function menu area, wherein the function menu area contains multiple areas corresponding to functions; The smart terminal responds to the user's drag operation on the view control of the smart terminal, and determines the target function selected by the user from the multiple functions; during the drag operation, the movement displacement and movement speed of the view control of the smart terminal are acquired in real time. The smart terminal sends the page data of the target function to the vehicle terminal so that the vehicle terminal can gradually display the target function page corresponding to the target function; the page data of the target function includes the identifier of the target function, the movement displacement of the view control of the smart terminal, and the movement speed of the view control of the smart terminal. The speed at which the vehicle-mounted terminal gradually displays the target function page is determined based on the movement speed of the view control of the smart terminal, and the proportion of the target function page gradually displayed by the vehicle-mounted terminal relative to the complete target function page is determined based on the movement displacement of the view control of the smart terminal.

2. The method according to claim 1, wherein each function in the function menu area includes a selected area; The process of determining the target function selected by the user from the plurality of functions in response to the user's drag operation on the view control includes the following steps: In response to the view control being dragged into the selected area of ​​the target function, the selection result is displayed; The page data for the target function also includes an operation completion instruction. Sending the page data for the target function to the in-vehicle terminal so that the in-vehicle terminal gradually displays the target function page corresponding to the target function includes the following steps: The operation completion instruction is sent to the vehicle terminal so that the vehicle terminal displays the target function page according to the operation completion instruction, and the operation completion instruction indicates that the user has selected the target function.

3. The method according to claim 1, wherein determining the target function selected by the user from the plurality of functions in response to the user's drag operation on the view control comprises the following steps: In response to the view control not being dragged into the selected area of ​​the target function, the view control returns directly to its initial position; The page data for the target function also includes an operation cancellation command. Sending the page data for the target function to the in-vehicle terminal so that the in-vehicle terminal gradually displays the target function page corresponding to the target function includes the following steps: The operation cancellation command is sent to the vehicle terminal so that the vehicle terminal can restore the target function page from the initial state according to the operation cancellation command. The operation cancellation command indicates that the user has given up selecting the target function.

4. The method according to claim 1, wherein determining the target function selected by the user from the plurality of functions in response to the user's drag operation on the view control comprises the following steps: In response to the view control not being dragged into the selected area of ​​the target function, and the movement direction of the view control changing in the opposite direction; The page data for the target function also includes an operation cancellation command. Sending the page data for the target function to the in-vehicle terminal so that the in-vehicle terminal gradually displays the target function page corresponding to the target function includes the following steps: The operation cancellation command is sent to the vehicle terminal so that the vehicle terminal returns to its initial state from moving the target function page, or so that the vehicle terminal changes from moving the target function page to moving the target function page in reverse, wherein the operation cancellation command indicates that the user abandons the selection of the target function.

5. The method according to claim 4, wherein the page data of the target function further includes the reverse movement displacement and reverse movement speed of the view control, and the step of sending the operation cancellation command to the vehicle terminal so that the vehicle terminal changes from moving the target function page to moving the target function page in reverse includes the following steps: The reverse movement displacement and reverse movement speed of the view control are sent to the vehicle terminal so that the vehicle terminal can gradually reverse the target function page according to the reverse movement displacement and the reverse movement speed. The speed at which the vehicle terminal gradually moves the target function page in the reverse direction is determined based on the reverse movement speed, and the proportion of the target function page that the vehicle terminal gradually moves in the reverse direction to the complete target function page is determined based on the reverse movement displacement.

6. The method according to claim 1, further comprising the following step: In response to the user's touch operation on the view control, an animation effect triggering command is sent to the vehicle terminal. The animation effect triggering command is used to instruct the vehicle terminal to initialize the animation effect, wherein the animation effect is a dynamic display effect carried when the target function page is moved.

7. The method according to claim 1, wherein the angle ranges corresponding to the regions corresponding to the plurality of functions are different, and the angle ranges corresponding to the regions corresponding to the plurality of functions include: The angular range of the areas corresponding to multiple functions in the function menu area relative to the initial position of the view control; The process of determining the target function selected by the user from the plurality of functions in response to the user's drag operation on the view control includes the following steps: In response to the user dragging the view control, determine the angle of the dragging direction of the view control; The angle of the dragging direction of the view control is compared with the angle range corresponding to the area of ​​the multiple functions to determine the target function selected by the user from the multiple functions.

8. A page display system, the system comprising a smart terminal and a vehicle-mounted terminal, wherein the smart terminal and the vehicle-mounted terminal establish a screen projection connection; The smart terminal, in response to a user's touch operation on the view controls of the smart terminal, displays a function menu area, wherein... The function menu area includes multiple function-corresponding areas; in response to the user's drag operation on the view control of the smart terminal, the target function selected by the user is determined from the multiple functions; during the drag operation, the movement displacement and movement speed of the view control of the smart terminal are acquired in real time. The page data of the target function is sent to the vehicle terminal. The page data of the target function includes the identifier of the target function, the movement displacement of the view control of the smart terminal, and the movement speed of the view control of the smart terminal. The vehicle-mounted terminal receives page data for the target function and gradually displays the target function page corresponding to the target function based on the page data. The speed at which the vehicle-mounted terminal gradually displays the target function page is determined based on the movement speed of the view control of the smart terminal. The proportion of the target function page gradually displayed by the vehicle-mounted terminal relative to the complete target function page is determined based on the movement displacement of the view control of the smart terminal.

9. An electronic device comprising a memory, a processor, and a computer program stored in the memory and executable on the processor, wherein the computer program, when executed by the processor, implements the page display method as described in any one of claims 1 to 7.

10. A computer-readable storage medium storing a computer program that, when executed by a processor, implements the page display method as described in any one of claims 1 to 7.

Images