Rich text processing method and device
By building a cross-platform rich text editor engine, we solved the high cost and inconsistent experience caused by independent development on different terminal platforms, and achieved unified rich text editing capabilities and synchronization effects.
Patent Information
- Application Number
- CN202211467935.1
- Authority / Receiving Office
- CN · China
- Patent Type
- Patents(China)
- Current Assignee / Owner
- Filing Date
- 2022-11-22
- Publication Date
- 2025-09-23
- Estimated Expiration
- 2042-11-22
AI Technical Summary
Rich text editors for different terminal platforms need to be developed separately, resulting in high development and maintenance costs and inconsistent editing capabilities and experience.
Build a cross-platform rich text editor engine based on JavaScript technology, integrate it into different platforms through rendering mechanism, history, plug-in mechanism, behavior control and data model, and unify data format storage and synchronization.
This reduces the development cost of cross-platform rich text editors and ensures consistency in editing capabilities and experience across platforms.
Smart Images

Figure CN118069255B_ABST
Abstract
Description
Technical Field
[0001] The present application relates to the field of terminal technology, and in particular to a rich text processing method and device. Background Art
[0002] With the development of smart terminals, when users record information through software such as memo, in addition to basic text, they also hope to record other content containing more information such as tables and pictures. Therefore, software such as memo needs to have rich text editing capabilities.
[0003] Rich text editors on different terminals can be synchronized through the cloud, allowing for rich text editing of the same text. However, due to the unique characteristics of different terminals, different rich text editors must be developed for each terminal platform to meet user needs, increasing development and maintenance costs. Furthermore, the editing capabilities of rich text editors on different platforms vary, making it difficult to guarantee a consistent user experience. Summary of the Invention
[0004] This application provides a rich text processing method and device, aiming to realize cross-platform rich text editor functions and ensure consistency of rich text editing capabilities and user experience on each platform.
[0005] In a first aspect, the present application provides a rich text processing method, which is applied to a first application, wherein the first application includes a rich text editor, and the method includes:
[0006] The rich text editor receives a first instruction, where the first instruction is used to instruct to perform a first operation on rich text content displayed in the rich text editor.
[0007] The rich text editor determines, according to the first instruction, operation information corresponding to the first operation, a target operation type of the first operation, and an operation position corresponding to the first operation in the rich text content.
[0008] The rich text editor generates instruction information according to the operation information, target operation type, and operation location.
[0009] The rich text editor updates the data structure corresponding to the rich text content according to the instruction information.
[0010] The rich text editor renders and displays rich text content based on the updated data structure.
[0011] The rich text editor is applied to a first application in at least two platforms.
[0012] In this method, the first applications of different platforms have certain differences according to the characteristics of the platforms themselves. The rich text editor is integrated into the first applications of different platforms, and the rich text editing function is implemented according to the first instruction.
[0013] In some implementations, the rich text editor includes a plug-in and a data processing unit, and the plug-in unit includes multiple plug-ins.
[0014] The rich text editor determines, based on the first instruction, operation information corresponding to the first operation, a target operation type of the first operation, and an operation position corresponding to the first operation in the rich text content, including:
[0015] The plug-in unit determines, according to the first instruction, a target plug-in corresponding to the first instruction from among the plurality of plug-ins.
[0016] The plug-in unit obtains operation information corresponding to the first operation from the data carried by the first instruction through the target plug-in.
[0017] The plug-in unit determines, through the target plug-in, a target operation type corresponding to the first instruction from a plurality of preset operation types.
[0018] The plug-in unit sends an identification instruction to the data processing unit.
[0019] The data processing unit determines an operation position corresponding to the first operation in response to the recognition instruction.
[0020] The plug-in unit may determine the operation information and target operation type corresponding to the first operation according to the first instruction, and determine the operation position corresponding to the first operation according to the data processing unit.
[0021] In some implementations, the data processing unit determines, in response to the recognition instruction, the operation position corresponding to the first operation, including:
[0022] The data processing unit determines whether the selected content exists in the rich text content in response to the recognition instruction.
[0023] If there is selected content in the rich text content, the selection area corresponding to the selected content is determined as the operation position. Alternatively, if there is no selected content in the rich text content, the cursor position in the first rich text is determined as the operation position.
[0024] After the data processing unit determines the operation position corresponding to the first operation in response to the recognition instruction, the method further includes:
[0025] The data processing unit sends the operation position corresponding to the first operation to the plug-in unit.
[0026] The data processing unit responds to the recognition instruction, distinguishes whether the first operation corresponds to the cursor or the selection area, determines the operation position, and feeds back the obtained operation position to the plug-in unit.
[0027] In some implementations, the rich text editor further includes an execution unit.
[0028] The rich text editor generates instruction information based on the operation information, target operation type, and operation location, including:
[0029] The plug-in unit sends the operation information, the target operation type, and the operation position to the execution unit;
[0030] The execution unit generates indication information according to the operation information, the target operation type, and the operation position.
[0031] The execution unit receives the operation information, target operation type and operation position sent by the plug-in unit according to the target operation interface, and abstractly encapsulates them into instruction information.
[0032] It can be understood that the data structure corresponding to the rich text content includes multiple nodes.
[0033] The rich text editor updates the data structure corresponding to the rich text content according to the instruction information, including:
[0034] The execution unit sends instruction information to the data processing unit.
[0035] The data processing unit determines the target node corresponding to the operation position in the data structure according to the instruction information.
[0036] The data processing unit executes the update operation corresponding to the target operation type and the operation information on the target node according to the instruction information.
[0037] The data structure corresponding to the rich text content can be updated according to the instruction information.
[0038] In some implementations, the rich text editor further includes a first rendering unit.
[0039] The rich text editor renders and displays rich text content based on the updated data structure, including:
[0040] The first rendering unit obtains the target node in the updated data structure.
[0041] The first rendering unit renders the first content corresponding to the target node in the rich text content according to the target node.
[0042] The rich text content is displayed according to the rendered first content and the remaining contents in the rich text content except the first content.
[0043] The first rendering unit renders and displays the rich text content to visualize the rich text editing effect.
[0044] In one embodiment, the rich text editor further includes a recording unit.
[0045] After the rich text editor updates the data structure corresponding to the rich text content according to the instruction information, the method further includes:
[0046] The rich text editor stores the instruction information in a first stack, where the first stack is used to store instruction information corresponding to completed operations.
[0047] After the rich text editor stores the instruction information in the first stack, the rich text processing method further includes:
[0048] When the rich text editor receives the undo instruction, the plug-in unit obtains the indication information located at the top of the first stack.
[0049] The plug-in unit cancels the update operation corresponding to the instruction information at the top of the stack in the data structure corresponding to the rich text content.
[0050] Render and display rich text content based on the data structure after the undo update operation.
[0051] The indication information at the top of the stack is stored in a second stack, and the second stack is used to store indication information corresponding to the revoked operation.
[0052] The recording unit stores indication information through the first stack. When an undo instruction is received, the plug-in unit obtains the indication information from the recording unit, performs an undo operation on the data structure through the data processing unit, and the first rendering unit renders and displays the rich text content after the undo operation. The second stack in the recording unit will store the indication information corresponding to the undo operation.
[0053] In some implementations, the first application further includes a second rendering unit and an instruction processing unit.
[0054] Before the rich text editor receives the first instruction, the rich text processing method further includes:
[0055] When the first application is started, the second rendering unit renders and displays the graphical user interface of the first application, which includes a list of multiple rich text contents, a startup instruction processing unit, and a second rendering unit registration instruction.
[0056] When the second rendering unit detects a display operation for any rich text content in the list, it sends an initialization instruction to the rich text editor.
[0057] The rich text editor generates a data structure for displaying rich text content corresponding to the operation according to the initialization instruction.
[0058] When the first application is started, the second rendering unit renders and displays the graphical user interface, starts the instruction processing unit and registers the corresponding functional instructions, so that the user can realize visual rich text editing.
[0059] In some implementations, the first application further includes an event processing unit.
[0060] Before the rich text editor receives the first instruction, the rich text processing method further includes:
[0061] When the second rendering unit detects a user operation, it determines a first event triggered by the user operation and sends the first event to the event processing unit.
[0062] The event processing unit determines the operation intention corresponding to the first event and sends the operation intention to the instruction processing unit.
[0063] The instruction processing unit obtains a first instruction that matches the operation intention and sends the first instruction to the plug-in unit.
[0064] By using other native controls in addition to the rich text editor in the first application, user operations can be detected, user intentions can be determined, and the intentions can be converted into instructions that can be recognized by the rich text editor.
[0065] In the implementation of the above rich text processing method, the rich text editor is developed based on the web page view.
[0066] In a second aspect, an embodiment of the present application provides a rich text processing device. The device includes:
[0067] A transmission module, configured to receive a first instruction from the rich text editor, wherein the first instruction is used to instruct to perform a first operation on the rich text content displayed in the rich text editor;
[0068] a determination module, configured for the rich text editor to determine, based on the first instruction, operation information corresponding to the first operation, a target operation type of the first operation, and an operation position corresponding to the first operation in the rich text content;
[0069] A processing module, configured for the rich text editor to generate instruction information according to the operation information, the target operation type, and the operation position;
[0070] The processing module is further configured to enable the rich text editor to update the data structure corresponding to the rich text content according to the instruction information;
[0071] The processing module is further configured to enable the rich text editor to render and display the rich text content according to the updated data structure;
[0072] The rich text editor is applied to the first application in at least two platforms.
[0073] In a possible design, the rich text editor includes a plug-in unit and a data processing unit, and the plug-in unit includes multiple plug-ins;
[0074] The determining module is specifically configured to:
[0075] The plug-in unit determines, according to the first instruction, a target plug-in corresponding to the first instruction from among the multiple plug-ins;
[0076] The plug-in unit obtains, through the target plug-in, operation information corresponding to the first operation from the data carried by the first instruction;
[0077] The plug-in unit determines, through the target plug-in, a target operation type corresponding to the first instruction from a plurality of preset operation types;
[0078] The plug-in unit sends an identification instruction to the data processing unit;
[0079] The data processing unit determines an operation position corresponding to the first operation in response to the recognition instruction.
[0080] In one possible design, the determining module is specifically configured to:
[0081] The data processing unit determines, in response to the recognition instruction, whether selected content exists in the rich text content;
[0082] If there is selected content in the rich text content, the selection area position corresponding to the selected content is determined as the operation position; or if there is no selected content in the rich text content, the cursor position in the first rich text is determined as the operation position.
[0083] In one possible design, the transmission module is further configured to:
[0084] After the data processing unit determines the operation position corresponding to the first operation in response to the recognition instruction, the data processing unit sends the operation position corresponding to the first operation to the plug-in unit.
[0085] In a possible design, the rich text editor further includes an execution unit;
[0086] The processing module is specifically used for:
[0087] The plug-in unit sends the operation information, the target operation type, and the operation position to the execution unit;
[0088] The execution unit generates indication information according to the operation information, the target operation type, and the operation position.
[0089] In one possible design, the data structure corresponding to the rich text content includes multiple nodes;
[0090] The processing module is specifically configured to: the execution unit sends the instruction information to the data processing unit;
[0091] The data processing unit determines, in the data structure, a target node corresponding to the operation position according to the indication information;
[0092] The data processing unit performs an update operation corresponding to the target operation type and the operation information on the target node according to the indication information.
[0093] In a possible design, the rich text editor further includes a first rendering unit;
[0094] The processing module is specifically used for:
[0095] The first rendering unit obtains the target node from the updated data structure;
[0096] The first rendering unit renders the first content corresponding to the target node in the rich text content according to the target node;
[0097] The rich text content is displayed according to the rendered first content and the remaining content in the rich text content except the first content.
[0098] In a possible design, the rich text editor further includes a recording unit;
[0099] The processing module is further configured to:
[0100] After the rich text editor updates the data structure corresponding to the rich text content according to the indication information, the rich text editor stores the indication information in a first stack, where the first stack is used to store indication information corresponding to completed operations.
[0101] In one possible design, the processing module is further configured to:
[0102] After the rich text editor stores the indication information in the first stack, when the rich text editor receives a cancel instruction, the plug-in unit obtains the indication information at the top of the first stack;
[0103] The plug-in unit cancels the update operation corresponding to the instruction information at the top of the stack in the data structure corresponding to the rich text content;
[0104] Rendering and displaying the rich text content according to the data structure after the undo update operation;
[0105] The indication information at the top of the stack is stored in a second stack, where the second stack is used to store indication information corresponding to the revoked operation.
[0106] In a possible design, the first application further includes a second rendering unit and an instruction processing unit;
[0107] The processing module is further configured to:
[0108] Before the rich text editor receives the first instruction, when the first application is started, the second rendering unit renders and displays a graphical user interface of the first application and starts the instruction processing unit, the graphical user interface including a list of multiple rich text contents;
[0109] When the second rendering unit detects a display operation for any rich text content in the list, sending an initialization instruction to the rich text editor;
[0110] The rich text editor generates a data structure of rich text content corresponding to the display operation according to the initialization instruction.
[0111] In a possible design, the first application further includes an event processing unit;
[0112] The processing module is further configured to:
[0113] Before the rich text editor receives the first instruction, when the second rendering unit detects a user operation, determining a first event triggered by the user operation and sending the first event to the event processing unit;
[0114] The event processing unit determines the operation intention corresponding to the first event and sends the operation intention to the instruction processing unit;
[0115] The instruction processing unit obtains the first instruction matching the operation intention and sends the first instruction to the plug-in unit.
[0116] In a possible design, the rich text editor is developed based on a web page view.
[0117] In a third aspect, embodiments of the present application provide a terminal device, which may also be referred to as a terminal, user equipment (UE), mobile station (MS), or mobile terminal (MT). The terminal device may be a mobile phone, a smart TV, a wearable device, a tablet computer, a computer with wireless transceiver capabilities, a virtual reality (VR) terminal device, an augmented reality (AR) terminal device, a wireless terminal in industrial control, a wireless terminal in self-driving, a wireless terminal in remote medical surgery, a wireless terminal in a smart grid, a wireless terminal in transportation safety, a wireless terminal in a smart city, a wireless terminal in a smart home, and the like.
[0118] The terminal device includes: a processor and a memory; the memory stores computer-executable instructions; the processor executes the computer-executable instructions stored in the memory, so that the terminal device executes the method of the first aspect.
[0119] In a fourth aspect, an embodiment of the present application provides a computer-readable storage medium storing a computer program, which, when executed by a processor, implements the method of the first aspect.
[0120] In a fifth aspect, an embodiment of the present application provides a computer program product, which includes a computer program. When the computer program is run, it enables the computer to execute the method of the first aspect.
[0121] In a sixth aspect, an embodiment of the present application provides a chip, the chip including a processor, the processor being used to call a computer program in a memory to execute the method described in the first aspect.
[0122] It should be understood that the second to fifth aspects of the present application correspond to the technical solutions of the first aspect of the present application, and the beneficial effects achieved by each aspect and the corresponding feasible implementation methods are similar and will not be repeated here.
[0123] The rich text processing method and device of the present application processes rich text editing through five units: a first rendering unit, a recording unit, a plug-in unit, an execution unit, and a data processing unit, and constructs a rich text editor engine. The rich text editor is integrated into different platforms, and the rich text editor engine provides functional support. Each platform implements the rich text editing function through interface calls based on its own characteristics. The cloud servers associated with each platform store the same data format, and the rich text editor can parse the data format, thereby achieving consistent storage, synchronization, and editing of the data. BRIEF DESCRIPTION OF THE DRAWINGS
[0124] The accompanying drawings, which are incorporated in and constitute a part of this specification, illustrate embodiments consistent with the present application and, together with the description, serve to explain the principles of the present application.
[0125] Figure 1 A schematic diagram of the interaction between the rich text editors of each platform and the cloud service;
[0126] Figure 2 A schematic diagram of the interaction between the cross-platform rich text editor and the cloud service provided for this application;
[0127] Figure 3 A schematic diagram of the overall framework design of a rich text editor provided in one embodiment of the present application;
[0128] Figure 4 Interactive diagram of a rich text processing method provided in one embodiment of the present application Figure 1 ;
[0129] Figure 5 A schematic diagram of a graphical user interface for a PC memo provided in one embodiment of the present application;
[0130] Figure 6 Interactive diagram of a rich text processing method provided in one embodiment of the present application Figure 2 ;
[0131] Figure 7 A schematic diagram of a rich text processing method provided in an embodiment of the present application for bolding rich text content;
[0132] Figure 8 Interactive diagram of a rich text processing method provided in one embodiment of the present application Figure 3 ;
[0133] Figure 9A Schematic diagram of the data structure change provided in one embodiment of the present application Figure 1 ;
[0134] Figure 9B Schematic diagram of the data structure change provided in one embodiment of the present application Figure 2 ;
[0135] Figure 9C Schematic diagram of the data structure change provided in one embodiment of the present application Figure 3 ;
[0136] Figure 9D Schematic diagram of the data structure change provided in one embodiment of the present application Figure 4 ;
[0137] Figure 9E Schematic diagram of the data structure change provided in one embodiment of the present application Figure 5 ;
[0138] Figure 9F Schematic diagram of the data structure change provided in one embodiment of the present application Figure 6 ;
[0139] Figure 9G Schematic diagram of the data structure change provided in one embodiment of the present application Figure 7 ;
[0140] Figure 9H Schematic diagram of the data structure change provided in one embodiment of the present application Figure 8 ;
[0141] Figure 10 A schematic diagram of a graphical user interface for an Android memo provided in one embodiment of the present application;
[0142] Figure 11 A schematic diagram of the processing process of the rich text processing method provided in an embodiment of the present application;
[0143] Figure 12 A schematic diagram of the structure of a rich text processing device provided in an embodiment of the present application;
[0144] Figure 13 A schematic diagram of the hardware structure of the terminal device provided in an embodiment of the present application.
[0145] The above drawings illustrate specific embodiments of the present application, which will be described in more detail below. These drawings and the textual description are not intended to limit the scope of the present application in any way, but rather to illustrate the concepts of the present application to those skilled in the art by reference to specific embodiments. DETAILED DESCRIPTION
[0146] Exemplary embodiments will be described in detail herein, with examples illustrated in the accompanying drawings. In the following description, when referring to the drawings, identical numerals in different figures represent identical or similar elements, unless otherwise indicated. The embodiments described in the following exemplary embodiments are not intended to represent all embodiments consistent with the present application. Rather, they are merely examples of apparatus and methods consistent with certain aspects of the present application, as detailed in the appended claims.
[0147] It should be noted that the "at..." in the embodiments of the present application can be the instant when a certain situation occurs, or it can be a period of time after the situation occurs, and the embodiments of the present application do not specifically limit this. In addition, the display interface provided in the embodiments of the present application is only an example, and the display interface can also include more or less content.
[0148] With the development of information technology, smart devices are playing an increasingly important role in people's lives. When users have to-do items or events they need to record, they tend to record them in applications like Memo. Beyond simple, basic text, these records may also include tables, images, and other information, requiring apps like Memo to have rich text editing capabilities. Existing technology allows different terminal platforms to synchronize data through cloud servers, allowing users to access and edit the same document across different platforms.
[0149] In the current related implementation, when developing rich text editors, they are usually developed independently for different terminal platforms. For example, you can combine Figure 1 To understand, such as Figure 1 As shown, it is assumed that the terminal platform can include Android platform, Windows platform and Mac platform, etc. Figure 1 In the diagram, Rich Text Editor 1 is developed for the Android platform, Rich Text Editor 2 is developed for the Windows platform, and Rich Text Editor 3 is developed for the Mac platform. Rich Text Editor 1, Rich Text Editor 2, and Rich Text Editor 3 are three completely independent rich text editor products.
[0150] There are also other ways to implement the terminal platform. Figure 1 Other platforms are also illustrated accordingly. The terminal platform in this embodiment can be understood as the platform corresponding to the operating system. In other words, different operating systems correspond to different terminal platforms. In actual implementation, the specific implementation of the terminal platform can be selected and configured according to actual needs. Therefore, it can be understood that regardless of the terminal platform, current related technologies will independently develop rich text editors for different terminal platforms.
[0151] and reference Figure 1What is certain is that for content edited in rich text editors on different terminal platforms, if the same data format is stored in the cloud server, then the corresponding rich text editors on each platform must be compatible with the cloud data format, but this greatly increases development and maintenance costs. Furthermore, the editing capabilities of rich text editors on different terminal platforms may vary. For example, rich text editors developed independently on different platforms may have different bolding effects, selectable font colors, supported functions, etc. Therefore, the same content may appear differently in rich text editors on different platforms, and may even display errors. Therefore, developing rich text editors separately for each platform cannot guarantee a consistent user experience.
[0152] In order to solve the above technical problems, this application provides a rich text processing method, which aims to realize the cross-platform rich text editor function and ensure the consistency of rich text editing capabilities and user experience on each platform. Figure 2 To understand, such as Figure 2 As shown, in the technical solution of this application, a rich text editor product can be developed, and then this rich text editor product can be integrated into different terminal platforms, thereby realizing cross-platform rich text editing functions.
[0153] The technical concept of this application is to build a rich text editor engine based on JavaScript technology, through rendering mechanism, history record, plug-in mechanism, behavior control and data model processing rich text editing. The rich text editor is integrated into different platforms, and the rich text editor engine provides functional support to implement the corresponding functions of the rich text editor on different platforms. The rich text editor can be developed based on the web view, so as to ensure that each platform can integrate the rich text editor. In addition, the cloud servers associated with each platform store the same data format, and the rich text editor can parse the data format, so as to achieve consistent storage, synchronization and editing of the data.
[0154] Figure 3 This is a schematic diagram of the overall framework design of a rich text editor provided in one embodiment of the present application. Figure 3 As shown in the figure, the rich text editor engine includes five units: rendering mechanism, history, plug-in mechanism, behavior control and data model.
[0155] and in Figure 3 In the example, we take Android and Windows as examples to introduce the cross-platform implementation of the rich text editor. Figure 3What is certain is that the rich text editor in this embodiment can be used as both an Android product in the Android platform and a desktop product in the Windows platform. That is to say, in this embodiment, only one rich text editor product needs to be developed and deployed on different platforms to realize the cross-platform application of the rich text editor.
[0156] In one possible implementation, a rich text editor is typically integrated into an application, providing rich text editing functionality for the corresponding application. The following uses the Android and PC memo applications as examples for illustration. However, it is understood that the implementation methods for other applications requiring the integration of a rich text editor are similar and will not be further described here.
[0157] The following combination Figure 3 First, let's explain the Android memo, which is an application with rich text editing function. Figure 3 What is certain is that the Android memo includes the Native layer and the Webview layer.
[0158] The Native layer includes Activity, View, Button, and a user event processing unit. These components are part of the Android native user interface (UI) framework and enable UI rendering. The visual interface that users interact with when using the memo is rendered by components in the Native layer. The user event processing unit listens for events in the UI to understand the user's intent, such as setting text to bold, italics, or font size.
[0159] Through the JS-Android communication interface, the event processing unit can pass monitored events to the WebView layer. The WebView layer includes the interface layer and the rich text editor. The HTML layout, CSS style, and JS loading unit in the interface layer are used to render components other than the rich text editor. The JS interface serves as the communication interface between the JS and Android layers. The rich text editor allows users to edit rich text content.
[0160] Next, combine Figure 3 The memo on the personal computer (PC) is described. The PC memo can be run on the Windows platform, such as Figure 3As shown, for a PC-side memo, the application is built on a web view layer, which may include a UI rendering unit, a user event processing unit, a command processing unit, and a rich text editor.
[0161] The UI rendering unit includes React components, HTML layout sub-units, and CSS style sub-units. The PC memo can be rendered using the React framework, and the user event processing unit can listen to events at the UI layer and identify user intent. In the instruction processing unit, user intent can be further converted into instructions, which are then passed to the rich text editor through a series of operations such as instruction subscription, instruction matching, and instruction distribution. The rich text editor then implements the editing behavior intended by the user based on the instructions received.
[0162] exist Figure 3 In the diagram, a rich text editor is deployed in the PC memo corresponding to the Windows platform, and a rich text editor is also deployed in the Android memo corresponding to the Android platform. In fact, the deployments on different platforms are Figure 3 The rich text editor shown in the middle part of the , that is, in the technical solution of this application, only a rich text editor needs to be developed and then deployed to the memo application of different platforms. And Figure 3 This is just an example of how to deploy the same rich text editor on Windows and Android platforms. In fact, rich text editors can be deployed on various possible platforms, and the specific deployment platform can be selected and set according to actual needs.
[0163] Reference Figure 3 In this embodiment, a rich text editor engine is constructed through five major units: rendering mechanism, history record, plug-in mechanism, behavior control, and data model. The rich text editor engine provides functional support and is integrated into different platforms as needed. Reusing the same rich text editor engine on different platforms reduces the development cost of cross-platform rich text editors and ensures the same editing capabilities. Through the native controls of each platform, rich rich text content can be flexibly displayed, ensuring that users have a consistent editing and interaction experience on different platforms.
[0164] like Figure 4 As shown, an embodiment of the present application provides a rich text processing method, which is applied to a first application, wherein the first application includes a native control and a rich text editor, wherein the native control includes a second rendering unit, an event processing unit, and an instruction processing unit, and specifically includes the following steps:
[0165] S101: When a first application is started, a second rendering unit renders and displays a graphical user interface of the first application, where the graphical user interface includes a list of multiple rich text contents.
[0166] For example: Figure 5 The figure is a schematic diagram of the PC-side memo interface, where the PC-side memo can be understood as the first application in this embodiment. In actual implementation, the first application is not limited to the memo described above, but can be any application that requires rich text editing capabilities, such as an instant messaging application that supports rich text editing, a document application that supports rich text editing, and so on. This embodiment does not limit the specific implementation of the first application.
[0167] The following takes the PC-side memo as an example for explanation. When the PC-side memo is started, the second rendering unit renders the graphical user interface of the memo, such as Figure 5 As shown, the memo's graphical user interface includes a file list, a note list, and a user event response area. The file list displays the user's file categories, the note list displays a list of rich text stored in a folder, and the user event response area displays the editing operations that the user can perform on the rich text content.
[0168] S102: The second rendering unit sends a startup instruction to the instruction processing unit, where the startup instruction is used to instruct the instruction processing unit to start.
[0169] When the memo is started, the second rendering unit may instruct the instruction processing unit to start as well. In a possible implementation, the second rendering unit may, for example, send a corresponding start instruction to the instruction processing unit, thereby starting the instruction processing unit.
[0170] After the instruction processing unit is started, it can register the functional instructions supported by the PC-side memo, such as bold instructions, italic instructions, etc. The instructions that the instruction unit needs to register may depend on the specific instructions supported by the PC-side memo. This embodiment does not limit the specific implementation of the registration instructions.
[0171] S103: When the second rendering unit detects a display operation for any rich text content in the list, it sends an initialization instruction to the rich text editor.
[0172] In this embodiment, the second rendering unit can detect interactive operations acting on the graphical user interface of the first application, and based on the above introduction, it can be determined that the graphical user interface of the first application includes a list of multiple rich text contents. For example, the user can choose to open a rich text content in the list, then the rich text content selected by the user to open needs to be displayed in the rich text editor accordingly.
[0173] Therefore, the second rendering unit in this embodiment can, for example, detect a display operation on any rich text content in the list. The display operation here is used to instruct the rich text content selected by the user to be displayed in the rich text editor. The display operation can be, for example, a touch operation on a certain rich text content, or a click operation on a certain rich text content. The click operation here can be triggered by an interactive medium such as a mouse or a stylus. This embodiment does not limit the specific implementation method of the display operation, as long as the display operation is used to instruct the corresponding rich text content to be displayed in the rich text editor.
[0174] When the second rendering unit detects a display operation, it needs to notify the rich text editor to perform a corresponding initialization operation, for example, it may send an initialization instruction to the rich text editor.
[0175] For example: When the second rendering unit detects that the user selects Figure 3 When the first note in the note list is displayed, the memo needs to display the corresponding content of the note in the rich text editor area, so the second rendering unit needs to send an initialization instruction to the rich text editor.
[0176] S104: The rich text editor generates a data structure of rich text content corresponding to the display operation according to the initialization instruction.
[0177] In this embodiment, the initialization instruction is used to instruct the rich text editor to generate a data structure of rich text content to be displayed. Therefore, after receiving the initialization instruction, the rich text editor can generate a data structure of rich text content corresponding to the above display operation.
[0178] In one possible implementation, when the rich text content corresponding to the display operation is empty, for example, when the note selected by the user is a blank note, the rich text editor can generate an empty data structure.
[0179] Alternatively, when the rich text content corresponding to the display operation is not empty, a data structure corresponding to the rich text content may be generated according to the specific text structure of the rich text content.
[0180] For example, you can refer to Figure 4 To understand, assuming that the user selects a note titled "Test Document," the initialization instruction is used to instruct the rich text editor to generate a data structure corresponding to "Test Document." in the note content, and then, for example, "Test Document." can be displayed in the rich text editor.
[0181] In a possible implementation, the data structure corresponding to the rich text content exists in the form of a tree structure. Figure 4In the example, the rich text content is "Test document.", then the data structure corresponding to the rich text content can be expressed as:
[0182]
[0183]
[0184] The type field can set the element type of rich text content. Paragraph indicates that the element type is text, and the children store the specific rich text content of the paragraph type element. For example Figure 4 In the example, the content of the paragraph type element is "test document."
[0185] S105 : When the second rendering unit detects a user operation, it determines a first event triggered by the user operation.
[0186] After the rich text editor is initialized for the rich text content, if the rich text content is not empty, the rich text content will be displayed in the corresponding rich text editor; if the rich text content is empty, the rich text editor will be displayed blank. In short, after the initialization is completed, the rich text editor will be displayed in the graphical user interface. The user can then perform corresponding operations on the rich text editor, such as modifying the format of the content in the rich text editor, or adding, modifying, deleting, etc. The user can perform the corresponding user operations in the rich text editor, or the user can perform the corresponding user operations in the user event response area of the first application.
[0187] In this embodiment, when the user inputs a user operation, the second rendering unit in the first application may detect the corresponding user operation, and the second rendering unit may determine a first event triggered by the user operation.
[0188] For example, you can combine Figure 5 For example, when the user clicks the "B" button in the user event response area, which is the bold button, the second rendering unit can detect that the user clicks the bold button, and can determine that the first event triggered by the user operation is setting bold. For another example, when the user clicks the "I" button in the user event response area, which is the italic button, the second rendering unit detects that the user clicks the italic button, and can determine that the first event triggered by the user operation is setting italics. For another example, the second rendering unit detects that the user enters content in the edit box of the rich text editor, for example, the user enters content in the rich text editor. Figure 5 The "test document." shown in the figure is then entered as "test test", so it can be determined that the first event triggered by the user operation is the input text.
[0189] The correspondence between user operations and the events triggered thereby may be preset, for example. This embodiment does not limit the specific implementation method of the first event triggered by each user operation, which may be selected and set according to actual needs.
[0190] S106: The second rendering unit sends the first event to the event processing unit.
[0191] After determining the first event, the second rendering unit may send the first event to the event processing unit.
[0192] S107: The event processing unit determines the operation intention corresponding to the first event.
[0193] After receiving the first event sent by the second rendering unit, the event processing unit can, for example, parse the first event to determine the operation intention corresponding to the first event. In one possible implementation, for example, the operation field in the indication information of the first event can be parsed to determine the operation intention corresponding to the first event, or the operation intention corresponding to the first event can be determined based on the matching relationship between the event and the intention. After determining the operation intention, the event processing unit can send the operation intention to the instruction processing unit.
[0194] Can also be combined Figure 5 For example, when the first event is to set bold, the event processing unit may match the user's operation intention to set the bold attribute for the rich text content according to the event; for another example, when the first event is to set italics, the event processing unit may match the user's operation intention to set the italic attribute for the rich text content; for another example, when the first event is to input text, the event processing unit may match the user's operation intention to input content in the rich text edit box.
[0195] S108. The event processing unit sends the operation intention to the instruction processing unit.
[0196] After determining the operation intention corresponding to the first event, the event processing unit may send the determined operation intention to the instruction unit.
[0197] S109: The instruction processing unit obtains a first instruction that matches the operation intention.
[0198] Since the instruction processing unit has registered instructions, the operation intention can be matched with the registered instructions, and the user's operation intention can be converted into a first instruction based on the matching result. For example, if the operation intention is to set the bold attribute for rich text content, the corresponding instruction that can be matched is the bold instruction. For another example, if the operation intention is to set the italic attribute, the corresponding instruction that can be matched is the italic instruction. Among them, the correspondence between the operation intention and the instruction can be selected and set according to actual needs, and this embodiment does not limit this.
[0199] S110: Send a first instruction to the rich text editor.
[0200] In one possible implementation, if there is a first instruction in the instruction processing unit that matches the operation intention, that is, a corresponding instruction is registered in the instruction processing unit, then the instruction processing unit can send the first instruction to the rich text editor so that the rich text editor performs corresponding processing according to the first instruction.
[0201] In another possible implementation, if the instruction processing unit does not contain a first instruction that matches the intended operation, for example, if the instruction processing unit does not have a corresponding instruction registered in the instruction processing unit, then the instruction processing unit may, for example, provide feedback to the second rendering unit that the first instruction was not matched, and then terminate the current processing flow. The second rendering unit may then, for example, display a prompt message in a graphical user interface, where the prompt message is used to indicate that the instruction corresponding to the user operation is not currently matched.
[0202] In this embodiment, when the first application is started, the second rendering unit renders and displays a graphical user interface, allowing the user to use the first application visually and register corresponding function instructions at the same time as the application is started; when the second rendering unit detects a user operation, it determines the triggered first event, identifies the user intention through the event processing unit, and matches the instructions through the instruction processing unit, and passes the operation instructions to the rich text editor.
[0203] The above introduces the relevant initialization operations after the first application is started, as well as the detection of user operations after the initialization is completed, and the relevant content of sending the first instruction to the rich text editor based on the user operations. After the rich text editor receives the first instruction, it can perform corresponding processing according to the first instruction. The following is an introduction to the implementation method of the rich text editor executing the corresponding processing of the first instruction in combination with specific embodiments.
[0204] like Figure 6 As shown, an embodiment of the present application provides a rich text processing method, which is applied to a first application, wherein the first application includes a rich text editor, a command processing unit, and a second rendering unit, and specifically includes the following steps:
[0205] S201. An instruction processing unit sends a first instruction to a rich text editor, where the first instruction is used to instruct to perform a first operation on rich text content displayed in the rich text editor.
[0206] In this step, the first instruction may be used to instruct to perform a first operation on the existing rich text content in the rich text editor, such as setting the properties of the rich text content, or adding, deleting, modifying the existing rich text content, etc.
[0207] Alternatively, when the rich text content is empty, the first instruction may also instruct to perform a first operation on the rich text content subsequently input by the user, such as adding rich text content or setting attributes for the rich text content subsequently input by the user. For example, when the rich text content is empty, the first instruction instructs to perform a first operation to set the font to Songti, and the font of the text subsequently input by the user will all be Songti.
[0208] The first operation specifically executed by the first instruction can be selected and set according to actual needs, which depends on what specific user operation is detected. Therefore, this embodiment does not limit the specific implementation method of the first operation.
[0209] S202: The rich text editor determines, according to the first instruction, operation information corresponding to the first operation, a target operation type of the first operation, and an operation position corresponding to the first operation in the rich text content.
[0210] Among them, the operation information corresponding to the first operation is used to indicate the specific operation content of the first operation. For example, if the first operation is an operation to set the bold attribute, then the operation information is, for example, instruction information for setting the bold attribute to "yes". For another example, if the first operation is an operation to set the font color, then the operation information is, for example, instruction information for setting the font color attribute to a specified color. The operation information of the first operation can be selected and set according to actual needs, which depends on the specific implementation of the first operation. In one possible implementation method, the operation information of the first operation can be carried in the first instruction.
[0211] Also, in order to facilitate the recording and management of operations, the present embodiment divides the various possible operations into a certain number of operation types, so the present embodiment can also determine the target operation type of the first operation. In the examples introduced above, the first operation is an operation to set the bold attribute, or the first operation is an operation to set the italic attribute, or the first operation is an operation to set the font color. The target operation type of these first operations can all be "setting attributes". For example, if the first operation is an operation to input text, or the first operation is an operation to input a picture, the target operation type of these first operations can all be "insert node".
[0212] In the example described above, the multiple operation types can include setting attributes and inserting nodes, as well as other operation types. In actual implementation, the specific operation types can be set according to actual needs. It should also be understood that the number of target operation types corresponding to the first operation may be one or more, depending on the specific content of the first operation and the method of dividing the operation types.
[0213] It can also be understood that if the rich text editor needs to perform a first operation on the rich text content displayed in the rich text markup machine according to the first instruction, it can determine what to do based on the operation information of the first operation, and it can be convenient to record the first operation based on the target operation type of the first operation. In addition, it is also necessary to determine the specific location for performing the first operation.
[0214] Therefore, the rich text editor also needs to determine the operation position corresponding to the first operation in the rich text content. The operation position can be, for example, the position of the cursor or the position selected by the cursor, or the operation position can also be row coordinates or column coordinates. The specific implementation method of the operation position can be selected and set according to actual needs, as long as the operation position can indicate the user's operation position in the rich text content.
[0215] S203: The rich text editor generates instruction information according to the operation information, the target operation type, and the operation location.
[0216] In this step, the rich text editor may generate instruction information based on the determined operation information, target operation type, and operation location, wherein the instruction information is used to instruct to update the data structure corresponding to the rich text content. In one possible implementation, the rich text editor may, for example, abstractly encapsulate the operation information, target operation type, and operation location to generate the instruction information.
[0217] It should be noted that the operation information, target operation type, and operation location are determined based on the first instruction and then encapsulated into instruction information. This is because, on the one hand, the encapsulated instruction information is in a format recognizable by the rich text editor, and on the other hand, the encapsulated instruction information can include complete information required to execute the first operation. Therefore, generating the instruction information in this embodiment can ensure that the rich text editor can effectively complete the execution of the first operation based on the instruction information.
[0218] S204: The rich text editor updates the data structure corresponding to the rich text content according to the instruction information.
[0219] Based on the above embodiment, it can be determined that when a user selects to display a certain rich text content, the data structure corresponding to the rich text content has already been generated. Since the current instruction information instructs to perform a corresponding operation on a specified operation location in the rich text content, it can be understood that the data structure of the rich text editor needs to be updated accordingly. Therefore, after the rich text editor in this embodiment generates the instruction information, it can update the data structure corresponding to the rich text content according to the instruction information.
[0220] Updating the data structure may include, for example, adding, deleting, or modifying corresponding nodes in the data structure, or modifying corresponding node attributes.
[0221] S205. The rich text editor renders and displays the rich text content according to the updated data structure.
[0222] The data structure is the underlying data. For users, updates to the data structure are invisible, and the data structure controls the specific display of rich text content in the rich text editor.
[0223] Therefore, after the data structure of the rich text content is updated, the rich text editor can render and display the rich text content corresponding to the modified data structure according to the updated data structure, thereby completing the first operation on the rich text content displayed in the rich text editor.
[0224] For example, if the first operation is to set the bold attribute, then the bold attribute can be added to the corresponding position in the data structure, and then the corresponding position of the rich text content displayed according to the modified data structure is bolded. The implementation of the remaining operations is similar and will not be repeated here.
[0225] S206: The rich text editor feeds back information to the second rendering unit.
[0226] S207: The second rendering unit renders and displays the graphical user interface.
[0227] The rich text editor reports a successful update of the rich text content to the second rendering unit, which then renders and displays a new graphical user interface to help the user visually confirm the rich text editing status. For example, the second rendering unit can re-render the display of the corresponding controls to display the new graphical user interface.
[0228] For example, you can combine Figure 7 To understand, Figure 7 You can understand the diagram of the memo interaction interface on the Android side. Figure 7 The interactive interface is similar to the interactive interface of the memo in the PC segment introduced above, so I will not repeat it here.
[0229] like Figure 7 As shown, assuming that the rich text content displayed in the rich text editor is "Test Document.", and assuming that in the rich text editor area, the cursor is moved to select "Test Document.", and assuming that the user clicks Figure 7 Bold key "B" shown.
[0230] Afterwards, the instruction processing unit sends a first instruction to the rich text editor. The first instruction instructs to perform a bold operation on the rich text content displayed in the rich text editor, but the first instruction does not indicate the specific operation location in the rich text content. The rich text editor can then determine the operation information of the first operation, such as the instruction information for setting the bold attribute, and can determine the target operation type of the first operation, such as the target operation type is to set the attribute, and can determine the operation location corresponding to the first operation, which can be, for example, Figure 7 The cursor selected position in the
[0231] The rich text editor can then generate instruction information, for example, by abstractly encapsulating the relevant information corresponding to the first operation. The rich text editor updates the data structure corresponding to "Test Document." according to the instruction information, for example, by adding attributes to the node corresponding to "Test Document." The rich text editor then renders and displays "Test Document." according to the updated data structure, referring to Figure 7 You can be sure that "Test Document." is now displayed in bold.
[0232] And, the rich text editor feeds back the information to the second rendering unit, and the second rendering unit can display the bold key "B" as the selected style, wherein the selected style can be, for example, Figure 7 The selection box display shown in the figure may also be highlighted, bolded, etc. This embodiment does not limit the specific implementation method of the selected style, which can be selected and set according to actual needs.
[0233] It should also be noted that the rich text editor in the embodiment of the present application can be applied to the first application in at least two platforms. For example, if the first application is a memo, then the rich text editor can be applied to the memo application in the Android platform, and can also be applied to the memo application in the Windows platform. Therefore, the rich text editor in this embodiment can be applied across platforms in applications on different platforms.
[0234] In this embodiment, the rich text editor receives a first instruction, which is used to instruct the execution of a first operation on the rich text content displayed in the rich text editor. Based on the first instruction, the rich text editor determines the operation information corresponding to the first operation, the target operation type of the first operation, and the operation position corresponding to the first operation in the rich text content. The rich text editor generates instruction information based on the operation information, the target operation type, and the operation position. Based on the instruction information, the rich text editor updates the data structure corresponding to the rich text content. Based on the updated data structure, the rich text editor renders and displays the rich text content. Through the first instruction, the rich text editor determines the relevant information of the first operation indicated by the first instruction, and encapsulates the relevant information to obtain instruction information that the rich text editor can recognize, and the instruction information includes complete information required for the first operation. Afterwards, the rich text editor updates the data structure of the rich text content according to the indication information, and then renders and displays the rich text content according to the updated data structure, thereby effectively performing the first operation on the rich text content. Therefore, the rich text editor in this embodiment can effectively implement the functions of the rich text editor, and the rich text editor in this embodiment can be applied to the first application in at least two platforms, thereby effectively realizing the cross-platform application of the rich text editor to ensure that a consistent rich text editing experience is provided on different platforms.
[0235] Based on the above embodiments, Figure 8 The specific implementation of the rich text editor performing the first operation on the rich text content displayed in the rich text editor according to the first instruction is further introduced in detail.
[0236] like Figure 8 As shown, an embodiment of the present application provides a rich text processing method, which is applied to a rich text editor. The rich text editor includes a plug-in unit, a data processing unit, an execution unit, a recording unit and a first rendering unit. In this embodiment, the plug-in unit can be understood as the above-mentioned Figure 3 The plug-in mechanism in the introduced framework, the execution unit can be understood as the behavior control introduced above, the data processing unit can be understood as the data model introduced above, the recording unit can be understood as the historical record introduced above, and the first rendering unit can be understood as the rendering mechanism introduced above.
[0237] The following combination Figure 8 Provide detailed information, such as Figure 8 As shown, the method specifically includes the following steps:
[0238] S301: A plug-in unit determines, based on a first instruction, a target plug-in corresponding to the first instruction. The target plug-in obtains, from data carried by the first instruction, operation information corresponding to a first operation. The target plug-in determines, from among a plurality of preset operation types, a target operation type corresponding to the first instruction.
[0239] In this embodiment, there are multiple plug-ins in the plug-in unit, where different plug-ins are used to implement different functions. For example, a bold plug-in is provided for the bold function, an italic plug-in is provided for the italic setting function, and a table processing plug-in is provided for the insert table function. Alternatively, it is also possible that the bold function and the italic setting function described above correspond to the attribute setting plug-in. Therefore, it can be understood that in the actual implementation process, the specific implementation method of the plug-in can be selected and set according to actual needs, as long as it is ensured that for each function, there is a corresponding plug-in to implement the function.
[0240] After the rich text editor receives the first instruction, for example, it can first determine the target plug-in corresponding to the first instruction in the plug-in unit. For example, in the above example, assuming that the first instruction is used to instruct bolding, the corresponding target plug-in can be determined to be a bold plug-in. Alternatively, it is also possible to determine that the corresponding target plug-in is a property setting plug-in. Therefore, the specific target plug-in corresponding to each instruction can depend on the specific plug-in setting method in the plug-in unit.
[0241] Among them, by setting different plug-ins for different functions and implementing the corresponding functions through multiple plug-ins, it can be ensured that the processing between each function is independent of each other. When it is necessary to update and iterate certain functions, it is only necessary to process the corresponding plug-in, thereby effectively improving the flexibility of adjusting and controlling the rich text editor.
[0242] It can also be understood that in this embodiment, different plug-ins are set for different functions, but what the rich text editor outputs to the outside is the comprehensive capabilities of the combination of various plug-ins, that is, each plug-in in the rich text editor supports corresponding functions respectively, so that the rich text editor can appear to support various editing operations, thereby effectively ensuring the rich text editor's support for editing needs.
[0243] After the plug-in unit determines the target plug-in, the first instruction may be processed by the target plug-in. For example, the target plug-in may first obtain operation information corresponding to the first operation from the data carried by the first instruction.
[0244] Here is an example. Suppose the first instruction is used to instruct to bold the text. Then the first instruction may include a field of "bold: true". This field is used to indicate that the first instruction is used to indicate a bold operation. Then, for example, this field can be obtained from the first instruction and used as operation information corresponding to the first operation.
[0245] In one possible implementation, different plug-ins are provided for different functions in this embodiment, and the plug-in for each function can obtain data associated with the function implemented by itself in the data carried by the first instruction, thereby obtaining operation information corresponding to the first operation. For example, a plug-in for implementing the bold function can obtain fields related to "bold" to obtain operation information corresponding to the bold operation. For another example, a plug-in for implementing the font color setting function can obtain fields related to "color" to obtain operation information corresponding to the font color setting operation.
[0246] After determining the target plug-in, the target operation type corresponding to the first instruction can be determined through the target plug-in from multiple preset operation types. The target operation type corresponding to the first instruction is actually the target operation type of the first operation, because the first instruction and the first operation are corresponding.
[0247] In one possible implementation, for example, a correspondence between plugins and operation types can be set, and the target operation type corresponding to the first instruction can be determined by using the target plugin corresponding to the first instruction. Alternatively, a correspondence between various possible instructions and operation types can be set, and the target operation type corresponding to the first instruction can be determined by processing through the target plugin.
[0248] S302: The plug-in unit sends an identification instruction to the data processing unit.
[0249] It is understandable that after determining the operation information corresponding to the first operation and the target operation type of the first operation, the plug-in unit needs to determine the operation position corresponding to the first operation in order to specifically implement the first operation. Therefore, in one possible implementation, the plug-in unit in the rich text editor can send an identification instruction to the data processing unit, where the identification instruction is used to instruct the data processing unit to determine the operation position corresponding to the first operation.
[0250] S303: The data processing unit responds to the recognition instruction and determines the operation position corresponding to the first operation.
[0251] In this step, the data processing unit can determine the operation position corresponding to the first operation in response to the recognition instruction. In a possible implementation, the operation position corresponding to the first operation can be, for example, the cursor position or the selection area position in the rich text editor.
[0252] In a possible implementation, when determining the operation position, the data unit can determine whether there is selected content in the rich text content in response to the recognition instruction. If there is selected content in the rich text content, the selection area position corresponding to the selected content is determined as the operation position; or, if there is no selected content in the rich text content, the cursor position in the first rich text is determined as the operation position.
[0253] In a possible implementation, the cursor position and the selection area position can be represented by, for example, path (path) and offset (offset). Among them, path is an array of the number type. When the user selects the rich text content, the values it contains represent from the start position of the selection area to the end position of the selection area. The start position of the selection area is represented starting from 0, and offset represents the offset of the cursor or the selection area relative to the start position of the text.
[0254] For example, it can be combined Figure 7 to understand. Assume that the current cursor is after the character "试" in "测试文档。". Since there is no current selection area, when there is no selection area, the corresponding path is [0,0]. And in the current example, the offset of the cursor position relative to the start position of the text is 2, then the operation position in the current example can be represented as path [0,0] and offset 2.
[0255] For another example, assume that the current cursor is after the character "档" in "测试文档。". Similarly, since there is no current selection area, the corresponding path is [0,0]. And in the current example, the offset of the cursor position relative to the start position of the text is 4, then the operation position in the current example can be represented as path [0,0] and offset 4.
[0256] For another example, assume that the two characters "文档" in "测试文档。" are selected. Since two characters are selected, the corresponding path is [0,2]. And in the current example, the offset of the selection area position relative to the start position of the text is 2, then the operation position in the current example can be represented as path [0,2] and offset 2.
[0257] For another example, assume that the four characters "test document" in the current "test document." are selected. Since four characters are selected, the corresponding path is [0, 4]. And in the current example, the offset of the selection position relative to the start position of the text is 0, so the operation position in the current example can be represented as path [0, 4] and offset 0.
[0258] S304. The data processing unit sends the operation position corresponding to the first operation to the plugin unit.
[0259] After determining the operation position corresponding to the first operation, the data processing unit can send the operation position to the plugin unit so that the plugin unit can determine the specific operation position.
[0260] S305. The plugin unit sends the operation information, the target operation type, and the operation position to the execution unit.
[0261] After receiving the operation position sent by the data processing unit, the plugin unit has all the information for executing the first operation. Specifically, the plugin unit has determined the operation information of the first operation and the target operation type corresponding to the first operation, and currently has also determined the operation position corresponding to the first operation.
[0262] However, the data processing unit cannot directly process these information and still needs to be encapsulated by the execution unit. Therefore, in this embodiment, the plugin unit can send the operation information, the target operation type, and the operation position to the execution unit.
[0263] S306. The execution unit generates an indication message according to the operation information, the target operation type, and the operation position.
[0264] After receiving the operation information, the target operation type, and the operation position, the execution unit can, for example, encapsulate these information to generate an indication message that can be recognized by the data processing unit. Then it can be understood that the indication message actually includes the operation information, the target operation type, and the operation position.
[0265] [[ID=
[0269] In one possible implementation, the data processing unit may first determine the target node corresponding to the operation position in the data structure according to the indication information, and then perform an update operation corresponding to the target operation type and the operation information on the target node according to the indication information.
[0270] For example, in the example above, assuming the rich text content is "Test Document." and the first action is to bold the selected "Test Document.", the first action's operation information indicates bolding the rich text content, and the target operation type is abstracted by the plug-in unit as "Set Properties." Because the currently selected content is "Test Document.", based on the above description, the operation position corresponding to the first action can be represented as a path of [0,5] and an offset of 0.
[0271] Based on the operation position, for example, the target node corresponding to the content of "test document." can be determined in the data structure, and then bold attribute information can be added to the target node to implement the update operation.
[0272] For example, the original data structure corresponding to the rich text content of "Test Document" is:
[0273]
[0274] After adding the bold attribute, the updated data structure can be expressed as:
[0275]
[0276]
[0277] Among them, bold represents the bold attribute of the target node. After updating, it is set to true to indicate that the rich text content "Test document." is bolded.
[0278] And in a possible implementation, since the first rendering unit is implemented based on Web capabilities, for example, the data structure corresponding to the rich text content can also be processed into an HTML format for Web expression.
[0279] For example, the initial rich text content "Test document." is rendered in HTML format by the first rendering unit as follows:
[0280] <p class="nb ai h_n">
[0281] <h-text>
[0282] <font hsize="16"> Test documentation.< / font>
[0283] < / h-text>
[0284]
[0285] When the bold operation is performed on "Test Document.", the corresponding data structure of "Test Document." is updated. Then, the HTML format of the bold "Test Document." described above is:
[0286] <p class="nb ai h_n">
[0287] <h-text>
[0288] <font class="la"hsize="16"> Test documentation.< / font>
[0289] < / h-text>
[0290]
[0291] Among them, class="La" is a bold positioning style, that is, the "bold":true attribute is class="La" in the rendering layer, and "La" is a pre-defined CSS style, which can be expressed as:
[0292] La{
[0293] font-weight:700;
[0294] }
[0295] The following describes possible implementations of the preset operation types in conjunction with FIG. 9 , and also describes, in a diagrammatic manner, how the data type updates corresponding to each operation type.
[0296] The preset operation types may include the following 9 types: insert node, split node, insert selection, move node, insert text, merge nodes, set attributes, remove node, and remove text.
[0297] Inserting a node means inserting a new node into the data structure, for example, Figure 9A Assuming that the first operation is to insert the italicized text "Test Test" after the text content of "Test Document.", then the update of the data structure is to insert a new node corresponding to the text content of "Test Test" after the node corresponding to the text content of "Test Document.", and its attribute is bold.
[0298] And, splitting a node means splitting an existing node in a data structure into multiple nodes, for example, Figure 9B ,Assuming that the first operation is to set the "test" in "test document." to bold, then the update of the data structure is to split the "test document." node into two independent nodes, one of which is "test" and has the attribute bold, and the other is "document.".
[0299] Also, inserting a selection means selecting content in the rich text content with the mouse to obtain at least one selection. This operation does not change the data structure.
[0300] And, moving a node is to move the specific content in the rich text content to change the position of the corresponding node in the data structure, for example, referring to Figure 9C , assuming that the first operation is to move the bold "test" to the back of "document.", then the data structure in the form of a tree structure is updated as follows Figure 9C shown.
[0301] And, inserting text means inserting text into a node. This operation only changes the content of the node and does not change the tree structure. For example, refer to Figure 9D , assuming that the current first operation is to enter "first" before "test document.", the data structure in the form of a tree structure is updated as follows Figure 9D shown.
[0302] Also, merging nodes means merging two independent nodes into one node, for example, Figure 9E , assuming that the current rich text content includes the bold "test" and the non-bold "document.", and the current first operation is to cancel the bold effect of the text "test", then when the bold "test" is unbolded, its tree structure data structure is updated as follows Figure 9E As shown, the original two nodes are merged into one node.
[0303] And, setting attributes is to set attributes for the corresponding content in the rich text content, and the update reflected in the data structure is to add corresponding attributes to the corresponding nodes, such as reference Figure 9F Assuming the first operation is to set the bold attribute for the "test document." node, the data structure update is to add the bold attribute to the "test document." node.
[0304] And, removing a node means that when the corresponding content in the text is deleted, the corresponding node in the data structure needs to be deleted. For example, refer to Figure 9G , when the first operation is to delete the bold "test" in "test document." and keep "document.", the data structure in the tree structure form is updated as follows Figure 9G As shown, the bold "Test" text node has been removed.
[0305] And, removing text means removing part of the text in the node. This operation only changes the content of the node, without changing the tree structure. For example, refer to Figure 9H , assuming that the first operation is to delete "document." in "test document.", the data structure in the tree structure is updated as follows Figure 9H shown.
[0306] The nine types of operations described above can also be understood as nine atomic operations. In actual implementation, the specific division of operation types and the update method of the data structure for each operation type can be selected and set according to actual needs, and this embodiment does not limit this.
[0307] S309: The data processing unit sends instruction information to the recording unit.
[0308] After the data processing unit updates the data structure corresponding to the rich text content according to the instruction information, it only needs to render the rich text content according to the updated data structure.
[0309] In a possible implementation, in order to facilitate operation backtracking, the rich text editor in this embodiment further includes a recording unit. Before rendering, the data processing unit may also send instruction information to the recording unit.
[0310] S310: The recording unit receives and stores the instruction information.
[0311] After receiving the indication information, the recording unit may store the indication information in a first stack, where the first stack is used to store indication information corresponding to completed operations.
[0312] Among them, the first stack can be understood as an undo stack. When the user needs to undo an operation, he can obtain the instruction information from the top of the first stack, and undo the update operation corresponding to the instruction information in the data structure corresponding to the rich text content according to the instruction information to realize the undoing of the corresponding instruction.
[0313] In an optional implementation, because the rich text editor in this embodiment can be cross-platform, for example, the information in the first stack can be synchronized in various devices through the cloud, so that different users can implement collaborative editing in various devices.
[0314] For example, in the example described above, suppose the user first inputs "test document." and then "document.", which means two input operations are performed. Then, the indication information corresponding to these two input operations can be stored in the first stack, for example, it can be expressed as:
[0315]
[0316]
[0317] Furthermore, in the above example, the content "Test document." is bolded. Then, the instruction information corresponding to the bolding operation can also be stored in the first stack, for example, it can be represented as:
[0318]
[0319]
[0320] Based on the first stack described above, it can be understood that in this embodiment, various rich text operations are divided into several preset operation types, which can facilitate the recording and management of operations, thereby improving the processing efficiency and standardization of the rich text editor.
[0321] S311. The first rendering unit renders and displays the rich text content according to the updated data structure.
[0322] After storing the indication information corresponding to the operation in the first stack, the first rendering unit can render and display the rich text content according to the updated data structure. Because the updated data structure already includes the update of the corresponding content, the rich text content after rendering and display can show the changes corresponding to the first operation.
[0323] In this embodiment, multiple sub-units in the rich text editor are combined with each other, wherein the plug-in unit is used to determine the operation data corresponding to the first operation, the data processing unit can determine the operation location, and then the plug-in unit can send the information required for the first operation to the execution unit, encapsulated as instruction information that can be recognized by the data processing unit, and then the data processing unit updates the data structure according to the instruction information, and the recording unit records each update instruction, and finally the first rendering unit renders and displays the updated rich text content. Through the collaboration of the above five sub-units, the rich text editor can effectively realize various possible rich text editing functions.
[0324] Another embodiment of the present application provides a rich text processing method. After the rich text editor stores the instruction information in the first stack of the recording unit, the rich text processing method provided by the present application may further include:
[0325] When the rich text editor receives an undo instruction, the plug-in unit can obtain the indication information at the top of the first stack; the plug-in unit undoes the update operation corresponding to the indication information at the top of the stack in the data structure corresponding to the rich text content; renders and displays the rich text content according to the data structure after the update operation is undone; and stores the indication information at the top of the stack in the second stack, which is used to store the indication information corresponding to the undone operation.
[0326] For example: After the rich text content "Test document." is bolded, the indication information is stored in the first stack undos of the recording unit. At this time, the second stack redos of the recording unit is empty. When the rich text editor receives an undo instruction, since the previous operation of the undo instruction is a bold operation, the indication information of the bold operation is at the top of the first stack undos. The plug-in unit obtains the indication information. Since the indication information has been abstractly encapsulated by the execution unit, the plug-in unit can undo the update operation corresponding to the indication information in the data structure corresponding to the rich text content. Therefore, the data structure corresponding to "Rich text editor." is restored to the state before the operation, and "bold":true does not exist in the data structure. According to the data structure after the update operation is undone, the non-bold "Test document." is rendered and displayed. After the undo action is completed, the indication information at the top of the first stack undos needs to be stored in the second stack redos. The second stack redos is used to store the indication information corresponding to the undone operation.
[0327] In this embodiment, when the rich text editor receives an undo instruction, the plug-in unit retrieves the instruction information stored in the first stack of the recording unit and, using the operation information, target operation type, and operation location contained in the instruction information, undoes the update to the data structure. Due to the first-in, last-out nature of the stack, the undo operation is performed sequentially for the most recent operation. A second stack stores the instruction information corresponding to the undone operation. When the most recent undo operation is desired, the instruction information at the top of the second stack can be used to redo the operation and restore the undone operation.
[0328] In the above embodiment, the PC side memo is used as an example for introduction. The following description is based on the first application being the Android side memo. Figure 10 As shown, the Android-side memo includes a note list, a rich text editor area, and a user event response area. When the user selects "Here is the test document setting" in the rich text editor area and clicks "B", which is the bold button, in the user response area, the Android-side memo sends a first instruction to the rich text editor to instruct the setting of the font to be bold; based on the received first instruction, the rich text editor determines that the corresponding operation information is to instruct the font to be bold, the target operation type is bold font, and the corresponding operation position is the selection area of "Here is the test document setting", and generates instruction information based on the operation information, target operation type, and operation position; the rich text editor updates the data structure corresponding to "Here is the test document setting" based on the instruction information, sets the bold attribute to true, and then renders and displays the updated data structure in the rich text editor area. At this time, "Here is the test document setting" is displayed in bold, and because the Android-side memo receives feedback information sent by the rich text editor, the "B" button in the user event response area is displayed as selected style.
[0329] It should be noted that in the above embodiments, the rich text editor used in the rich text processing method is developed based on a web view (webview). Because webview exists on all platforms, it can ensure that the rich text editor can be used across platforms. At the same time, based on the collaboration of the various units in the rich text editor introduced above, the rich text editor provided in this application can be used across platforms and effectively implement various required rich text editing functions.
[0330] Based on the above-described embodiments, Figure 11 A complete introduction to the rich text processing method provided by this application is given. Figure 11 A schematic diagram of the processing process of the rich text processing method provided in an embodiment of the present application.
[0331] like Figure 11 As shown, the first application may include a second rendering unit, an event processing unit, an instruction processing unit, and a rich text editor. The rich text editor may include a first rendering unit, a recording unit, a plug-in unit, an execution unit, and a data processing unit.
[0332] The process includes:
[0333] 1. When the first application is started, the second rendering unit renders the graphical user interface of the first application.
[0334] 2. The second rendering unit sends an initialization instruction to the rich text editor.
[0335] 3. The first rendering unit in the rich text editor initializes the data structure of the rich text content in the rich text editor according to the initialization instruction.
[0336] 4. The second rendering unit sends a startup instruction to the instruction processing unit, where the startup instruction is used to instruct the instruction processing unit to start.
[0337] 5. When the second rendering unit detects a user operation, it determines a first event triggered by the user operation.
[0338] 6. The second rendering unit sends the first event to the event processing unit.
[0339] 7. The event processing unit determines the operation intention corresponding to the first event.
[0340] 8. The event processing unit sends the operation intention to the instruction processing unit.
[0341] 9. The instruction processing unit determines a first instruction corresponding to the operation intention.
[0342] 10. The instruction processing unit sends a first instruction to the plug-in unit of the rich text editor.
[0343] 11. The plug-in unit obtains operation information corresponding to the first operation and a target operation type corresponding to the first instruction according to the first instruction.
[0344] 12. The plug-in unit sends an identification instruction to the data processing unit.
[0345] 13. The data processing unit determines the operation position corresponding to the first operation according to the recognition instruction.
[0346] 14. The data processing unit sends the operation position corresponding to the first operation to the plug-in unit.
[0347] 15. The plug-in unit sends the operation location, target operation type, and operation location to the execution unit.
[0348] 16. The execution unit generates instruction information according to the operation location, target operation type and operation location.
[0349] 17. The execution unit sends instruction information to the data processing unit.
[0350] 18. The data processing unit updates the data structure according to the instruction information.
[0351] 19. The data processing unit sends instruction information to the recording unit.
[0352] 20. The recording unit stores instruction information to record the user's operation.
[0353] 21. The recording unit notifies the first rendering unit that the operation recording is completed.
[0354] 22. The first rendering unit renders and displays the rich text content after the first operation according to the updated data structure.
[0355] 23. The first rendering unit sends feedback information to the second rendering unit to indicate that the processing of the first instruction is complete.
[0356] 24. The second rendering unit renders and displays the control changes in the graphical user interface.
[0357] The specific implementation of each operation in this embodiment can refer to the variations of the above embodiment and will not be repeated here. In summary, the rich text processing method provided in the embodiment of the present application can provide a cross-platform rich text editor to ensure that the same rich text editing experience can be achieved on different platforms, while also avoiding the waste of resources caused by developing for multiple platforms separately.
[0358] Figure 12This is a schematic diagram of the structure of the rich text processing device provided in the embodiment of the present application. Figure 12 As shown, the device 120 includes: a transmission module 1201 , a determination module 1202 and a processing module 1203 .
[0359] A transmission module 1201 is configured to enable the rich text editor to receive a first instruction, where the first instruction is used to instruct the execution of a first operation on rich text content displayed in the rich text editor;
[0360] Determination module 1202, configured for the rich text editor to determine, according to the first instruction, operation information corresponding to the first operation, a target operation type of the first operation, and an operation position corresponding to the first operation in the rich text content;
[0361] Processing module 1203, configured for the rich text editor to generate instruction information according to the operation information, the target operation type, and the operation location;
[0362] The processing module 1203 is further configured to enable the rich text editor to update the data structure corresponding to the rich text content according to the instruction information;
[0363] The processing module 1203 is further configured to enable the rich text editor to render and display the rich text content according to the updated data structure;
[0364] The rich text editor is applied to the first application in at least two platforms.
[0365] In a possible design, the rich text editor includes a plug-in unit and a data processing unit, and the plug-in unit includes multiple plug-ins;
[0366] The determining module 1202 is specifically configured to:
[0367] The plug-in unit determines, according to the first instruction, a target plug-in corresponding to the first instruction from among the multiple plug-ins;
[0368] The plug-in unit obtains, through the target plug-in, operation information corresponding to the first operation from the data carried by the first instruction;
[0369] The plug-in unit determines, through the target plug-in, a target operation type corresponding to the first instruction from a plurality of preset operation types;
[0370] The plug-in unit sends an identification instruction to the data processing unit;
[0371] The data processing unit determines an operation position corresponding to the first operation in response to the recognition instruction.
[0372] In one possible design, the determining module 1202 is specifically configured to:
[0373] The data processing unit determines, in response to the recognition instruction, whether selected content exists in the rich text content;
[0374] If there is selected content in the rich text content, the selection area position corresponding to the selected content is determined as the operation position; or if there is no selected content in the rich text content, the cursor position in the first rich text is determined as the operation position.
[0375] In one possible design, the transmission module 1201 is further configured to:
[0376] After the data processing unit determines the operation position corresponding to the first operation in response to the recognition instruction, the data processing unit sends the operation position corresponding to the first operation to the plug-in unit.
[0377] In a possible design, the rich text editor further includes an execution unit;
[0378] The processing module 1203 is specifically configured to:
[0379] The plug-in unit sends the operation information, the target operation type, and the operation position to the execution unit;
[0380] The execution unit generates indication information according to the operation information, the target operation type, and the operation position.
[0381] In one possible design, the data structure corresponding to the rich text content includes multiple nodes;
[0382] The processing module 1203 is specifically configured to: the execution unit sends the instruction information to the data processing unit;
[0383] The data processing unit determines, in the data structure, a target node corresponding to the operation position according to the indication information;
[0384] The data processing unit performs an update operation corresponding to the target operation type and the operation information on the target node according to the indication information.
[0385] In a possible design, the rich text editor further includes a first rendering unit;
[0386] The processing module 1203 is specifically configured to:
[0387] The first rendering unit obtains the target node from the updated data structure;
[0388] The first rendering unit renders the first content corresponding to the target node in the rich text content according to the target node;
[0389] The rich text content is displayed according to the rendered first content and the remaining content in the rich text content except the first content.
[0390] In a possible design, the rich text editor further includes a recording unit;
[0391] The processing module 1203 is further configured to:
[0392] After the rich text editor updates the data structure corresponding to the rich text content according to the indication information, the rich text editor stores the indication information in a first stack, where the first stack is used to store indication information corresponding to completed operations.
[0393] In one possible design, the processing module 1203 is further configured to:
[0394] After the rich text editor stores the indication information in the first stack, when the rich text editor receives a cancel instruction, the plug-in unit obtains the indication information at the top of the first stack;
[0395] The plug-in unit cancels the update operation corresponding to the instruction information at the top of the stack in the data structure corresponding to the rich text content;
[0396] Rendering and displaying the rich text content according to the data structure after the undo update operation;
[0397] The indication information at the top of the stack is stored in a second stack, where the second stack is used to store indication information corresponding to the revoked operation.
[0398] In a possible design, the first application further includes a second rendering unit and an instruction processing unit;
[0399] The processing module 1203 is further configured to:
[0400] Before the rich text editor receives the first instruction, when the first application is started, the second rendering unit renders and displays a graphical user interface of the first application and starts the instruction processing unit, the graphical user interface including a list of multiple rich text contents;
[0401] When the second rendering unit detects a display operation for any rich text content in the list, sending an initialization instruction to the rich text editor;
[0402] The rich text editor generates a data structure of rich text content corresponding to the display operation according to the initialization instruction.
[0403] In a possible design, the first application further includes an event processing unit;
[0404] The processing module 1203 is further configured to:
[0405] Before the rich text editor receives the first instruction, when the second rendering unit detects a user operation, determining a first event triggered by the user operation and sending the first event to the event processing unit;
[0406] The event processing unit determines the operation intention corresponding to the first event and sends the operation intention to the instruction processing unit;
[0407] The instruction processing unit obtains the first instruction matching the operation intention and sends the first instruction to the plug-in unit.
[0408] In a possible design, the rich text editor is developed based on a web page view.
[0409] The device provided in this embodiment can be used to execute the technical solution of the above method embodiment. Its implementation principle and technical effects are similar and will not be described in detail in this embodiment.
[0410] The rich text processing method provided in the embodiment of the present application can be applied to electronic devices with communication functions. The electronic devices include terminal devices. The specific device form of the terminal device can refer to the above related descriptions and will not be repeated here.
[0411] The present application provides a terminal device, which can be referred to Figure 13 To understand, Figure 13 A schematic diagram of the hardware structure of the terminal device provided in an embodiment of the present application.
[0412] like Figure 13 As shown, the terminal device 130 includes: a processor 1301 and a memory 1302; the memory 1302 stores computer-executable instructions; the processor 1301 executes the computer-executable instructions stored in the memory 1302, so that the terminal device 130 executes the above method.
[0413] When the memory 1302 is independently provided, the terminal device further includes a bus 1203 for connecting the memory 1202 and the processor 1301 .
[0414] The present embodiment provides a chip. The chip includes a processor configured to invoke a computer program stored in a memory to execute the technical solution of the above embodiment. The implementation principles and technical effects are similar to those of the above-mentioned related embodiments and will not be further described here.
[0415] The embodiments of the present application also provide a computer-readable storage medium. The computer-readable storage medium stores a computer program. When the computer program is executed by a processor, the above-mentioned method is implemented. The methods described in the above embodiments can be implemented in whole or in part by software, hardware, firmware, or any combination thereof. If implemented in software, the functions can be stored as one or more instructions or codes on a computer-readable medium or transmitted on a computer-readable medium. Computer-readable media can include computer storage media and communication media, and can also include any medium that can transfer a computer program from one place to another. The storage medium can be any target medium that can be accessed by a computer.
[0416] In one possible implementation, a computer-readable medium may include RAM, ROM, compact disc read-only memory (CD-ROM) or other optical disc storage, magnetic disk storage or other magnetic storage devices, or any other medium intended to carry or store the desired program code in the form of instructions or data structures and accessible by a computer. Moreover, any connection is appropriately referred to as a computer-readable medium. For example, if a coaxial cable, fiber optic cable, twisted pair, digital subscriber line (DSL) or wireless technology (such as infrared, radio and microwave) is used to transmit software from a website, server or other remote source, the coaxial cable, fiber optic cable, twisted pair, DSL or wireless technology such as infrared, radio and microwave are included in the definition of medium. Disk and optical disc as used herein include optical disc, laser disc, optical disc, digital versatile disc (DVD), floppy disk and Blu-ray disc, where disks generally reproduce data magnetically, while optical discs reproduce data optically using lasers. Combinations of the above should also be included within the scope of computer-readable media.
[0417] An embodiment of the present application provides a computer program product, which includes a computer program. When the computer program is executed, the computer executes the above method.
[0418] The embodiments of the present application are described with reference to the flowcharts and / or block diagrams of the methods, devices (systems), and computer program products according to the embodiments of the present application. It should be understood that each process and / or box in the flowchart and / or block diagram, as well as the combination of the processes and / or boxes in the flowchart and / or block diagram, can be implemented by computer program instructions. These computer program instructions can be provided to a processing unit of a general-purpose computer, a special-purpose computer, an embedded processor, or other programmable device to produce a machine, so that the instructions executed by the processing unit of the computer or other programmable data processing device generate instructions for implementing the steps in the process. Figure 1 a process or multiple processes and / or boxes Figure 1 A device that provides the functions specified in a block or multiple blocks.
[0419] The above specific implementation methods further illustrate the objectives, technical solutions and beneficial effects of the present invention in detail. It should be understood that the above are only specific implementation methods of the present invention and are not intended to limit the scope of protection of the present invention. Any modifications, equivalent replacements, improvements, etc. made on the basis of the technical solutions of the present invention should be included in the scope of protection of the present invention.
Claims
1. A rich text processing method, characterized in that: Applied to a first application, wherein the first application includes a rich text editor, the method includes: The rich text editor receives a first instruction, where the first instruction is used to instruct to perform a first operation on the rich text content displayed in the rich text editor; The rich text editor determines, according to the first instruction, operation information corresponding to the first operation, a target operation type of the first operation, and an operation position corresponding to the first operation in the rich text content; The rich text editor generates instruction information according to the operation information, the target operation type, and the operation position; The rich text editor updates the data structure corresponding to the rich text content according to the instruction information; The rich text editor renders and displays the rich text content according to the updated data structure; wherein the rich text editor is applied to the first application in at least two platforms; The rich text editor includes a plug-in unit and a data processing unit, wherein the plug-in unit includes multiple plug-ins; wherein different plug-ins are used to implement different functions; The rich text editor determines, according to the first instruction, operation information corresponding to the first operation, a target operation type of the first operation, and an operation position corresponding to the first operation in the rich text content, including: The plug-in unit determines, according to the first instruction, a target plug-in corresponding to the first instruction from among the multiple plug-ins; The plug-in unit obtains, through the target plug-in, operation information corresponding to the first operation from the data carried by the first instruction; The plug-in unit determines, through the target plug-in, a target operation type corresponding to the first instruction from a plurality of preset operation types; The plug-in unit sends an identification instruction to the data processing unit; The data processing unit determines an operation position corresponding to the first operation in response to the recognition instruction.
2. The method according to claim 1, characterized in that The data processing unit determines, in response to the recognition instruction, an operation position corresponding to the first operation, including: The data processing unit determines, in response to the recognition instruction, whether selected content exists in the rich text content; If there is selected content in the rich text content, the selection area position corresponding to the selected content is determined as the operation position; or if there is no selected content in the rich text content, the cursor position in the rich text content is determined as the operation position.
3. The method according to claim 1 or 2, characterized in that After the data processing unit determines the operation position corresponding to the first operation in response to the recognition instruction, the method further includes: The data processing unit sends the operation position corresponding to the first operation to the plug-in unit.
4. The method according to claim 3, characterized in that The rich text editor also includes an execution unit; The rich text editor generates instruction information according to the operation information, the target operation type, and the operation location, including: The plug-in unit sends the operation information, the target operation type, and the operation position to the execution unit; The execution unit generates indication information according to the operation information, the target operation type, and the operation position.
5. The method according to any one of claims 1 to 2 and 4, characterized in that: The data structure corresponding to the rich text content includes multiple nodes; The rich text editor updates the data structure corresponding to the rich text content according to the instruction information, including: The execution unit sends the instruction information to the data processing unit; The data processing unit determines, in the data structure, a target node corresponding to the operation position according to the indication information; The data processing unit performs an update operation corresponding to the target operation type and the operation information on the target node according to the indication information.
6. The method according to claim 5, characterized in that The rich text editor also includes a first rendering unit; The rich text editor renders and displays the rich text content according to the updated data structure, including: The first rendering unit obtains the target node from the updated data structure; The first rendering unit renders the first content corresponding to the target node in the rich text content according to the target node; The rich text content is displayed according to the rendered first content and the remaining content in the rich text content except the first content.
7. The method according to any one of claims 1-2, 4 and 6, characterized in that The rich text editor also includes a recording unit; After the rich text editor updates the data structure corresponding to the rich text content according to the instruction information, the method further includes: The rich text editor stores the indication information in a first stack, where the first stack is used to store indication information corresponding to completed operations.
8. The method according to claim 7, characterized in that After the rich text editor stores the instruction information in the first stack, the method further includes: When the rich text editor receives a cancel instruction, the plug-in unit obtains indication information located at the top of the first stack; The plug-in unit cancels the update operation corresponding to the instruction information at the top of the stack in the data structure corresponding to the rich text content; Rendering and displaying the rich text content according to the data structure after the undo update operation; The indication information at the top of the stack is stored in a second stack, where the second stack is used to store indication information corresponding to the revoked operation.
9. The method according to any one of claims 1-2, 4 and 6, characterized in that: The first application further includes a second rendering unit and an instruction processing unit; Before the rich text editor receives the first instruction, the method further includes: When the first application is started, the second rendering unit renders and displays a graphical user interface of the first application and starts the instruction processing unit, wherein the graphical user interface includes a list of multiple rich text contents; When the second rendering unit detects a display operation for any rich text content in the list, sending an initialization instruction to the rich text editor; The rich text editor generates a data structure of rich text content corresponding to the display operation according to the initialization instruction.
10. The method according to claim 9, characterized in that The first application further includes an event processing unit; Before the rich text editor receives the first instruction, the method further includes: When the second rendering unit detects a user operation, determining a first event triggered by the user operation, and sending the first event to the event processing unit; The event processing unit determines the operation intention corresponding to the first event and sends the operation intention to the instruction processing unit; The instruction processing unit obtains the first instruction matching the operation intention and sends the first instruction to the plug-in unit.
11. The method according to any one of claims 1-2, 4, 6, 8, and 10, characterized in that: The rich text editor is developed based on the web page view.
12. A rich text processing device, characterized in that: Applied to a first application, wherein the first application includes a rich text editor, the apparatus includes: A transmission module, configured to receive a first instruction from the rich text editor, wherein the first instruction is used to instruct to perform a first operation on the rich text content displayed in the rich text editor; a determination module, configured for the rich text editor to determine, based on the first instruction, operation information corresponding to the first operation, a target operation type of the first operation, and an operation position corresponding to the first operation in the rich text content; A processing module, configured for the rich text editor to generate instruction information according to the operation information, the target operation type, and the operation position; The processing module is further configured to enable the rich text editor to update the data structure corresponding to the rich text content according to the instruction information; The processing module is further configured to enable the rich text editor to render and display the rich text content according to the updated data structure; wherein the rich text editor is applied to the first application in at least two platforms; The rich text editor includes a plug-in unit and a data processing unit, wherein the plug-in unit includes multiple plug-ins; wherein different plug-ins are used to implement different functions; The determining module is specifically configured to: The plug-in unit determines, according to the first instruction, a target plug-in corresponding to the first instruction from among the multiple plug-ins; The plug-in unit obtains, through the target plug-in, operation information corresponding to the first operation from the data carried by the first instruction; The plug-in unit determines, through the target plug-in, a target operation type corresponding to the first instruction from a plurality of preset operation types; The plug-in unit sends an identification instruction to the data processing unit; The data processing unit determines an operation position corresponding to the first operation in response to the recognition instruction.
13. A terminal device, characterized in that: include: processor and memory; The memory stores computer-executable instructions; The processor executes the computer-executable instructions stored in the memory, so that the terminal device performs the method according to any one of claims 1 to 11.
14. A computer-readable storage medium storing a computer program, characterized in that: When the computer program is executed by a processor, the method according to any one of claims 1 to 11 is implemented.
15. A computer program product, characterized in that The method comprises a computer program, which, when being executed, causes a computer to execute the method according to any one of claims 1 to 11.
Citation Information
Patent Citations
Rich text editing method, device and equipment
CN114548056A