Touch event handling methods and devices, storage media, electronic devices

Abstract

This disclosure relates to a method, apparatus, storage medium, and electronic device for handling touch events, and pertains to the field of human-computer interaction technology. The method includes: receiving a screen touch event through a display panel layer of a display terminal, and transmitting the screen touch event to an event interception layer of the display terminal; determining the event occurrence location corresponding to the screen touch event through the event interception layer, and determining an event processing layer required to handle the screen touch event based on the event occurrence location; transmitting the screen touch event to the event processing layer through the event interception layer, and processing the screen touch event through the event processing layer. This method achieves matching the corresponding event processing layer based on the occurrence area of ​​the screen touch event.

Description

Technical Field

[0001] This disclosure relates to the field of human-computer interaction technology, and more specifically, to a method for processing touch events, a device for processing touch events, a computer-readable storage medium, and an electronic device. Background Technology

[0002] Existing methods cannot match the corresponding event handling layer based on the area where the screen touch event occurs.

[0003] It should be noted that the information in the background section above is only used to enhance the understanding of the background of this disclosure, and therefore may include information that does not constitute prior art known to those skilled in the art. Summary of the Invention

[0004] The purpose of this disclosure is to provide a method for processing touch events, a device for processing touch events, a computer-readable storage medium, and an electronic device, thereby overcoming, to at least a certain extent, the problem of being unable to match the corresponding event processing layer according to the area where the touch event occurs on the screen due to limitations and defects in related technologies.

[0005] According to one aspect of this disclosure, a method for processing touch events is provided, configured in a display terminal, the method comprising:

[0006] The display terminal receives screen touch events through its display panel layer and transmits the screen touch events to the event interception layer of the display terminal.

[0007] The event interception layer determines the location of the event corresponding to the screen touch event, and the event processing layer required to process the screen touch event is determined based on the location of the event.

[0008] The screen touch event is transmitted to the event processing layer through the event interception layer, and the screen touch event is processed through the event processing layer.

[0009] In one exemplary embodiment of this disclosure, determining the event processing layer required for processing the screen touch event based on the event occurrence location includes: determining a first event occurrence region in the event interception layer to which the screen touch event belongs based on the event occurrence location; wherein the first event occurrence region includes an event interception region and / or an event penetration region; when the first event occurrence region is determined to be an event interception region, the event processing layer required for processing the screen touch event is determined to be a display panel layer; when the first event occurrence region is determined to be an event penetration region, the event processing layer required for processing the screen touch event is determined to be a model rendering flow layer.

[0010] In one exemplary embodiment of this disclosure, the screen touch event is transmitted to the event processing layer through the event interception layer, and the screen touch event is processed through the event processing layer, including: returning the screen touch event to the display panel layer through the event interception layer, and interactively processing the screen touch event through the display panel layer; or penetrating the screen touch event to the model rendering stream layer through the event interception layer, and interactively processing the screen touch event through the model rendering stream layer.

[0011] In one exemplary embodiment of this disclosure, interactive processing of the screen touch event through the display panel layer includes: determining a second event occurrence area on the display panel layer to which the screen touch event belongs based on the event occurrence location; wherein the second event occurrence area includes a first panel interaction area and / or a second panel interaction area; when it is determined that the event occurrence location belongs to the first panel interaction area, interactive processing of the screen touch event is performed in the first panel interaction area; when it is determined that the event occurrence location belongs to the second panel interaction area, interactive processing of the screen touch event is performed in the second panel interaction area.

[0012] In one exemplary embodiment of this disclosure, interactive processing of the screen touch event is performed through the model rendering stream layer, including:

[0013] The model rendering stream layer obtains the 3D model to be processed corresponding to the screen touch event, and performs interactive processing on the 3D model to be processed; wherein, the interactive processing on the 3D model to be processed includes one or more of the following: dragging, scaling, clicking and switching camera view.

[0014] In one exemplary embodiment of this disclosure, after interactive processing of the screen touch event through the model rendering stream layer, the touch event processing method further includes:

[0015] The event processing results of the screen touch event are transmitted through the event interception layer to the 3D model interaction area of ​​the display panel layer via the model rendering flow layer, and the event processing results are displayed through the 3D model interaction area.

[0016] In one exemplary embodiment of this disclosure, the touch event processing method further includes:

[0017] The system receives hierarchical configuration data sent by the backend server and parses the hierarchical configuration data to obtain the first configuration information of the first panel interaction area, the second configuration information of the second panel interaction area, and the third configuration information of the three-dimensional model interaction area corresponding to the display panel layer.

[0018] Based on the screen resolution of the display terminal and the first configuration information, the second configuration information, and the third configuration information, a first panel interaction area, a second panel interaction area, and a three-dimensional model interaction area are configured in the display panel layer of the display terminal.

[0019] In one exemplary embodiment of this disclosure, based on the screen resolution of the display terminal and the first configuration information, second configuration information, and third configuration information, a first panel interaction area, a second panel interaction area, and a three-dimensional model interaction area are configured in the display panel layer of the display terminal, including:

[0020] The system acquires the first region size, first region position, and first region type included in the first configuration information, and configures a first panel interaction area in the display panel layer according to the screen resolution, first region size, and first region position of the display terminal; acquires the second region size, second region position, and second region type included in the second configuration information, and configures a second panel interaction area in the display panel layer according to the screen resolution, second region size, and second region position; and acquires the third region size, third region position, and third region type included in the third configuration information, and configures a three-dimensional model interaction area in the display panel layer according to the screen resolution, third region size, and third region position.

[0021] In one exemplary embodiment of this disclosure, the hierarchical configuration data is generated by the backend server in the following manner:

[0022] In response to a second selection operation acting on a 3D model interaction area included in a preset interaction area, a first panel interaction area and a second panel interaction area are set on a preset event control designer, and first configuration information and second configuration information are configured for the first panel interaction area and the second panel interaction area; in response to a second selection operation acting on a 3D model interaction area included in the preset interaction area, a 3D model interaction area is set on a preset event control designer, and third configuration information is configured for the 3D model interaction area; hierarchical configuration data is generated according to the first configuration information, the second configuration information, and the third configuration information; wherein, the size of the preset event control designer is consistent with the size of the display panel layer of the display terminal.

[0023] In one exemplary embodiment of this disclosure, the touch event processing method further includes:

[0024] Configure an event interception layer in the next level below the display panel layer, and set an event interception area and an event penetration area in the event interception layer; wherein, configuring the event interception layer includes: creating the event interception layer through the interface of the document object model of hypertext markup language included in the Flutter of the display terminal.

[0025] In one exemplary embodiment of this disclosure, setting an event interception area and an event penetration area in the event interception layer includes: setting an event interception area in the event interception layer according to the first panel interaction area and the second panel interaction area, and setting an event penetration area in the event interception layer according to the three-dimensional model interaction area.

[0026] In one exemplary embodiment of this disclosure, setting an event interception area in the event interception layer based on the first panel interaction area and the second panel interaction area includes: obtaining a first target position and a first target area area of ​​the first panel interaction area in the display panel layer, and a second target position and a second target area area of ​​the second panel interaction area in the display panel layer; calculating the total area of ​​the event interception area based on the first target area area and the second target area area, and setting the event interception area in the event interception layer based on the total area area and the first target position and the second target position; wherein the event interception layer has the same size as the display panel layer.

[0027] In one exemplary embodiment of this disclosure, the touch event processing method further includes:

[0028] Configure a model rendering stream layer in the next level below the event interception layer; wherein, configuring the model rendering stream layer includes: embedding a streaming media player corresponding to the 3D model in the hypertext markup language file of the Flutter in the display terminal, and generating the model rendering stream layer based on the streaming media player.

[0029] According to one aspect of this disclosure, a touch event processing apparatus is provided, configured in a display terminal, the touch event processing apparatus comprising:

[0030] The screen touch event receiving module is used to receive screen touch events through the display panel layer of the display terminal and transmit the screen touch events to the event interception layer of the display terminal;

[0031] The event location determination module is used to determine the event location corresponding to the screen touch event through the event interception layer, and to determine the event processing layer required to process the screen touch event based on the event location.

[0032] The event handling module is used to pass the screen touch event to the event handling layer through the event interception layer, and to process the screen touch event through the event handling layer.

[0033] In an exemplary embodiment of this disclosure, the event location determination module may further be configured to perform: determining a first event occurrence area in the event interception layer to which the screen touch event belongs based on the event occurrence location; wherein the first event occurrence area includes an event interception area and / or an event penetration area; when the first event occurrence area is determined to be an event interception area, determining that the event processing layer required to process the screen touch event is a display panel layer; when the first event occurrence area is determined to be an event penetration area, determining that the event processing layer required to process the screen touch event is a model rendering flow layer.

[0034] In one exemplary embodiment of this disclosure, the event handling module may also be configured to: return the screen touch event to the display panel layer through the event interception layer, and perform interactive processing on the screen touch event through the display panel layer; or pass the screen touch event through the event interception layer to the model rendering stream layer, and perform interactive processing on the screen touch event through the model rendering stream layer.

[0035] In one exemplary embodiment of this disclosure, the event handling module may further be configured to perform: determining, based on the event occurrence location, a second event occurrence area to which the screen touch event belongs on the display panel layer; wherein the second event occurrence area includes a first panel interaction area and / or a second panel interaction area; when it is determined that the event occurrence location belongs to the first panel interaction area, performing interactive processing on the screen touch event in the first panel interaction area; and when it is determined that the event occurrence location belongs to the second panel interaction area, performing interactive processing on the screen touch event in the second panel interaction area.

[0036] In one exemplary embodiment of this disclosure, the event handling module may also be configured to perform: obtaining a three-dimensional model to be processed corresponding to the screen touch event through the model rendering stream layer, and performing interactive processing on the three-dimensional model to be processed; wherein, performing interactive processing on the three-dimensional model to be processed includes one or more of the following: dragging, scaling, clicking, and camera perspective switching processing on the three-dimensional model to be processed.

[0037] In one exemplary embodiment of this disclosure, the event handling module may also be configured to perform: passing the event handling result of the screen touch event through the model rendering flow layer to the three-dimensional model interaction area of ​​the display panel layer via the event interception layer, and displaying the event handling result through the three-dimensional model interaction area.

[0038] In one exemplary embodiment of this disclosure, the touch event processing device further includes:

[0039] The hierarchical configuration data receiving module can be used to receive hierarchical configuration data sent by the backend server, and parse the hierarchical configuration data to obtain the first configuration information of the first panel interaction area, the second configuration information of the second panel interaction area, and the third configuration information of the three-dimensional model interaction area corresponding to the display panel layer.

[0040] The interactive area configuration module can be used to configure a first panel interactive area, a second panel interactive area, and a three-dimensional model interactive area in the display panel layer of the display terminal according to the screen resolution of the display terminal and the first configuration information, the second configuration information, and the third configuration information.

[0041] In an exemplary embodiment of this disclosure, the interactive area configuration module may further be configured to perform: obtaining the first area size, first area position, and first area type included in the first configuration information, and configuring a first panel interactive area in the display panel layer according to the screen resolution, first area size, and first area position of the display terminal; obtaining the second area size, second area position, and second area type included in the second configuration information, and configuring a second panel interactive area in the display panel layer according to the screen resolution, second area size, and second area position; and obtaining the third area size, third area position, and third area type included in the third configuration information, and configuring a three-dimensional model interactive area in the display panel layer according to the screen resolution, third area size, and third area position.

[0042] In an exemplary embodiment of this disclosure, the hierarchical configuration data is generated by the backend server in the following manner: in response to a second selection operation acting on a 3D model interaction area included in a preset interaction area, a first panel interaction area and a second panel interaction area are set on a preset event control designer, and first configuration information and second configuration information are configured for the first panel interaction area and the second panel interaction area; in response to a second selection operation acting on a 3D model interaction area included in the preset interaction area, a 3D model interaction area is set on a preset event control designer, and third configuration information is configured for the 3D model interaction area; hierarchical configuration data is generated according to the first configuration information, the second configuration information, and the third configuration information; wherein, the size of the preset event control designer is consistent with the size of the display panel layer of the display terminal.

[0043] In one exemplary embodiment of this disclosure, the touch event processing device further includes:

[0044] The event interception layer configuration module can be used to configure an event interception layer in the next level below the display panel layer, and to set an event interception area and an event penetration area in the event interception layer; wherein, configuring the event interception layer includes: creating the event interception layer through the interface of the Hypertext Markup Language Document Object Model included in the Flutter of the display terminal.

[0045] In one exemplary embodiment of this disclosure, the event interception layer configuration module may also be configured to perform: setting an event interception area in the event interception layer according to the first panel interaction area and the second panel interaction area, and setting an event penetration area in the event interception layer according to the three-dimensional model interaction area.

[0046] In an exemplary embodiment of this disclosure, the event interception layer configuration module may further be configured to perform: obtaining the first target position and the area of ​​the first target region of the first panel interaction region in the display panel layer, and the second target position and the area of ​​the second target region of the second panel interaction region in the display panel layer; calculating the total area of ​​the event interception region based on the first target region area and the second target region area, and setting the event interception region in the event interception layer based on the total area and the first target position and the second target position; wherein the event interception layer is the same size as the display panel layer.

[0047] In one exemplary embodiment of this disclosure, the touch event processing device further includes:

[0048] The model rendering stream layer configuration module can be used to configure the model rendering stream layer in the next level of the event interception layer; wherein, configuring the model rendering stream layer includes: embedding a streaming media player corresponding to the 3D model in the hypertext markup language file in the Flutter of the display terminal, and generating the model rendering stream layer based on the streaming media player.

[0049] According to one aspect of this disclosure, a computer-readable storage medium is provided having a computer program stored thereon, which, when executed by a processor, implements the touch event processing method described in any of the preceding claims.

[0050] According to one aspect of this disclosure, an electronic device is provided, comprising:

[0051] Processor; and

[0052] Memory for storing the executable instructions of the processor;

[0053] The processor is configured to execute the touch event processing method described above by executing the executable instructions.

[0054] This disclosure provides a method for processing touch events. On one hand, since screen touch events can be received through the display panel layer of the display terminal and transmitted to the event interception layer of the display terminal, the event interception layer determines the location of the event corresponding to the screen touch event, and determines the event processing layer required to process the screen touch event based on the location of the event. Finally, the screen touch event is transmitted to the event processing layer through the event interception layer and processed by the event processing layer. This method achieves the determination of the event processing layer required to process the screen touch event based on the location of the screen touch event, solving the problem in the prior art that it is impossible to match the corresponding event processing layer based on the location of the screen touch event, thereby improving the accuracy of the event processing results of the screen touch event. On the other hand, since screen touch events can be transmitted to the event interception layer and also to the corresponding event processing layer, this method achieves the same level of event handling for screen touch events, solving the problem in the prior art that the display panel layer of the display terminal cannot achieve event penetration.

[0055] It should be understood that the above general description and the following detailed description are exemplary and explanatory only, and are not intended to limit this disclosure. Attached Figure Description

[0056] The accompanying drawings, which are incorporated in and form part of this specification, illustrate embodiments consistent with this disclosure and, together with the description, serve to explain the principles of this disclosure. It is obvious that the drawings described below are merely some embodiments of this disclosure, and those skilled in the art can obtain other drawings based on these drawings without any inventive effort.

[0057] Figure 1 The flowchart illustrates a method for processing touch events according to an example embodiment of the present disclosure.

[0058] Figure 2 An example diagram schematically illustrates a touch event processing system according to an exemplary embodiment of the present disclosure.

[0059] Figure 3 The flowchart illustrates a method for generating hierarchical configuration data according to an example embodiment of the present disclosure.

[0060] Figure 4 The illustration shows a scenario example of configuring a specific interactive area in a backend server using an event area designer, according to an example embodiment of the present disclosure.

[0061] Figure 5 The flowchart schematically illustrates a method for configuring a display panel layer according to an exemplary embodiment of the present disclosure.

[0062] Figure 6 The illustration shows an example scenario of configuring an interactive area on a display panel layer according to an example embodiment of the present disclosure.

[0063] Figure 7 The diagram schematically illustrates an example interface diagram of an interactive area obtained according to an exemplary embodiment of the present disclosure.

[0064] Figure 8 An example diagram illustrating an event interception layer obtained according to an exemplary embodiment of the present disclosure is shown.

[0065] Figure 9 This diagram schematically illustrates the principle example of specific setup code for an event interception layer according to an exemplary embodiment of this disclosure.

[0066] Figure 10 The diagram schematically illustrates an example interface diagram of an event interception area and an event penetration area according to an exemplary embodiment of the present disclosure.

[0067] Figure 11 The diagram illustrates an example of a model rendering flow layer obtained according to an example embodiment of the present disclosure.

[0068] Figure 12A flowchart illustrating another method for handling touch events according to an example embodiment of this disclosure is shown schematically.

[0069] Figure 13 A block diagram schematically illustrates a touch event processing apparatus according to an exemplary embodiment of the present disclosure.

[0070] Figure 14 An electronic device for implementing the above-described touch event processing method is illustrated according to an example embodiment of the present disclosure. Detailed Implementation

[0071] Example embodiments will now be described more fully with reference to the accompanying drawings. However, example embodiments can be implemented in many forms and should not be construed as limited to the examples set forth herein; rather, these embodiments are provided to make this disclosure more comprehensive and complete, and to fully convey the concept of the example embodiments to those skilled in the art. The described features, structures, or characteristics can be combined in any suitable manner in one or more embodiments. In the following description, numerous specific details are provided to give a full understanding of embodiments of this disclosure. However, those skilled in the art will recognize that the technical solutions of this disclosure can be practiced with one or more of the specific details omitted, or other methods, components, apparatus, steps, etc., can be employed. In other instances, well-known technical solutions are not shown or described in detail to avoid obscuring various aspects of this disclosure.

[0072] Furthermore, the accompanying drawings are merely illustrative of this disclosure and are not necessarily drawn to scale. The same reference numerals in the drawings denote the same or similar parts, and therefore repeated descriptions of them will be omitted. Some block diagrams shown in the drawings are functional entities and do not necessarily correspond to physically or logically independent entities. These functional entities may be implemented in software, in one or more hardware modules or integrated circuits, or in different network and / or processor devices and / or microcontroller devices.

[0073] Based on this, this exemplary embodiment first provides a method for processing touch events. This method can run on a display terminal, which can be applied to various scenarios such as meetings, teaching, and business. The smart interactive flat panel has interactive functions such as touch control and is large in size (e.g., generally larger than 50 inches). At the same time, the display terminal can also be applied to scenarios such as smart cities and smart healthcare. Of course, those skilled in the art can also run the method disclosed herein on other platforms (e.g., servers, server clusters, or cloud servers) as needed. This exemplary embodiment does not impose any special limitations on this.

[0074] In some possible implementation examples, in smart city scenarios, such as when it's necessary to view traffic flow in a lane, streetlight status on a road, pedestrian traffic in a city area, or the specific condition of a building, this touch event processing method can be used. For instance, in the scenario of viewing the usage of streetlights in a lane, the first or second panel display layer on the left or right can be touched. When the first or second panel display layer receives the screen touch event, it can pass the screen touch event to the intermediate event interception layer. The event interception layer determines that the screen touch event occurred outside the event penetration area, and thus determines that the event processing layer for the screen touch event is the display panel layer. The screen touch event is then fed back to the display panel layer so that it can process the screen touch event. The specific processing result may include, but is not limited to, displaying all streetlights in the lane, turning the streetlights off or on, etc. If display is required, it can be displayed in the corresponding display area (e.g., a 3D model interaction area).

[0075] In other possible implementation examples, for instance, if a streetlight on the lane is malfunctioning, the streetlight can be touched. When the display panel layer receives the touch event, it can pass the touch event to the intermediate event interception layer. The event interception layer determines that the touch event occurred in the event penetration area, and then determines that the event processing layer for the touch event is the model rendering flow layer. The touch event is then forwarded to the model rendering flow layer, thereby enabling the streetlight to be zoomed in or rotated, etc. The specific operation can be determined according to the specific input method of the received touch event. This example does not impose any special restrictions on this.

[0076] Further reference Figure 1 As shown, the method for handling this touch event may include the following steps:

[0077] Step S110. Receive screen touch events through the display panel layer of the display terminal, and transmit the screen touch events to the event interception layer of the display terminal;

[0078] Step S120. Determine the location of the event corresponding to the screen touch event through the event interception layer, and determine the event processing layer required to process the screen touch event based on the location of the event.

[0079] Step S130. The screen touch event is transmitted to the event processing layer through the event interception layer, and the screen touch event is processed through the event processing layer.

[0080] In the aforementioned method for handling touch events, on the one hand, since screen touch events can be received through the display panel layer of the display terminal and transmitted to the event interception layer of the display terminal, the event interception layer determines the location of the event corresponding to the screen touch event, and determines the event processing layer required to handle the screen touch event based on the location of the event, and finally transmits the screen touch event to the event processing layer through the event interception layer, and processes the screen touch event through the event processing layer, the method achieves the determination of the event processing layer required to handle the screen touch event based on the location of the screen touch event, solving the problem in the prior art that it is impossible to match the corresponding event processing layer based on the location of the screen touch event, thereby improving the accuracy of the event processing results of the screen touch event. On the other hand, since screen touch events can be transmitted to the event interception layer and also to the corresponding event processing layer, the method achieves the same level of event handling for screen touch events, solving the problem in the prior art that the display panel layer of the display terminal cannot achieve event penetration.

[0081] Furthermore, based on the above-described content, it can be understood that when the touch event processing method described in the example embodiments of this disclosure is applied in a smart city scenario, on the one hand, it will improve the efficiency of event processing; on the other hand, if it is necessary to process the model object corresponding to the screen touch event through the model rendering flow layer, the model object can be accurately located, thereby improving the analysis of the reasons for abnormal lighting of streetlights, or the analysis of reasons such as excessive pedestrian traffic or excessive vehicle traffic, thereby achieving the purpose of smart city management.

[0082] The following will provide a detailed explanation and description of the touch event processing method of the exemplary embodiments of this disclosure, in conjunction with the accompanying drawings.

[0083] First, the terms used in the example embodiments of this disclosure will be explained and described.

[0084] Flutter: Flutter is a cross-platform technology that allows Flutter programs to be converted into web applications. The conversion to web applications can be further divided into HTML (HyperText Markup Language) rendering mode and CanvasKit rendering mode. The HTML mode is closer to traditional web development technologies, while the CanvasKit mode includes a custom rendering engine (CanvasKit) that runs on the web. This engine offers better rendering performance, but differs significantly from traditional web technologies.

[0085] It's worth noting that Flutter development is often accompanied by hybrid technology development, such as Flutter mixed with Android development, or mixed with native iOS, or mixed with Web technologies. In hybrid Web technologies, one scenario is the interaction between the Flutter Web layer and the accessed 3D model. For example, the Flutter Web layer is generally used for data display and control, while the 3D model is usually implemented by accessing a 3D model streaming media.

[0086] CanvasKit: CanvasKit is a runtime mode for web applications compiled under the Flutter For Web platform. It features high performance but relatively large resource files. In practical applications, CanvasKit is a web platform graphics drawing interface compiled with WASM (Web Assembly). Its goal is to export Skia's graphics API (Application Program Interface) to the web platform.

[0087] Secondly, the application scenarios and inventive objectives of the exemplary embodiments of this disclosure will be explained and described. Specifically, the touch event processing method described in the exemplary embodiments of this disclosure can be implemented based on Flutter Web; wherein, in the CanvasKit rendering mode of Flutter Web, a custom area event penetration and control system is set up. Further, in the application scenario of interaction between Flutter Web programs and 3D models, in the CanvasKit rendering mode, it is necessary to control and process events in various areas. For example, some areas control events of the 3D model and require event penetration; some areas require event control of the panel layer. Based on this, the exemplary embodiments of this disclosure provide a touch event processing method that, through event area control and remote configuration, enables real-time event control of custom areas, including event penetration, event interception, event validity control (event processing), etc.

[0088] It should be further explained here that, regarding the event propagation technology of Flutter Web, Flutter Web can operate in two ways: one is based on HTML rendering mode, and the other is based on CanvasKit rendering mode. Furthermore, in CanvasKit mode, not every widget can correspond to an HTML element (such as div, span, text, etc.). Therefore, in CanvasKit mode, it is impossible to use traditional web technologies to mark a specific area for event propagation by adding a custom ID to the element. Therefore, a new touch event handling method is needed to achieve event propagation in custom areas of Flutter Web in CanvasKit mode. Moreover, the touch event handling method provided in this example embodiment can design and configure the event control area in the backend, generate corresponding configuration data, and send it to the client app, thereby remotely controlling events in various areas of the app. In other words, the touch event processing method described in the example embodiments of this disclosure can add a special event penetration processing layer between the panel layer and the 3D model layer, realizing a technology that allows control over the event area. Through remote configuration, it is possible to control events in a custom area in real time, including event penetration, event interception, and event validity control.

[0089] It should be added that, in practical applications, since the corresponding event control area can be designed and / or configured in the background (such as on the server side or the application server corresponding to the application client), the relevant information of the event control area can be sent to the front end (such as the display terminal, which may include tablet computers, mobile phones, projectors, or smart screens, etc.). The front end can then generate a corresponding event control area on the display panel layer of the display interface corresponding to the application based on the information, and then execute the corresponding event handling process, thereby improving the efficiency of event handling and reducing the system load.

[0090] Figure 2 The diagram schematically illustrates an example of a touch event processing system according to an exemplary embodiment of the present disclosure. Specifically, refer to... Figure 2As shown, the touch event processing system may include a display terminal 210 and a backend server 220; wherein, the display terminal 210 can communicate with the backend server via a wired network or a wireless network. In specific applications, the backend server can be used to generate hierarchical configuration data, and the display terminal can be used to implement the touch event processing method described in the example embodiments of this disclosure. The specific process of generating the hierarchical configuration data will be described in detail later, and will not be elaborated further here.

[0091] Figure 3 A flowchart illustrating a method for generating hierarchical configuration data according to an exemplary embodiment of this disclosure is shown schematically. Specifically, refer to... Figure 3 As shown, the backend server may include the following steps in the process of generating hierarchical configuration data:

[0092] Step S310: In response to the first selection operation applied to the panel interaction area included in the preset interaction area, a first panel interaction area and a second panel interaction area are set on the preset event control designer, and first configuration information and second configuration information are configured for the first panel interaction area and the second panel interaction area.

[0093] Step S320: In response to the second selection operation applied to the three-dimensional model interaction area included in the preset interaction area, the three-dimensional model interaction area is set on the preset event control designer, and third configuration information is configured for the three-dimensional model interaction area.

[0094] Step S330: Generate the hierarchical configuration data based on the first configuration information, the second configuration information, and the third configuration information; wherein, the size of the preset event control designer is consistent with the size of the display panel layer of the display terminal.

[0095] The following will combine Figure 4 Steps S310-S330 are explained and described. Specifically, in the backend server (backend), the specific interactive area can be configured through the event area designer; and the size of the event area designer described here is consistent with the size of the display panel layer of the display terminal. For details, refer to... Figure 4 As shown, two different event areas can be added, deleted, or dragged in the event area designer 400; these two different event areas can be... Figure 4The interactive area type setting module 410 shown includes a panel interactive area 411 and a 3D model interactive area 412. In specific applications, the panel interactive area can be selected in the interactive area type setting module and dragged to the corresponding position in the event area designer to generate a first panel interactive area 401 and a second panel interactive area 402 in the event area designer. Furthermore, the 3D model interactive area can also be selected in the interactive area type setting module and dragged to the corresponding position in the event area designer to generate a 3D model interactive area 403 in the event area designer.

[0096] It should be noted that after generating the first panel interaction area, the second panel interaction area, and the 3D model interaction area in the event area designer, the event area designer can adjust the size and position of the first panel interaction area, the second panel interaction area, and the 3D model interaction area according to actual needs, and configure the area type for the first panel interaction area, the second panel interaction area, and the 3D model interaction area. Then, based on the area size, area position, and area type, hierarchical configuration data is generated. In actual application, after the area size, area position, and area type of the first panel interaction area, the second panel interaction area, and the 3D model interaction area are set, it is only necessary to save the settings to automatically generate the hierarchical configuration data and send the hierarchical configuration data to the display terminal.

[0097] It should be further explained here that, in the process of configuring the first panel interaction area, the second panel interaction area, and the 3D model interaction area, the actual position of each interaction can be determined according to actual needs. In this example, the two sides of the event area designer are used as the first panel interaction area and the second panel interaction area, and the middle area of ​​the event area designer is used as the 3D model interaction area. This is to facilitate the display of the required 3D model in the middle area when the user interacts with the display terminal. This application does not make any special restrictions on the specific setting position of each interaction area.

[0098] In one possible example embodiment, the backend server can send hierarchical configuration data to the display terminal via HTTP (Hypertext Transfer Protocol); in another possible example embodiment, the backend server can also send hierarchical configuration data to the display terminal via RPC (Remote Procedure Call), and this example does not impose any special restrictions on this.

[0099] Figure 5The flowchart schematically illustrates a method for configuring a display panel layer according to an exemplary embodiment of the present disclosure. Specifically, refer to... Figure 5 As shown, the configuration method for this display panel layer may include the following steps:

[0100] Step S510: Receive the hierarchical configuration data sent by the backend server, and parse the hierarchical configuration data to obtain the first configuration information of the first panel interaction area, the second configuration information of the second panel interaction area, and the third configuration information of the three-dimensional model interaction area corresponding to the display panel layer.

[0101] Step S520: Based on the screen resolution of the display terminal and the first configuration information, second configuration information, and third configuration information, configure a first panel interaction area, a second panel interaction area, and a three-dimensional model interaction area in the display panel layer of the display terminal.

[0102] In one exemplary embodiment of this disclosure, configuring a first panel interaction area, a second panel interaction area, and a three-dimensional model interaction area in the display panel layer of the display terminal according to the screen resolution of the display terminal and the first configuration information, the second configuration information, and the third configuration information can be achieved in the following manner: obtaining the first area size, the first area position, and the first area type included in the first configuration information, and configuring the first panel interaction area in the display panel layer according to the screen resolution of the display terminal, the first area size, and the first area position; obtaining the second area size, the second area position, and the second area type included in the second configuration information, and configuring the second panel interaction area in the display panel layer according to the screen resolution, the second area size, and the second area position; and obtaining the third area size, the third area position, and the third area type included in the third configuration information, and configuring the three-dimensional model interaction area in the display panel layer according to the screen resolution, the third area size, and the third area position.

[0103] The following will combine Figure 6 Steps S510-S520 are explained and described below. Specifically, in the client of a certain application on the display terminal, after the display terminal receives the hierarchical configuration data sent by the backend server through the corresponding interface, it can parse the hierarchical configuration data and then configure the various interactive areas included in the display panel layer using the hierarchical configuration data. (Reference) Figure 6 As shown, the display panel layer 600 of the display terminal can be a panel layer developed using Flutter Web. Further details can be found by referring to... Figure 6As shown, the first panel interaction area 601, the second panel interaction area 602, and the 3D model interaction area 603 can be configured in the display panel layer based on the first-level configuration data. It should be noted that in practical applications, the Flutter global layout needs to be set to event pass-through so that the display panel layer can pass the received screen touch events. The purpose of setting the Flutter global layout to event passthrough is as follows: In Flutter Web CanvasKit mode, the display panel layer does not pass through any events by default, which makes it impossible to interact with the 3D model layer (i.e., the model rendering flow layer) by default, and thus it is impossible to perform operations such as scaling and rotating the 3D model in the 3D model interaction area. To solve this problem, by looking at the source code of Flutter Web CanvasKit mode, we can find some HTML DOM (HTML Document Object Model) elements with specific names, such as flt-glass-pane and flt-scene. We can set the pointer-events of the CSS (Cascading Style Sheets) of these elements to none, thereby enabling events to pass through all areas of the Flutter panel layer, and thus achieving the goal of passing the received screen touch events to the next layer.

[0104] Figure 7 An example diagram schematically illustrates a display panel layer of a display terminal according to the present disclosure. Specifically, refer to... Figure 7As shown, the display panel layer may include a first panel interaction area 601, a second panel interaction area 602, and a 3D model interaction area 603. The first panel interaction area includes multiple first interactive controls 701, the second panel interaction area includes multiple second interactive controls 702, and the 3D model interaction area includes multiple different 3D models, such as a building 3D model 703 and a road 3D model 704, etc. This example does not impose any special limitations on this. In specific applications, if the first panel interaction area and the second panel interaction area receive a screen touch event, the information corresponding to the screen touch event can be displayed. The specific display area can be floating in the area of ​​the interactive control corresponding to the screen touch event, or it can be displayed directly in the 3D model interaction area. For example, if the user selects an interactive control to display a map of a certain area, it can be displayed directly in the corresponding area or directly in the 3D model interaction area. If the user needs to zoom in on a certain part of the map, they can continue to input the corresponding screen touch event in the 3D model interaction area. Of course, it can also be achieved in other ways, and this example does not impose any special limitations on this.

[0105] Figure 8 An example diagram illustrating an event interception layer according to an exemplary embodiment of this disclosure is shown. Specifically, refer to... Figure 8 As shown, this event interception layer can be as follows: Figure 8 As shown in 800, the specific configuration method of the event interception layer may include: configuring an event interception layer in the next level below the display panel layer, and setting an event interception area and an event penetration area in the event interception layer. The setting of the event interception area and the event penetration area in the event interception layer can be implemented as follows: setting the event interception area in the event interception layer based on the first panel interaction area and the second panel interaction area, and setting the event penetration area in the event interception layer based on the 3D model interaction area.

[0106] Furthermore, based on the first panel interaction area and the second panel interaction area, an event interception area is set in the event interception layer, which can be achieved in the following way: First, obtain the first target position and the area of ​​the first target area of ​​the first panel interaction area in the display panel layer, and the second target position and the area of ​​the second target area of ​​the second panel interaction area in the display panel layer; Second, calculate the total area of ​​the event interception area based on the area of ​​the first target area and the area of ​​the second target area, and set the event interception area in the event interception layer based on the total area and the first target position and the second target position; wherein, the event interception layer has the same size as the display panel layer.

[0107] In one example embodiment, the specific implementation process of configuring the event interception layer may include: creating the event interception layer through the interface of the Document Object Model (DOM) of Hypertext Markup Language included in the Flutter of the display terminal. That is, since Flutter provides methods for adding HTML elements, such as html.DivElement, this method can be used to create another area specifically for event interception, and events can be intercepted using the property .style.pointerEvents = 'auto'. In the specific implementation process, this can be done using Flutter's built-in interface for creating HTML DOMs. Simultaneously, during creation, a DivElement element can be added to the bottom layer of the Flutter page, and its style.pointerEvent can be set to 'auto', thus reaching the event interception layer. Furthermore, by using a custom area to intercept events from certain areas passed through the display panel layer, the event handling layer for the intercepted screen touch events can be determined based on the event occurrence area. The specific code principles for setting up the event interception layer can be found in [reference needed]. Figure 9 As shown.

[0108] In one example embodiment, the event interception layer may include an event interception region and an event penetration region. Specifically, the event interception region can be referred to... Figure 10 As shown in 1001, the event penetration area can be referenced. Figure 10 As shown in 1002. Furthermore, the location and size of the event interception area are consistent with the interaction areas of the first panel and the second panel; the location and size of the event penetration area are consistent with the interaction area of ​​the 3D model.

[0109] Figure 11 The diagram schematically illustrates an example of a model rendering flow layer according to an exemplary embodiment of the present disclosure. Specifically, the model rendering flow layer can be as follows: Figure 11 As shown in 1100. The specific configuration method for the model rendering stream layer can include: configuring the model rendering stream layer in the next level below the event interception layer; wherein configuring the model rendering stream layer includes: embedding a streaming media player corresponding to the 3D model in the hypertext markup language file of the Flutter in the display terminal, and generating the model rendering stream layer based on the streaming media player. That is, CSS control can be added to web / index.html of the Flutter project, and the specific control principle is as follows:

[0110] <style type＝'text css'>

[0111] flt-glass-pane,flt-platform-view-slot{

[0112] pointer-events:none；

[0113] }

[0114] < / style>

[0115] Furthermore, based on the above control principles, the corresponding model rendering flow layer can be obtained. It's worth noting that in the web / index.html file of the Flutter project, the model rendering flow layer can be the streaming media player corresponding to the 3D model; simultaneously, in the Dart source code of the Fluter project, the backgroundColor property of the Flutter page's Scaffold can be set to Colors.transparent, which makes the background color of the display panel layer transparent, thereby revealing the 3D model of the model rendering flow layer. Ultimately, when the corresponding screen touch event is received in the interactive area of ​​the 3D model, the interaction process with the 3D model can be realized in a visible manner.

[0116] At this point, the configuration process for the display panel layer, event interception layer, and model rendering stream layer on the display terminal side has been completed. The following will combine... Figures 3-11 right Figure 1 The touch event handling method shown will be further explained and illustrated. Specifically:

[0117] In step S110, screen touch events are received through the display panel layer of the display terminal, and the screen touch events are transmitted to the event interception layer of the display terminal.

[0118] Specifically, firstly, screen touch events can be received through the display panel layer. The screen touch events described here can be a first touch event input by multiple fingers, a second touch event input by a single finger, or a third touch event input by an external device. This example does not impose any special restrictions on this. Furthermore, after the display panel layer receives a screen touch event, it can pass the screen touch event to the event interception layer for subsequent processing.

[0119] In step S120, the event occurrence location corresponding to the screen touch event is determined by the event interception layer, and the event processing layer required to process the screen touch event is determined according to the event occurrence location.

[0120] In this example embodiment, firstly, the event occurrence location corresponding to the screen touch event is determined through an event interception layer. Specifically, the determination process involves: acquiring the event coordinates included in the screen touch event, determining the position of the screen touch event on the display screen of the display terminal based on these coordinates, and thus determining the corresponding event occurrence location. Further, once the event occurrence location is obtained, the event processing layer required to process the screen touch event can be determined based on this location. The event processing layer described here may include a display panel layer and / or a model rendering flow layer. Specifically, the determination process may include: determining the first event occurrence area to which the screen touch event belongs in the event interception layer based on the event occurrence location. The first event occurrence area includes an event interception area and / or an event penetration area. Further, when the first event occurrence area is determined to be an event interception area, the event processing layer required to process the screen touch event is determined to be the display panel layer; when the first event occurrence area is determined to be an event penetration area, the event processing layer required to process the screen touch event is determined to be the model rendering flow layer.

[0121] In step S130, the screen touch event is transmitted to the event processing layer through the event interception layer, and the screen touch event is processed through the event processing layer.

[0122] In this example embodiment, the screen touch event is passed to the event processing layer through the event interception layer, and the screen touch event is processed by the event processing layer. This can be achieved in two ways: one is to return the screen touch event to the display panel layer through the event interception layer, and then interactively process the screen touch event through the display panel layer; the other is to pass the screen touch event through the event interception layer to the model rendering stream layer, and then interactively process the screen touch event through the model rendering stream layer.

[0123] In one example embodiment, during the interactive processing of the screen touch event through the display panel layer, it can be implemented as follows: the display panel layer determines a second event occurrence area on the display panel layer to which the screen touch event belongs based on the event occurrence location; wherein, the second event occurrence area includes a first panel interaction area and / or a second panel interaction area; when it is determined that the event occurrence location belongs to the first panel interaction area, the screen touch event is interactively processed in the first panel interaction area; when it is determined that the event occurrence location belongs to the second panel interaction area, the screen touch event is interactively processed in the second panel interaction area. That is, if the screen touch event occurs in the first panel interaction area or the second panel interaction area, the corresponding interactive operation (such as information display, information closing, information updating, etc.) can be directly performed on the first panel interaction area or the second panel interaction area. If it is necessary to penetrate the screen touch event to the model rendering flow layer...

[0124] In one example embodiment, during the interactive processing of the screen touch event through the model rendering flow layer, it can be achieved as follows: The model rendering flow layer obtains the 3D model to be processed corresponding to the screen touch event, and performs interactive processing on the 3D model to be processed; wherein, performing interactive processing on the 3D model to be processed includes: dragging, scaling, clicking, and switching camera perspectives, etc.; furthermore, after the interactive processing of the screen touch event through the model rendering flow layer, the event processing result of the screen touch event can also be transmitted through the model rendering flow layer to the 3D model interaction area of ​​the display panel layer via the event interception layer, and the event processing result can be displayed through the 3D model interaction area. In other words, if a screen touch event occurs in the interaction area of ​​a 3D model, the screen touch event can be transmitted to the model rendering stream layer through the event penetration area included in the event interception layer. Then, based on the streaming media player corresponding to the 3D model included in the model rendering stream layer, the corresponding 3D model to be processed can be operated. The corresponding operation can be determined according to the specific input action included in the screen touch event. For example, for a drag action, the 3D model to be processed can be dragged to the end position based on the start position and end position of the screen touch event. The specific execution process of other processing is similar and will not be elaborated here.

[0125] The following will combine Figure 12 The touch event handling method of the exemplary embodiments of this disclosure will be further explained and described. Specifically, refer to... Figure 12 As shown, the method for handling this touch event may include the following steps:

[0126] Step S1201: Configure an interactive area on the backend server;

[0127] Step S1202: Generate configuration information;

[0128] Step S1203: Send configuration information to the display terminal;

[0129] Step S1204: The display terminal configures the display panel layer, the event interception layer, and the model rendering stream layer according to the configuration information.

[0130] In step S1205, the display panel layer receives screen touch events and performs zone control based on the location where the screen touch events occur.

[0131] Thus, the touch event processing method described in the exemplary embodiments of this disclosure has been completed. Based on the foregoing description, it can be understood that the touch event processing method described in the exemplary embodiments of this disclosure implements a technology for controllable event areas. Through remote configuration, it is possible to perform real-time event control on custom areas, including event penetration, event interception, and event validity control.

[0132] According to one aspect of this disclosure, a touch event processing device is provided, configured in a display terminal. Specifically, see [link to relevant documentation]. Figure 13 As shown, the touch event processing device may include a screen touch event receiving module 1310, an event occurrence location determination module 1320, and an event processing module 1330. Wherein:

[0133] The screen touch event receiving module 1310 can be used to receive screen touch events through the display panel layer of the display terminal and transmit the screen touch events to the event interception layer of the display terminal;

[0134] The event location determination module 1320 can be used to determine the event location corresponding to the screen touch event through the event interception layer, and determine the event processing layer required to process the screen touch event based on the event location.

[0135] The event handling module 1330 can be used to pass the screen touch event to the event handling layer through the event interception layer, and process the screen touch event through the event handling layer.

[0136] In an exemplary embodiment of this disclosure, the event occurrence location determination module 1320 may be configured to perform: determining a first event occurrence area in the event interception layer to which the screen touch event belongs based on the event occurrence location; wherein the first event occurrence area includes an event interception area and / or an event penetration area; when the first event occurrence area is determined to be an event interception area, determining that the event processing layer required to process the screen touch event is a display panel layer; when the first event occurrence area is determined to be an event penetration area, determining that the event processing layer required to process the screen touch event is a model rendering flow layer.

[0137] In one exemplary embodiment of this disclosure, the event handling module 1330 may be configured to: return the screen touch event to the display panel layer through the event interception layer, and perform interactive processing on the screen touch event through the display panel layer; or pass the screen touch event through the event interception layer to the model rendering stream layer, and perform interactive processing on the screen touch event through the model rendering stream layer.

[0138] In one exemplary embodiment of this disclosure, the event handling module 1330 may further be configured to perform: determining, based on the event occurrence location, a second event occurrence area to which the screen touch event belongs on the display panel layer; wherein the second event occurrence area includes a first panel interaction area and / or a second panel interaction area; when it is determined that the event occurrence location belongs to the first panel interaction area, performing interactive processing on the screen touch event in the first panel interaction area; and when it is determined that the event occurrence location belongs to the second panel interaction area, performing interactive processing on the screen touch event in the second panel interaction area.

[0139] In one exemplary embodiment of this disclosure, the event handling module 1330 may also be configured to perform: obtaining a three-dimensional model to be processed corresponding to the screen touch event through the model rendering stream layer, and performing interactive processing on the three-dimensional model to be processed; wherein, performing interactive processing on the three-dimensional model to be processed includes one or more of the following: dragging, scaling, clicking, and camera perspective switching processing on the three-dimensional model to be processed.

[0140] In one exemplary embodiment of this disclosure, the event processing module 1330 may also be configured to perform: transmitting the event processing result of the screen touch event through the model rendering flow layer to the three-dimensional model interaction area of ​​the display panel layer via the event interception layer, and displaying the event processing result through the three-dimensional model interaction area.

[0141] In one exemplary embodiment of this disclosure, the touch event processing device further includes:

[0142] The hierarchical configuration data receiving module can be used to receive hierarchical configuration data sent by the backend server, and parse the hierarchical configuration data to obtain the first configuration information of the first panel interaction area, the second configuration information of the second panel interaction area, and the third configuration information of the three-dimensional model interaction area corresponding to the display panel layer.

[0143] The interactive area configuration module can be used to configure a first panel interactive area, a second panel interactive area, and a three-dimensional model interactive area in the display panel layer of the display terminal according to the screen resolution of the display terminal and the first configuration information, the second configuration information, and the third configuration information.

[0144] In an exemplary embodiment of this disclosure, the interactive area configuration module may further be configured to perform: obtaining the first area size, first area position, and first area type included in the first configuration information, and configuring a first panel interactive area in the display panel layer according to the screen resolution, first area size, and first area position of the display terminal; obtaining the second area size, second area position, and second area type included in the second configuration information, and configuring a second panel interactive area in the display panel layer according to the screen resolution, second area size, and second area position; and obtaining the third area size, third area position, and third area type included in the third configuration information, and configuring a three-dimensional model interactive area in the display panel layer according to the screen resolution, third area size, and third area position.

[0145] In an exemplary embodiment of this disclosure, the hierarchical configuration data is generated by the backend server in the following manner: in response to a second selection operation acting on a 3D model interaction area included in a preset interaction area, a first panel interaction area and a second panel interaction area are set on a preset event control designer, and first configuration information and second configuration information are configured for the first panel interaction area and the second panel interaction area; in response to a second selection operation acting on a 3D model interaction area included in the preset interaction area, a 3D model interaction area is set on a preset event control designer, and third configuration information is configured for the 3D model interaction area; hierarchical configuration data is generated according to the first configuration information, the second configuration information, and the third configuration information; wherein, the size of the preset event control designer is consistent with the size of the display panel layer of the display terminal.

[0146] In one exemplary embodiment of this disclosure, the touch event processing device further includes:

[0147] The event interception layer configuration module can be used to configure an event interception layer in the next level below the display panel layer, and to set an event interception area and an event penetration area in the event interception layer; wherein, configuring the event interception layer includes: creating the event interception layer through the interface of the Hypertext Markup Language Document Object Model included in the Flutter of the display terminal.

[0148] In one exemplary embodiment of this disclosure, the event interception layer configuration module may also be configured to perform: setting an event interception area in the event interception layer according to the first panel interaction area and the second panel interaction area, and setting an event penetration area in the event interception layer according to the three-dimensional model interaction area.

[0149] In an exemplary embodiment of this disclosure, the event interception layer configuration module may further be configured to perform: obtaining the first target position and the area of ​​the first target region of the first panel interaction region in the display panel layer, and the second target position and the area of ​​the second target region of the second panel interaction region in the display panel layer; calculating the total area of ​​the event interception region based on the first target region area and the second target region area, and setting the event interception region in the event interception layer based on the total area and the first target position and the second target position; wherein the event interception layer is the same size as the display panel layer.

[0150] In one exemplary embodiment of this disclosure, the touch event processing device further includes:

[0151] The model rendering stream layer configuration module can be used to configure the model rendering stream layer in the next level of the event interception layer; wherein, configuring the model rendering stream layer includes: embedding a streaming media player corresponding to the 3D model in the hypertext markup language file in the Flutter of the display terminal, and generating the model rendering stream layer based on the streaming media player.

[0152] The specific details of each module in the above-mentioned touch event processing device have been described in detail in the corresponding touch event processing methods, so they will not be repeated here.

[0153] It should be noted that although several modules or units for the device used to perform actions have been mentioned in the detailed description above, this division is not mandatory. In fact, according to embodiments of this disclosure, the features and functions of two or more modules or units described above can be embodied in one module or unit. Conversely, the features and functions of one module or unit described above can be further divided and embodied by multiple modules or units.

[0154] Furthermore, although the steps of the method in this disclosure are described in a specific order in the accompanying drawings, this does not require or imply that the steps must be performed in that specific order, or that all the steps shown must be performed to achieve the desired result. Additional or alternative steps may be omitted, multiple steps may be combined into one step, and / or a step may be broken down into multiple steps.

[0155] In an exemplary embodiment of this disclosure, an electronic device capable of implementing the above-described method is also provided.

[0156] Those skilled in the art will understand that various aspects of this disclosure can be implemented as a system, method, or program product. Therefore, various aspects of this disclosure can be specifically implemented in the following forms: a completely hardware implementation, a completely software implementation (including firmware, microcode, etc.), or a combination of hardware and software aspects, collectively referred to herein as a "circuit," "module," or "system."

[0157] The following reference Figure 14 To describe an electronic device 1400 according to such an embodiment of the present disclosure. Figure 14 The electronic device 1400 shown is merely an example and should not be construed as limiting the functionality and scope of use of the embodiments disclosed herein.

[0158] like Figure 14 As shown, the electronic device 1400 is manifested in the form of a general-purpose computing device. The components of the electronic device 1400 may include, but are not limited to: at least one processing unit 1410, at least one storage unit 1420, a bus 1430 connecting different system components (including storage unit 1420 and processing unit 1410), and a display unit 1440.

[0159] The storage unit stores program code that can be executed by the processing unit 1410, causing the processing unit 1410 to perform the steps described in the "Exemplary Methods" section of this specification according to various exemplary embodiments of this disclosure. For example, the processing unit 1410 can perform actions such as... Figure 1 Step S110: Receive screen touch events through the display panel layer of the display terminal and transmit the screen touch events to the event interception layer of the display terminal; Step S120: Determine the event occurrence location corresponding to the screen touch event through the event interception layer, and determine the event processing layer required to process the screen touch event based on the event occurrence location; Step S130: Transmit the screen touch event to the event processing layer through the event interception layer, and process the screen touch event through the event processing layer.

[0160] Storage unit 1420 may include readable media in the form of volatile storage units, such as random access memory (RAM) 14201 and / or cache memory 14202, and may further include read-only memory (ROM) 14203.

[0161] Storage unit 1420 may also include a program / utility 14204 having a set (at least one) of program modules 14205, such program modules 14205 including but not limited to: 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.

[0162] Bus 1430 can represent one or more of several types of bus structures, including a memory cell bus or memory cell controller, a peripheral bus, a graphics acceleration port, a processing unit, or a local bus using any of the various bus structures.

[0163] Electronic device 1400 can also communicate with one or more external devices 1500 (e.g., keyboard, pointing device, Bluetooth device, etc.), and with one or more devices that enable a user to interact with electronic device 1400, and / or with any device that enables electronic device 1400 to communicate with one or more other computing devices (e.g., router, modem, etc.). This communication can be performed via input / output (I / O) interface 1450. Furthermore, electronic device 1400 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 1460. As shown, network adapter 1460 communicates with other modules of electronic device 1400 via bus 1430. It should be understood that, although not shown in the figures, other hardware and / or software modules can be used in conjunction with electronic device 1400, including but not limited to: microcode, device drivers, redundant processing units, external disk drive arrays, RAID systems, tape drives, and data backup storage systems.

[0164] From the above description of the embodiments, those skilled in the art will readily understand that the exemplary embodiments described herein can be implemented by software or by combining software with necessary hardware. Therefore, the technical solutions according to the embodiments of this disclosure can be embodied in the form of a software product, which can be stored in a non-volatile storage medium (such as a CD-ROM, USB flash drive, external hard drive, etc.) or on a network, including several instructions to cause a computing device (such as a personal computer, server, terminal device, or network device, etc.) to execute the methods according to the embodiments of this disclosure.

[0165] In exemplary embodiments of this disclosure, a computer-readable storage medium is also provided, on which a program product capable of implementing the methods described above is stored. In some possible implementations, various aspects of this disclosure may also be implemented as a program product including program code that, when the program product is run on a terminal device, causes the terminal device to perform the steps of the various exemplary embodiments of this disclosure described in the "Exemplary Methods" section above.

[0166] The program product for implementing the above-described method according to embodiments of the present disclosure may employ a portable compact disc read-only memory (CD-ROM) and include program code, and may run on a terminal device, such as a personal computer. However, the program product of the present disclosure is not limited thereto. In this document, the readable storage medium may be any tangible medium containing or storing a program that may be used by or in conjunction with an instruction execution system, apparatus, or device.

[0167] The program product may employ any combination of one or more readable media. A readable medium may be a readable signal medium or a readable storage medium. A readable storage medium may be, for example, but not limited to, an electrical, magnetic, optical, electromagnetic, infrared, or semiconductor system, apparatus, or device, or any combination thereof. More specific examples of readable storage media (a non-exhaustive list) include: an electrical connection having one or more wires, a portable disk, a hard disk, random access memory (RAM), read-only memory (ROM), erasable programmable read-only memory (EPROM or flash memory), optical fiber, portable compact disk read-only memory (CD-ROM), optical storage devices, magnetic storage devices, or any suitable combination thereof.

[0168] Computer-readable signal media may include data signals propagated in baseband or as part of a carrier wave, carrying readable program code. Such propagated data signals may take various forms, including but not limited to electromagnetic signals, optical signals, or any suitable combination thereof. A readable signal medium may also be any readable medium other than a readable storage medium, capable of sending, propagating, or transmitting programs for use by or in conjunction with an instruction execution system, apparatus, or device.

[0169] The program code contained on the readable medium may be transmitted using any suitable medium, including but not limited to wireless, wired, optical fiber, RF, etc., or any suitable combination thereof.

[0170] Program code for performing the operations of this disclosure can be written in any combination of one or more programming languages, including object-oriented programming languages ​​such as Java and C++, and conventional procedural programming languages ​​such as C or similar languages. The program code can execute entirely on the user's computing device, partially on the user's computing device, as a standalone software package, partially on the user's computing device and partially on a remote computing device, or entirely on a remote computing device or server. In cases involving remote computing devices, the remote computing device can be connected to the user's computing device via any type of network, including a local area network (LAN) or a wide area network (WAN), or it can be connected to an external computing device (e.g., via the Internet using an Internet service provider).

[0171] Furthermore, the above figures are merely illustrative of the processes included in the method according to exemplary embodiments of this disclosure and are not intended to be limiting. It is readily understood that the processes shown in the above figures do not indicate or limit the temporal order of these processes. Additionally, it is readily understood that these processes may be executed synchronously or asynchronously, for example, in multiple modules.

[0172] Other embodiments of this disclosure will readily occur to those skilled in the art upon consideration of the specification and practice of the invention described herein. This application is intended to cover any variations, uses, or adaptations of this disclosure that follow the general principles of this disclosure and include common knowledge or customary techniques in the art not invented by this disclosure. The specification and embodiments are to be considered exemplary only, and the true scope and spirit of this disclosure are indicated by the claims.

Claims

1. A method for handling touch events, characterized in that, Configured on the display terminal, this system enables event penetration of custom areas in Flutter Web using Canvas Kit mode. The touch event handling methods include: The display terminal receives screen touch events through its display panel layer and transmits the screen touch events to the event interception layer of the display terminal; the display panel layer includes a first panel interaction area, a second panel interaction area, and a three-dimensional model interaction area; The event interception layer determines the location of the event corresponding to the screen touch event, and determines the first event occurrence area of ​​the screen touch event in the event interception layer based on the event occurrence location; wherein, the first event occurrence area includes an event interception area and / or an event penetration area; when the first event occurrence area is determined to be an event interception area, the event processing layer required to process the screen touch event is determined to be a display panel layer; when the first event occurrence area is determined to be an event penetration area, the event processing layer required to process the screen touch event is determined to be a model rendering flow layer; the event interception area includes a first panel interaction area and / or a second panel interaction area, and the event penetration area includes a three-dimensional model interaction area; The screen touch event is returned to the display panel layer through the event interception layer, and the screen touch event is interactively processed through the display panel layer; or, the screen touch event is penetrated to the model rendering stream layer through the event interception layer, the model rendering stream layer obtains the 3D model to be processed corresponding to the screen touch event, and the 3D model to be processed is interactively processed. The display panel layer performs interactive processing on the screen touch event in the following manner: the display panel layer determines a second event occurrence area on the display panel layer to which the screen touch event belongs based on the location of the event; wherein, the second event occurrence area includes a first panel interaction area and / or a second panel interaction area; when it is determined that the event occurrence location belongs to the first panel interaction area, the screen touch event is interactively processed in the first panel interaction area; when it is determined that the event occurrence location belongs to the second panel interaction area, the screen touch event is interactively processed in the second panel interaction area.

2. The method for processing touch events according to claim 1, characterized in that, Interactive processing of the 3D model to be processed includes one or more of the following: dragging, scaling, clicking, and switching camera perspectives.

3. The method for processing touch events according to claim 1, characterized in that, After the screen touch event is interactively processed through the model rendering flow layer, the touch event processing method further includes: The event processing results of the screen touch event are transmitted through the event interception layer to the 3D model interaction area of ​​the display panel layer via the model rendering flow layer, and the event processing results are displayed through the 3D model interaction area.

4. The method for processing touch events according to claim 1, characterized in that, The method for handling touch events also includes: The system receives hierarchical configuration data sent by the backend server and parses the hierarchical configuration data to obtain the first configuration information of the first panel interaction area, the second configuration information of the second panel interaction area, and the third configuration information of the three-dimensional model interaction area corresponding to the display panel layer. Based on the screen resolution of the display terminal and the first configuration information, the second configuration information, and the third configuration information, a first panel interaction area, a second panel interaction area, and a three-dimensional model interaction area are configured in the display panel layer of the display terminal.

5. The method for processing touch events according to claim 4, characterized in that, Based on the screen resolution of the display terminal and the first configuration information, second configuration information, and third configuration information, a first panel interaction area, a second panel interaction area, and a three-dimensional model interaction area are configured in the display panel layer of the display terminal, including: The system obtains the first region size, first region position, and first region type included in the first configuration information, and configures a first panel interaction area in the display panel layer according to the screen resolution, first region size, and first region position of the display terminal; and Obtain the second region size, second region position, and second region type included in the second configuration information, and configure a second panel interaction area in the display panel layer according to the screen resolution, second region size, and second region position; and The third region size, third region position, and third region type included in the third configuration information are obtained, and a three-dimensional model interaction area is configured in the display panel layer according to the screen resolution, third region size, and third region position.

6. The method for processing touch events according to claim 4 or 5, characterized in that, The hierarchical configuration data is generated by the backend server in the following manner: In response to a second selection operation applied to a 3D model interaction area included in a preset interaction area, a first panel interaction area and a second panel interaction area are set on a preset event control designer, and first configuration information and second configuration information are configured for the first panel interaction area and the second panel interaction area. In response to a second selection operation applied to a 3D model interaction area included in a preset interaction area, a 3D model interaction area is set on a preset event control designer, and third configuration information is configured for the 3D model interaction area. Hierarchical configuration data is generated based on the first configuration information, the second configuration information, and the third configuration information; wherein, the size of the preset event control designer is consistent with the size of the display panel layer of the display terminal.

7. The method for processing touch events according to claim 4 or 5, characterized in that, The method for handling touch events also includes: An event interception layer is configured in the next level below the display panel layer, and an event interception area and an event penetration area are set in the event interception layer; The configuration of the event interception layer includes: creating the event interception layer through the interface of the Document Object Model of Hypertext Markup Language included in the Flutter of the display terminal.

8. The method for processing touch events according to claim 7, characterized in that, The event interception layer includes setting an event interception area and an event penetration area, including: Based on the first panel interaction area and the second panel interaction area, an event interception area is set in the event interception layer, and based on the three-dimensional model interaction area, an event penetration area is set in the event interception layer.

9. The method for processing touch events according to claim 8, characterized in that, Based on the first panel interaction area and the second panel interaction area, an event interception area is set in the event interception layer, including: Obtain the first target position and the area of ​​the first target area of ​​the first panel interaction area in the display panel layer, and the second target position and the area of ​​the second target area of ​​the second panel interaction area in the display panel layer; Based on the area of ​​the first target area and the area of ​​the second target area, the total area of ​​the event interception area is calculated, and based on the total area and the positions of the first and second targets, the event interception area is set in the event interception layer. The event interception layer is the same size as the display panel layer.

10. The method for processing touch events according to claim 7, characterized in that, The method for handling touch events also includes: Configure the model rendering stream layer in the next level below the event interception layer; The configuration of the model rendering stream layer includes: embedding a streaming media player corresponding to the 3D model in the hypertext markup language file of the Flutter in the display terminal, and generating the model rendering stream layer based on the streaming media player.

11. A touch event processing device, characterized in that, Configured on a display terminal to enable event penetration of custom areas in Flutter Web under Canvas Kit mode, the touch event processing device includes: The screen touch event receiving module is used to receive screen touch events through the display panel layer of the display terminal and transmit the screen touch events to the event interception layer of the display terminal; the display panel layer includes a first panel interaction area, a second panel interaction area, and a three-dimensional model interaction area; An event location determination module is used to determine the event location corresponding to the screen touch event through the event interception layer, and to determine the first event location area to which the screen touch event belongs in the event interception layer based on the event location; wherein, the first event location area includes an event interception area and / or an event penetration area; when the first event location area is determined to be an event interception area, the event processing layer required to process the screen touch event is determined to be a display panel layer; when the first event location area is determined to be an event penetration area, the event processing layer required to process the screen touch event is determined to be a model rendering flow layer; the event interception area includes a first panel interaction area and / or a second panel interaction area, and the event penetration area includes a three-dimensional model interaction area; An event handling module is used to return the screen touch event to the display panel layer through the event interception layer, and to perform interactive processing on the screen touch event through the display panel layer; or, to pass the screen touch event through the event interception layer to the model rendering stream layer, to obtain the 3D model to be processed corresponding to the screen touch event through the model rendering stream layer, and to perform interactive processing on the 3D model to be processed. The display panel layer performs interactive processing on the screen touch event in the following manner: the display panel layer determines a second event occurrence area on the display panel layer to which the screen touch event belongs based on the location of the event; wherein, the second event occurrence area includes a first panel interaction area and / or a second panel interaction area; when it is determined that the event occurrence location belongs to the first panel interaction area, the screen touch event is interactively processed in the first panel interaction area; when it is determined that the event occurrence location belongs to the second panel interaction area, the screen touch event is interactively processed in the second panel interaction area.

12. A computer-readable storage medium having a computer program stored thereon, characterized in that, When the computer program is executed by the processor, it implements the touch event processing method according to any one of claims 1-10.

13. An electronic device, characterized in that, include: processor; as well as Memory for storing the executable instructions of the processor; The processor is configured to execute the touch event processing method according to any one of claims 1-10 by executing the executable instructions.

Images