Cross-platform rich text editing method and device

Abstract

The embodiment of the invention discloses a cross-platform rich text editing method, which comprises the following steps: identifying an input device, predefining a typesetting rule and a rendering rule based on a programming language, packaging a programming code, and loading the programming code into a browser of a corresponding type of the input device; configuring an input method and shortcut key logic matched with the input equipment according to the programming code, and simulating an interaction effect based on the browser and the input equipment by utilizing a webpage canvas tool; obtaining character information input by a user through the input device, analyzing the character information through the typesetting rule, obtaining the typesetting rule of each piece of character information, and dynamically adjusting the line feed rule, the paragraph alignment mode and the line height of the character information according to the size limitation of the current editing area; user operation events are monitored in real time, and typesetting and rendering results are updated. According to the method and the device, cross-platform rich text typesetting and rendering functions are realized by pre-defining typesetting and rendering rules.

Description

Technical Field

[0001] The present application relates to the field of computer software technology, and in particular to a cross-platform rich text editing method and device. Background Art

[0002] Rich text editing refers to text editing operations that support multiple formatting functions in the editor, allowing users to adjust the style and format the content while entering text. Compared with ordinary plain text editing, rich text editors provide more typesetting functions and content processing capabilities.

[0003] However, most traditional rich text editing methods rely on static typesetting and rendering rules, which are difficult to meet the adaptation requirements of cross-platform, multi-language, and multi-input devices. Therefore, how to develop a rich text editing method that can provide a consistent experience in different cross-platform rich text editing devices and equipment has become a technical problem that needs to be solved urgently. Summary of the invention

[0004] The present application provides a cross-platform rich text editing method and device, which realizes text editing in different cross-platform rich text editing devices and equipment.

[0005] This application provides the following solutions:

[0006] According to a first aspect, a cross-platform rich text editing method is provided, the method comprising: identifying an input device, determining the device type, operating system type and browser type of the input device; predefining typesetting rules and rendering rules based on a programming language, obtaining programming codes for the typesetting rules and rendering rules, packaging the programming codes and loading them into a browser of a corresponding type of the input device; configuring an input method and shortcut key logic adapted to the input device according to the programming codes, and simulating the interaction effect between the browser and the input device using a web page canvas tool; obtaining character information input by a user through the input device, the character information comprising: text characters, special characters and graphics symbol; parsing the character information through the typesetting rules to obtain the typesetting rules of each character information, the typesetting rules including: position, width, height, spacing, font baseline offset and the relative arrangement relationship between the character information and the line, dynamically adjusting the line breaking rules, paragraph alignment and line height of the character information according to the size limit of the current editing area; real-time monitoring of user operation events, adjusting the character style of the character information in real time according to the rendering rules and user operation events, and updating the typesetting and rendering results; the character style includes: font type, size, color, highlight, thickness and character effects; the user operation events include: mouse movement, text selection and / or style switching.

[0007] According to an achievable method in an embodiment of the present application, the simulation of the interactive effect includes: dynamically drawing the cursor position and setting its flashing effect, and periodically changing the transparency or color of the cursor through a timer; and / or, capturing the user's mouse operation and keyboard input events, performing real-time interactive calculations with the typesetting rule based on the input character information, obtaining the precise position, line height, character spacing and other typesetting information of the characters, and presenting the results in a drawing manner on the web page canvas; and / or, when the user selects the character information, using the area drawing function of the canvas to dynamically highlight the background of the selected area, and adjusting the selection range according to the user's drag operation.

[0008] According to an achievable method in an embodiment of the present application, the predefined typesetting rules and rendering rules based on the programming language include: establishing a typesetting rule library through a rule engine in the programming language, defining adaptive typesetting strategies for special characters, and the typesetting strategies include: character overlap, horizontal and vertical alignment; defining character style rules through a rendering engine in the programming language, and presetting dynamic rendering methods for character special effects, and the character special effects include: real-time highlighting, dynamic annotation, gradient color, and optimizing the rendering effect, and the optimization includes: anti-aliasing processing, multi-resolution adaptation and / or high-performance rendering.

[0009] According to an achievable method in an embodiment of the present application, the character information is parsed through the typesetting rules to obtain the typesetting rules for each character information, the typesetting rules including: position, width, height, spacing, font baseline offset, and the relative arrangement relationship between the character information and the row, and according to the size limit of the current editing area, the line breaking rules, paragraph alignment, and row height of the character information are dynamically adjusted, including: obtaining the character information input by the user in the table through the input device, and calling the typesetting and rendering rules in the table cell; parsing the character information through the typesetting rules to obtain the position, width, height, spacing, font baseline offset, and the relative arrangement relationship between each character and the row; identifying the table structure, and merging or splitting the cells in combination with the cell size of the current editing area; dynamically adjusting the line breaking rules, paragraph alignment, and row height of the characters.

[0010] According to an achievable method in an embodiment of the present application, the method also includes: dynamically determining the language type to which the input content belongs based on the character information and language feature library input by the user, and automatically switching to the corresponding language environment; dynamically adjusting the font size, character spacing and line spacing parameters according to the language type; using a pre-trained language model and dictionary data to detect spelling errors in the input text, marking possible typos and providing automatic or manual correction suggestions; for grammatical problems, analyzing the structure of the sentence through a grammatical parser, identifying grammatical problems in the sentence, and displaying error prompts and / or optimization suggestions in real time on the editing interface.

[0011] According to an achievable method in the embodiment of the present application, the method further includes: implementing a dynamic font loading and caching strategy for the font type, selecting an adaptive font according to the operating system type, and caching a commonly used font package; when the user inputs character information on the input device, directly calling the commonly used font package cached locally, and loading the required subset font package according to the font usage frequency; real-time detection of the network status, and compressing the commonly used font package through a compression algorithm. According to an achievable method in the embodiment of the present application, the steps further include: receiving external input information through an API interface, and customizing functions according to the input information; the function customization includes: accepting image file uploads through an API, parsing file formats, sizes, and resolutions, calling a typesetting module to dynamically adjust the relative position of the image and the character, and scaling, cropping, rotating, and filtering the image; according to the typesetting rules, adapting the image file to the layout of the character information; and / or, receiving external statistical data through an API interface, dynamically converting the statistical data into statistical chart type data, and rendering it in real time in the editing area, and adapting the chart type data to the layout of the character information according to the typesetting rules.

[0012] According to a second aspect, a cross-platform rich text editing device is provided, characterized in that the device comprises: an input device identification module, configured to identify the input device, determine the device type, operating system type and browser type of the input device; a programming code loading module, configured to predefine typesetting rules and rendering rules based on a programming language, obtain programming codes for the typesetting rules and rendering rules, package the programming codes and load them into a browser of the corresponding type of the input device; an interaction adaptation module, configured to configure an input method and shortcut key logic adapted to the input device according to the programming code, and simulate the interaction effect between the browser and the input device using a web page canvas tool; an input information acquisition module, configured to acquire character information input by a user through the input device, the character The information includes: text characters, special characters and graphic symbols; a character typesetting module is configured to parse the character information through the typesetting rules and obtain the typesetting rules of each character information, wherein the typesetting rules include: position, width, height, spacing, font baseline offset and the relative arrangement relationship between the character information and the line, and dynamically adjust the line breaking rules, paragraph alignment and line height of the character information according to the size limit of the current editing area; a character rendering module is configured to monitor user operation events in real time, adjust the character style of the character information in real time according to the rendering rules and user operation events, and update the typesetting and rendering results; the character style includes: font type, size, color, highlight, thickness and character special effects; the user operation events include: mouse movement, text selection and / or style switching.

[0013] According to a third aspect, a computer-readable storage medium is provided, on which a computer program is stored, and when the program is executed by a processor, the steps of any one of the methods described in the first aspect are implemented.

[0014] According to a fourth aspect, an electronic device is provided, comprising: one or more processors; and a memory associated with the one or more processors, the memory being used to store program instructions, and the program instructions, when read and executed by the one or more processors, execute the steps of any one of the methods described in the first aspect.

[0015] According to the specific embodiments provided in this application, this application discloses the following technical effects:

[0016] This application ensures the compatibility of the cross-platform rich text editing method on different devices and browsers by identifying the type of input device, the type of cross-platform rich text editing device and the type of browser. It can automatically adapt to the input method and shortcut key logic of different environments, and use the web canvas tool to simulate the interaction effect between the browser and the input device, thereby improving the user experience. Utilizing predefined typesetting and rendering rules, the programming code is packaged and loaded into the browser corresponding to the input device to ensure that the typesetting and rendering effects remain consistent on various devices, reducing the complexity of manual configuration. Dynamically adjust the line breaking rules, paragraph alignment and line height of characters to ensure that the text is well adapted to screens and devices of different sizes based on the size of the current editing area, avoiding typesetting anomalies and other problems. Real-time monitoring of user operation events ensures that the editing results can be instantly fed back and updated during rich text editing, thereby improving the user interaction experience.

[0017] This application simulates interactive effects and dynamically draws the cursor position to provide a more realistic and intuitive editing experience and enhance the user's feedback on operations. It captures mouse operations and keyboard input events and calculates the precise position of characters, line height, character spacing and other layout information in real time to ensure accurate layout during text input and improve the stability and accuracy of layout. It provides dynamic selection highlighting and adjustment of selection range functions to enhance the user's sense of control over the text and make the text editing process smoother.

[0018] This application uses a rule engine to establish a typesetting rule library and a rendering engine to define character style rules, thereby achieving accurate typesetting and efficient rendering of special characters and various text effects; combined with the graphics processing interface to optimize anti-aliasing processing and multi-resolution adaptation, it provides high-performance rendering effects on devices with different resolutions, ensuring consistency in display quality.

[0019] This application supports complex text layout requirements in tables, including character spacing, font baseline offset, line height adjustment, and paragraph alignment, by intelligently identifying table structures and combining dynamic adjustment of cell sizes, ensuring that the text layout in the table is clear and neat. In addition, through the automatic merging or splitting of cells function, the ability to dynamically adapt to tables is achieved, expanding the application scope of rich text editors in table scenarios.

[0020] This application enhances the support for multilingual text by dynamically determining the language type of the input content and automatically adjusting the font size, character spacing, and line spacing parameters; combined with the spelling and grammar checking modules, it performs real-time error detection and optimization suggestions for the input content, which not only improves the accuracy of text input, but also enhances the intelligent experience of the user during the editing process.

[0021] This application uses a dynamic font loading and caching mechanism to improve the font loading speed and stability of cross-platform editors in offline or poor network environments, avoiding font missing or loading delays; loads the required subset font packages according to the frequency of font usage, saving device storage space, while ensuring efficient use of font resources and improving the performance of cross-platform rich text editing devices; detects network status in real time and compresses font packages, optimizes the network transmission efficiency of font loading, reduces network bandwidth occupancy, improves font loading speed, and adapts to different network environments.

[0022] This application receives external input information and customizes functions through an API interface, which expands the flexibility and scalability of the text editor, allowing external cross-platform rich text editing devices and applications to customize specific functions. This application receives external input information and customizes functions through an API interface, which expands the flexibility and scalability of the text editor, allowing external cross-platform rich text editing devices and applications to customize specific functions. It supports scaling, cropping, rotating, and filtering images, which improves the flexibility of image processing and meets users' needs for adjusting image details. Dynamic rendering of statistical charts and typesetting adaptation improves the ability of cross-platform rich text editors to process statistical data and charts, enabling them to adapt to data visualization needs and optimize data presentation effects.

[0023] Of course, any product implementing the present application does not necessarily need to achieve all of the advantages described above at the same time. BRIEF DESCRIPTION OF THE DRAWINGS

[0024] In order to more clearly illustrate the embodiments of the present application or the technical solutions in the prior art, the drawings required for use in the embodiments will be briefly introduced below. Obviously, the drawings described below are only some embodiments of the present application. For ordinary technicians in this field, other drawings can be obtained based on these drawings without paying creative work.

[0025] Figure 1 A system architecture diagram applicable to the embodiments of the present application;

[0026] Figure 2 A flowchart of a cross-platform rich text editing method provided in an embodiment of the present application;

[0027] Figure 3 A schematic block diagram of a cross-platform rich text editing device provided for an embodiment of the application;

[0028] Figure 4 A schematic block diagram of an electronic device provided in an embodiment of the present application. DETAILED DESCRIPTION

[0029] The following will be combined with the drawings in the embodiments of the present application to clearly and completely describe the technical solutions in the embodiments of the present application. Obviously, the described embodiments are only part of the embodiments of the present application, not all of the embodiments. All other embodiments obtained by ordinary technicians in this field based on the embodiments in the present application belong to the scope of protection of this application.

[0030] The terms used in the embodiments of the present invention are only for the purpose of describing specific embodiments, and are not intended to limit the present invention. The singular forms "a", "said" and "the" used in the embodiments of the present invention and the appended claims are also intended to include plural forms, unless the context clearly indicates other meanings.

[0031] It should be understood that the term "and / or" used in this article is only a description of the association relationship of associated objects, indicating that there can be three relationships. For example, A and / or B can represent: A exists alone, A and B exist at the same time, and B exists alone. In addition, the character " / " in this article generally indicates that the associated objects before and after are in an "or" relationship.

[0032] The word "if" as used herein may be interpreted as "at the time of" or "when" or "in response to determining" or "in response to detecting", depending on the context. Similarly, the phrases "if it is determined" or "if (stated condition or event) is detected" may be interpreted as "when it is determined" or "in response to determining" or "when detecting (stated condition or event)" or "in response to detecting (stated condition or event)", depending on the context.

[0033] In the application scenario of cross-platform rich text editing, due to the large differences between different devices, the types of cross-platform rich text editing devices of the devices, and the browser environment, the compatibility of input methods and shortcut key logic has become a major technical difficulty. For example, different cross-platform rich text editing devices have inconsistent definitions of shortcut keys, and some mobile devices need to adapt to virtual keyboards and touch input. These differences lead to inconsistent user experience and even functional anomalies on specific platforms, limiting the cross-platform usability of rich text editing.

[0034] In view of this, the present application provides a new idea. In order to facilitate the understanding of the present application, the cross-platform rich text editing device architecture based on the present application is first described. Figure 1 An exemplary cross-platform rich text editing device architecture to which the present application embodiment can be applied is shown. Figure 1 As shown in , the cross-platform rich text editing device architecture may include: a user device and a cross-platform rich text editing device located on a server side.

[0035] The user can input text information through the user device, and the user device sends the text information to the cross-platform rich text editing device on the server side.

[0036] User devices may include, but are not limited to, smart mobile terminals, smart home devices, wearable devices, PCs (Personal Computers), etc. Smart mobile devices may include mobile phones, tablet computers, laptop computers, PDAs (Personal Digital Assistants), Internet cars, etc.

[0037] The cross-platform rich text editing device can use the method provided in the embodiment of the present application to edit text information according to predefined typesetting and rendering rules. The cross-platform rich text editing device can be set as an independent server, or it can be set in a server group, or it can be set in a cloud server. A cloud server, also known as a cloud computing server or a cloud host, is a host product in a cloud computing service system to solve the problems of difficult management and weak service scalability in traditional physical hosts and virtual private servers (VPS) services. In addition Figure 1 In addition to the shown architecture, the cross-platform rich text editing device can also be set on a computer terminal with strong computing power.

[0038] It should be understood that Figure 1 The user equipment and cross-platform rich text editing device in the embodiment are only illustrative. According to the implementation requirements, there can be any number of user equipment and cross-platform rich text editing devices.

[0039] Figure 2 A flow chart of a cross-platform rich text editing method provided in an embodiment of the present application. The method can be performed by Figure 1 The cross-platform rich text editing device in the cross-platform rich text editing device is executed. Figure 2 As shown in , the method may include the following steps:

[0040] Step 201: Identify the input device and determine the device type, operating system type and browser type of the input device.

[0041] Step 202: predefine typesetting rules and rendering rules based on the programming language, obtain programming codes of the typesetting rules and rendering rules, package the programming codes and load them into a browser of a corresponding type of the input device.

[0042] Step 203: Adapt the input method and shortcut key logic of the input device according to the programming code configuration, and use the web page canvas tool to simulate the interaction effect between the browser and the input device.

[0043] Step 204: Acquire character information input by the user through an input device, where the character information includes text characters, special characters, and graphic symbols.

[0044] Step 205: Parse the character information through typesetting rules to obtain the typesetting rules for each character information, the typesetting rules including: position, width, height, spacing, font baseline offset, and the relative arrangement relationship between the character information and the line, and dynamically adjust the line breaking rules, paragraph alignment, and line height of the character information according to the size limit of the current editing area.

[0045] Step 206: Monitor user operation events in real time, adjust the character style of the character information in real time according to the rendering rules and user operation events, and update the typesetting and rendering results; the character style includes: font type, size, color, highlight, thickness and character effects; the user operation events include: mouse movement, text selection and / or style switching.

[0046] It can be seen from the above process that this application ensures the compatibility of the cross-platform rich text editing method on different devices and browsers by identifying the type of input device, the type of cross-platform rich text editing device and the type of browser. It can automatically adapt to the input method and shortcut key logic of different environments, and use the web canvas tool to simulate the interaction effect between the browser and the input device, thereby improving the user experience. Utilizing predefined typesetting and rendering rules, the programming code is packaged and loaded into the browser corresponding to the input device to ensure that the typesetting and rendering effects remain consistent on various devices, reducing the complexity of manual configuration. Dynamically adjust the line breaking rules, paragraph alignment and line height of the characters, based on the size of the current editing area, to ensure that the text is well adapted to screens and devices of different sizes, and to avoid typesetting anomalies and other problems. Real-time monitoring of user operation events ensures that the editing results can be instantly fed back and updated during rich text editing, thereby improving the user interaction experience.

[0047] The following describes in detail each step in the above process and the effects that can be further produced in conjunction with the embodiments.

[0048] First, the above step 201, namely "identifying the input device, determining the device type, operating system type and browser type of the input device" is described in detail in conjunction with the embodiment.

[0049] In this application, the user uses an input device to input character information, and by identifying the input device and accurately obtaining the characteristic information of the device, an input environment suitable for the input device can be matched for the user. The types of input devices include PCs, mobile phones, tablets and other smart devices; the operating system is the operating system used by the input device, and the types include Windows, MacOS, Android, iOS, etc.; the browser is used for the user to interact with the cross-platform rich text editing device, and can be various commonly used browsers, such as Chrome, Firefox, Safari, etc.

[0050] The identification of input devices can be achieved in many ways, for example, the device and browser type can be identified through the user agent string (User-Agent). In the browser environment, the User-Agent string contains information such as the device type, the version of the cross-platform rich text editing device, the browser name and version, etc. By parsing the User-Agent, the device type, the cross-platform rich text editing device, and the browser type can be preliminarily determined. The API (Application Programming Interface) can also be used to obtain device information. On desktop devices, the device resolution, screen size, whether touch input is supported, and shortcut key mapping can be obtained through the API; on mobile devices, calling a specific SDK (Software Development Kit) can obtain the device model, screen resolution, and input method (such as physical keyboard, touch screen, and shortcut key mapping).

[0051] The above step 202, namely "predefine typesetting rules and rendering rules based on a programming language, obtain programming codes for the typesetting rules and rendering rules, package the programming codes and load them into a browser of the corresponding type of the input device" is described in detail below in conjunction with an embodiment.

[0052] In the cross-platform rich text editing method, in order to solve the problem of inconsistent typesetting and rendering effects in different devices, browsers, and typeset and rendering effects, this application predefines typesetting rules and rendering rules based on programming languages, and implements a unified and efficient text typesetting and rendering mechanism. The type of programming language is not limited in this application, and preferably, the typesetting rules and rendering rules can be expressed in C++ language.

[0053] Specifically, this application pre-sets a series of typesetting rules and rendering rules applicable to multiple platforms in the programming language to clarify the display method of characters, paragraphs and other elements, forming a set of device-independent abstract typesetting and rendering logic. Typesetting rules are used to represent the arrangement relationship between characters, including but not limited to the position, width, height, spacing, font baseline offset and the relative arrangement relationship between characters and lines, and can be flexibly adapted to different languages, character sets and text characteristics. At the same time, the rendering rules define the expression of character styles, such as font type, size, color, highlight effect, thickness and dynamic effects (such as gradient, shadow). Based on the above rules, a unified programming code is generated by the rule engine.

[0054] Among them, the typesetting and rendering rules can be flexibly set according to needs. As an implementable solution, a typesetting rule library can be established in the programming language through a rule engine to define adaptive typesetting strategies for special characters. The typesetting strategies include: character overlap, horizontal and vertical alignment. For example, when editing scientific formulas, superscript and subscript characters may partially overlap with baseline characters. The rule engine can dynamically calculate the bounding box of the character, determine the offset distance that the superscript character should be above the main character, and the downward displacement of the subscript character relative to the baseline; for emoticons or graphic symbols, the typesetting rule library can ensure that these symbols are displayed horizontally in the center of their corresponding lines without affecting the typesetting alignment of the entire line due to changes in character size.

[0055] Among them, the rule engine is a software tool or a cross-platform rich text editing device that is used to automate the decision-making process and perform specific tasks or operations through predefined rules. Its basic function is to automatically process input data according to a set of defined rules, conditions and logic, and generate corresponding output results. For example, when inserting a large emoticon in multiple lines of text, the cross-platform rich text editing device will automatically adjust the spacing between it and adjacent text to ensure the overall visual balance; in scenarios involving mixed typesetting of multilingual characters (such as mixed typesetting of Chinese and English), the rule engine dynamically calculates the height and baseline offset of the characters to ensure that the characters of different languages ​​are visually aligned. For example, when Chinese and English characters are mixed in a paragraph, the cross-platform rich text editing device will dynamically adjust the baseline of the characters according to the height difference of the fonts, so that the characters of the two languages ​​maintain a consistent horizontal alignment visually.

[0056] In the programming language, character style rules are defined through the rendering engine, and dynamic rendering methods are preset for character special effects. Character special effects include: real-time highlighting, dynamic annotation, gradient color, and optimization of rendering effects, including: anti-aliasing, multi-resolution adaptation and / or high-performance rendering. In specific implementation, character special effects include but are not limited to real-time highlighting, dynamic annotation and gradient color effects, which can enhance the user editing experience and improve the text rendering effect. The rendering engine will apply the corresponding character style rules and special effect rendering methods according to the character information entered by the user to process and display the characters in real time. For example, when the user enters a keyword in the text, the rendering engine will trigger the highlight effect in real time, change the font color or background color of the keyword, and highlight it on the page. The dynamic annotation special effect can automatically add annotation information above or below the character to help the user understand certain special meanings or comments. The gradient color special effect renders the characters through the gradient color band effect, so that the text visually presents a smoother and more layered appearance.

[0057] In order to further optimize the rendering effect, the rendering engine adopts a variety of technical means to improve the rendering quality and efficiency. Anti-aliasing processing technology can eliminate the jagged burrs on the edges of characters, making the characters smoother and improving the visual effect, which is especially important in the display of small fonts or italic characters. Multi-resolution adaptation technology can automatically adjust the character rendering effect according to the resolution of different display devices, ensuring good display effects on both high-resolution displays and low-resolution devices. In order to improve the overall rendering performance, the rendering engine also supports high-performance rendering technology, which can improve the graphics rendering speed while ensuring the rendering effect, and avoid cross-platform rich text editing devices from freezing or responding late due to excessive rendering load.

[0058] After the generated programming code is packaged, it can be loaded into the browser or embedded browser component corresponding to different devices. The packaging process includes integrating the layout and rendering logic, while optimizing the code to reduce memory usage and improve execution efficiency. The loading process injects the programming code into the target browser environment by calling the standard interface supported by the browser (such as WebAssembly or JavaScript module loader), enabling it to have the ability to layout and render rich text content in real time.

[0059] The above step 203, namely "adapting the input method and shortcut key logic of the input device according to the programming code configuration, and simulating the interaction effect between the browser and the input device using the web page canvas tool" is described in detail below in conjunction with the embodiments.

[0060] In order to achieve efficient operation and consistent user experience of cross-platform rich text editors, the present application provides a technical means for automatically configuring input methods and shortcut key logic based on programming code and calling the web page canvas interface to simulate interactive effects. Specifically, based on the recognition result of the input device, the adaptation logic is extracted from the pre-defined programming code, and the input method and shortcut key mapping are automatically adjusted according to the device characteristics. For example, under different cross-platform rich text editing devices (such as Windows, macOS, Linux), the function mapping of shortcut keys (such as copy, paste, undo operations, etc.) may be different, and this technology can automatically configure the adapted shortcut key logic, thereby ensuring a consistent shortcut key operation experience on different devices and platforms. In addition, the present application also supports loading adapted input method rules according to the user's language settings, such as switching between Chinese and English, quick input of special characters, etc.

[0061] At the same time, in order to enhance the interactive experience of the rich text editor, this application calls the web canvas interface (such as HTML5Canvas API) to simulate the interactive effect through real-time drawing. Specifically, when the user operates through the input device, the cross-platform rich text editing device captures the user's input events (such as mouse movement, keyboard input), and calculates the input content in real time to obtain information such as character position, line height, and character style. This information is dynamically rendered through the web canvas interface and interacts with the user in real time through the input device.

[0062] Specifically, the simulation of the interactive effect of the present application may include: dynamically drawing the cursor position and setting its flashing effect, periodically changing the transparency or color of the cursor through a timer; and / or, capturing the user's mouse operation and keyboard input events, performing real-time interactive calculations with the typesetting rules based on the input character information, obtaining the precise position of the character, line height, character spacing and other typesetting information, and presenting the results on the web page canvas in a drawing manner; and / or, when the user selects the character information, using the canvas's area drawing function to dynamically highlight the background of the selected area, and adjusting the selection range according to the user's drag operation. In addition, the technology also supports dynamic loading of special characters or graphic symbols and seamless integration with text content.

[0063] The above step 204, namely "obtaining character information input by the user through the input device, wherein the character information includes text characters, special characters and graphic symbols", is described in detail below in conjunction with an embodiment.

[0064] This application performs text editing on character information input by the user, and the user inputs characters through an input device. Among them, character information includes not only text characters (such as letters, numbers, punctuation marks, etc.), but also special characters (such as tabs, line breaks, etc.) and graphic symbols (such as emoticons and emojis, etc.). This application can support diverse input content and meet the usage needs in different scenarios.

[0065] This application can capture all character information entered by the user in the editing interface through real-time monitoring and data analysis of the input device. First, the cross-platform rich text editing device captures the user's input operation through input events (such as keyboard input events, mouse click events, touch operation events, etc.), and extracts the input character data according to the device type. Then, the character parsing module is used to identify and classify the input content, and classify it into regular characters, special characters or graphic symbols.

[0066] For the processing of graphic symbols, this application can combine the graphic library and the character encoding standard to ensure that common emoji and special symbols in other language character sets can be correctly identified and displayed.

[0067] The present application can also dynamically determine the language type of the input content based on the character information and language feature library input by the user, and automatically switch to the corresponding language environment; dynamically adjust the font size, character spacing and line spacing parameters according to the language type; use pre-trained language models and dictionary data to detect spelling errors in the input text, mark possible typos and provide automatic or manual correction suggestions; for grammatical problems, analyze the structure of the sentence through a grammar parser, identify grammatical problems in the sentence, and display error prompts or optimization suggestions in real time on the editing interface.

[0068] Specifically, when the user inputs character information, the cross-platform rich text editing device dynamically determines the language type of the input content by analyzing the character set and matching the language feature library. For example, when the user's input method switches to Chinese and starts to input Chinese characters, the cross-platform rich text editing device can recognize the Chinese features in the character set and switch to the Chinese language environment. During the switching process, the cross-platform rich text editing device dynamically adjusts the font size, character spacing, and line spacing parameters according to preset rules to ensure that the Chinese text has the best display effect in the current editing area. Similarly, when the user inputs Western characters (such as English or French), the cross-platform rich text editing device can automatically switch to the corresponding language environment and adjust the character arrangement to comply with Western typesetting specifications. At the same time, to ensure the correctness of the input text, the cross-platform rich text editing device calls the spelling and grammar checking module to detect the text using the pre-trained language model and dictionary data. For example, when a user misspells the word "recieve" in English input, the cross-platform rich text editing device identifies the word as a spelling error by matching dictionary data, marks it with a red line on the editing interface, and provides a suggested correct spelling "receive". The user can choose to complete the modification automatically or manually.

[0069] In addition, the application can also provide optimization suggestions based on language characteristics. For example, when entering a French sentence, the cross-platform rich text editing device can detect where grammatical markers need to be added, such as missing accent marks; when entering Chinese, the cross-platform rich text editing device can identify common punctuation errors (such as mixing Chinese and English punctuation) and suggest adjustments.

[0070] The following is a detailed description of step 205, i.e., "parsing the character information through typesetting rules to obtain typesetting rules for each character information, wherein the typesetting rules include: position, width, height, spacing, font baseline offset, and the relative arrangement relationship between the character information and the line, and dynamically adjusting the line breaking rules, paragraph alignment, and line height of the character information according to the size limit of the current editing area" in conjunction with an embodiment.

[0071] Parsing the character information through typesetting rules and obtaining the position, width, height, spacing, font baseline offset and relative arrangement relationship between characters and lines of each character is one of the core technologies for realizing cross-platform rich text editing. In this application, the typesetting rules not only define the appearance style of the characters, but also include the spatial layout and arrangement of the characters in the editing area, so as to ensure that the text can be displayed correctly and has good readability in different devices and environments.

[0072] First, the input character information is parsed and the precise layout information of each character is calculated according to predefined layout rules (such as character spacing, line height, paragraph alignment, etc.). Among them, the width, height and spacing of each character need to be calculated according to the specific properties of the selected font, and the corresponding style rules are applied according to the type of character (such as letters, symbols, graphic symbols, etc.).

[0073] At the same time, this application will also calculate the font baseline offset of each character, which is crucial to ensure that the characters are vertically aligned within the line and to ensure the aesthetics of the text typesetting. The font baseline offset refers to the vertical offset between the baseline of a character and the actual display position of the character in font typesetting. The baseline usually refers to the virtual line that aligns the bottom of the font characters, and the other parts of the characters (such as the ascenders and descenders of letters) are positioned according to this baseline. The baseline offset is typically used to adjust the vertical position of characters to ensure that the text is visually aligned.

[0074] Furthermore, combined with the size limit of the current editing area, the character line breaking rules, paragraph alignment and line height are automatically adjusted. Specifically, in the text editing area, if the current line cannot accommodate the next character, the characters are wrapped according to the set line breaking rules (such as automatic line break, forced line break, etc.). As for the paragraph alignment, the text layout of each line can be dynamically adjusted according to the user's settings (such as left alignment, center alignment or right alignment). In addition, the adjustment of line height is also based on the actual size of the characters and the needs of the editing area to ensure that the vertical spacing between lines is appropriate, so that the text layout is clear and neat.

[0075] The method of the present application can also be applied to the editing of table text. Specifically, the character information input by the user in the table through the input device is obtained, and the typesetting and rendering rules are called in the table cells; the text stream is parsed according to the typesetting rules to obtain the position, width, height, spacing, font baseline offset of each character and the relative arrangement relationship between the character and the line; for example, when the user enters a string of text, the character spacing and line height are automatically adjusted according to the font size and cell width to ensure that the text does not overflow the cell boundary.

[0076] Combined with the cell size of the current editing area, the table structure is identified, and the cells are merged or split; the character line break rules, paragraph alignment, and row height are dynamically adjusted. For example, when the content entered by the user exceeds the capacity of the cell, the cross-platform rich text editing device can automatically adjust the character line break method according to the rules, or suggest that the user merge adjacent cells to expand the display area. On the contrary, when the user deletes the cell content, if the cell is empty and there is no content conflict in the adjacent cells, the cross-platform rich text editing device can suggest splitting the cell back to the default size to optimize the overall layout of the table.

[0077] In addition, the user can also define the alignment of the paragraph in the table, such as left alignment, center alignment or right alignment, and the cross-platform rich text editing device will adjust the layout of the text according to the user's selection. For example, when the user chooses to center the paragraph, the cross-platform rich text editing device calculates the total width of the character flow and the available width of the cell, and displays the text in the center, while ensuring that the line height between each line is consistent, forming visual symmetry and beauty.

[0078] The following is a detailed description of step 206 in conjunction with the embodiment, namely "monitoring user operation events in real time, adjusting the character style of character information in real time according to rendering rules and user operation events, and updating the typesetting and rendering results; character styles include: font type, size, color, highlight, thickness and character effects; user operation events include: mouse movement, text selection and / or style switching."

[0079] In this application, by combining the predefined rendering rules in the programming language and the user operation events, the character style can be adjusted in real time, and the typesetting and rendering effects of the text can be dynamically updated according to the user's input. Specifically, the rendering rules include the adjustment of multiple visual attributes such as font type, size, color, highlight, thickness, and character effects. This adjustment is not only based on the preliminary editing settings, but also can respond to user interactive operations in real time, such as mouse movement, text selection, and style switching.

[0080] First, based on the predefined rendering rules, basic style parameters can be set for each character. These parameters include basic text attributes such as font type, font size, and color settings. For the character information entered by the user through the input device, it is rendered according to these preset rules so that the text presents a desired appearance. For example, the user can select different font types and font sizes, adjust the color of the text, and even add effects such as highlighting and bolding.

[0081] Secondly, the present application can also monitor the user's operation events in real time, and reflect the operation events in the rendering and typesetting of the text. Such as mouse movement, text selection, and style switching. These operation events will be captured by the device in a timely manner. For example, when the user moves the mouse to a certain part of the text, the cross-platform rich text editing device can provide a cursor highlight for the part of the text in real time, or trigger the text editing mode. For text selection operations, the cross-platform rich text editing device will not only adjust the background color of the selected part, but also modify the style of the selected text according to the user's needs, such as bolding or changing the color. When the user switches the style, the device can update the style of the character according to the new selection and apply the corresponding changes to ensure the uniformity and visual effect of the text when it is displayed.

[0082] This application can monitor user operation events in real time and update the typesetting and rendering results. It can use the stack data structure to realize multi-level undo and redo functions through the record of timestamp, operation event type and edit content status. When the user executes the undo command, it will gradually backtrack from the stack and restore to the corresponding historical content status. At the same time, the user's edited content is saved regularly, so that the user can view, compare and restore to the previous edited version.

[0083] Specifically, when the user performs operations such as input, deletion, format adjustment, etc. in the editor, the cross-platform rich text editing device records the detailed information of each operation through real-time monitoring, including the timestamp of the operation, the type of operation event (such as inputting characters, deleting characters, style changes, etc.), the editing content status and related typesetting and rendering information. All records are stored in a stack data structure in chronological order to support multi-level undo and redo functions. For example, when a user enters a paragraph of text in a document, adjusts the font size, and accidentally deletes a paragraph of text, the cross-platform rich text editing device will record these three operations in the stack. When the user executes an undo command, the cross-platform rich text editing device traces back the operation records from the stack in turn and restores to the previous editing state. The user can execute the undo command multiple times to gradually return to an earlier state.

[0084] In addition, to further enhance the convenience of content management, this application also saves the user's edited content at regular intervals and regularly stores the editing status as version snapshots. Users can view content versions at different time points through the version management function, and choose to restore to a certain version as needed. For example, when a user is writing an article, the cross-platform rich text editing device automatically saves the editing status every 5 minutes. If the user finds that the layout of the article is messed up due to an incorrect operation, he can view and restore to the most recently correctly saved version through the version management interface without having to undo each operation step by step.

[0085] The present application can also implement dynamic font loading and caching strategies for font types, select adaptive fonts according to the type of cross-platform rich text editing device being operated, cache commonly used font libraries, and compress the cached font packages when the network environment is poor.

[0086] Specifically, in a cross-platform rich text editing scenario, since users may need to select multiple fonts for typesetting, the cross-platform rich text editing device needs to quickly respond to font loading requirements and adapt to different operating environments. For example, in Windows and macOS cross-platform rich text editing devices, since the default font types and rendering mechanisms provided by the operating cross-platform rich text editing device are different, the cross-platform rich text editing device automatically selects a matching font based on the detected operating cross-platform rich text editing device type, such as loading fonts adapted to ClearType technology on Windows, and preferentially loading fonts that support Quartz rendering on macOS to ensure consistent font display effects.

[0087] To improve font loading efficiency, the present application can implement a local cache mechanism for commonly used font libraries on the client side. For example, if a user frequently uses certain fonts, such as Arial, Times New Roman, and Roboto, during multiple editing processes, the cross-platform rich text editing device will automatically store these fonts in the local cache. When the user selects these fonts again, the editor does not need to reload them from the server, thereby significantly shortening the font loading time.

[0088] When a user edits a document containing special fonts offline, the cross-platform rich text editing device can directly call the locally cached font resources and intelligently load the required subset font package according to the frequency of font usage. The cross-platform rich text editing device records the user's font usage, analyzes which fonts are frequently used, and intelligently loads the fonts according to the frequency of font usage. When the user needs to enable a new font but cannot load it online, the cross-platform rich text editing device will generate an alternative font solution locally to ensure the integrity of the text display. A subset font package is an optimized font file that only contains a part of the characters used in the font, rather than the complete character set of the entire font. The main purpose of the subset font package is to reduce the size of the font file, thereby speeding up the font loading speed and reducing the storage resource usage. In order to optimize the loading speed and reduce the storage usage, the cross-platform rich text editing device divides the font package into multiple subset packages according to the character set. For frequently used fonts, the cross-platform rich text editing device can intelligently load the subset package of the font according to its usage frequency. This means that only the font subset containing the character set actually edited by the user is loaded, rather than the entire font library, which reduces resource usage and improves efficiency.

[0089] In addition, in order to cope with the situation of poor network environment, this application designs a technical method for dynamically compressing font packages. When it is detected that the network bandwidth is low, the cross-platform rich text editing device optimizes the size of the font file through a compression algorithm. For example, the unused character subsets of the font file are removed from the font package, only the character subset currently used by the user is retained, and the font outline data is compressed. This method not only reduces the network traffic required for font loading, but also ensures the smoothness of editing operations under weak network conditions.

[0090] The present application can also receive external input information through the API interface to customize functions. Among them, function customization includes accepting image file uploads through the API, parsing file formats, sizes and resolutions, calling the typesetting module to dynamically adjust the relative positions of images and characters, and supporting image scaling, cropping, rotation and filter processing. For example, when a user uploads an image file through an input device, the cross-platform rich text editing device will first receive the file through the API interface, and parse the image's file format (such as JPEG, PNG, GIF, etc.), size (width and height) and resolution (such as DPI). After the parsing is completed, the typesetting module dynamically adjusts the relative position between the image and the text characters according to the size of the image and the layout of the editing area to ensure the neatness and beauty of the typesetting.

[0091] Specifically, if a user uploads a wide picture for insertion between paragraphs in an article, the cross-platform rich text editing device will automatically detect the width limit of the current paragraph, scale the picture to an appropriate width, and adjust the spacing between the picture and the text according to the user's typesetting requirements (such as center alignment, left alignment, or right alignment). For example, in a document containing paragraph text, the picture can be automatically set to be centered, and appropriate spacing can be added above and below to ensure visual separation between the picture and the text.

[0092] This application also supports editing operations on uploaded images, such as scaling, cropping, rotating, and filtering. For example, if a user uploads a picture with an extra background, the user can use the cropping function to remove the unnecessary parts and adjust the display ratio of the picture by scaling to make it consistent with the overall style of the document. If the user wants to rotate the picture to a certain angle (such as 90 degrees) or apply a specific filter effect (such as a black and white filter), the cross-platform rich text editing device will call the image processing module to implement these operations and update the display effect in the editing area in real time.

[0093] In addition, these user operations will be dynamically adapted to the layout of other content (such as text, tables or graphics) through the typesetting module. For example, when the user scales the image size, the cross-platform rich text editing device will recalculate the relative position of the image and text to ensure that the image does not block or overlap the text content, thereby providing an accurate and flexible typesetting experience. This method not only improves the visual coordination of images and text content, but also provides users with highly customized image and text editing functions.

[0094] In the present application, function customization may also include receiving external statistical data through an API interface, dynamically converting the statistical data into statistical chart type data, and rendering it in real time in the editing area, and adapting the chart type data to the layout of the character information according to the typesetting rules.

[0095] For example, if a user imports an external statistical data through the API interface, the cross-platform rich text editing device will automatically parse the content of this data, such as the type of data (such as numerical, classification or time series), distribution range and dimensional relationship. After the analysis is completed, the cross-platform rich text editing device dynamically converts this data into a data representation of the statistical chart type according to preset visualization rules. For example, for time series data of sales trends, the cross-platform rich text editing device can generate a line graph; for classification percentage data, a pie chart or a bar chart can be generated. While generating the chart, the editor calls the chart rendering module, inserts the chart into the current editing area, and displays it in real time in the user interface.

[0096] During the process of inserting a chart, the typesetting module dynamically adjusts the relative position of the chart and text characters according to the layout rules of the current editing area. For example, when a chart is inserted into a page containing multiple paragraphs of text, the cross-platform rich text editing device will detect the size of the chart and the width limit of the editing area, and automatically adjust the size of the chart to keep a reasonable distance from the surrounding character information. Users can further adjust the position of the chart in the editing area by dragging and dropping, and the cross-platform rich text editing device will recalculate the layout relationship between the chart and the text in real time, such as whether it is necessary to trigger a line break, adjust the paragraph alignment, or modify the line height to accommodate the insertion of the chart.

[0097] In addition, users can edit charts interactively, such as changing the chart type (from a bar chart to a line chart), adjusting the color scheme, or adding a legend, and the cross-platform rich text editing device will update the rendering results in real time. This dynamic adaptation function ensures a high degree of coordination between the chart and the text content. For example, in a rich text document used to present a company's annual report, users can insert multiple statistical charts and combine text descriptions to clearly display the data analysis results, thereby improving the expression effect and professionalism of the document.

[0098] The above is a description of a specific embodiment of the specification. Other embodiments are within the scope of the appended claims. In some cases, the actions or steps recorded in the claims can be performed in an order different from that in the embodiments and still achieve the desired results. In addition, the processes depicted in the drawings do not necessarily require the specific order or continuous order shown to achieve the desired results. In some embodiments, multitasking and parallel processing are also possible or may be advantageous.

[0099] According to an embodiment of another aspect, a cross-platform rich text editing device is provided. Figure 3 A schematic block diagram of a cross-platform rich text editing device according to an embodiment is shown. The device is arranged at Figure 1 The server side of the architecture shown in Figure 1. Figure 3 As shown, the device 300 includes:

[0100] The input device identification module 301 is configured to identify the input device and determine the device type, operating system type and browser type of the input device.

[0101] The programming code loading module 302 is configured to obtain programming codes of the typesetting rules and rendering rules based on the predefined typesetting rules and rendering rules of the programming language, and to package and load the programming codes into a browser of a corresponding type of the input device.

[0102] The interaction adaptation module 303 is configured to configure the input method and shortcut key logic of the adaptation input device according to the programming code, and use the web page canvas tool to simulate the interaction effect between the browser and the input device.

[0103] The input information acquisition module 304 is configured to acquire character information input by the user through an input device, and the character information includes: text characters, special characters and graphic symbols.

[0104] The character typesetting module 305 is configured to parse the character information through typesetting rules and obtain the typesetting rules for each character information. The typesetting rules include: position, width, height, spacing, font baseline offset, and the relative arrangement relationship between character information and lines. According to the size limit of the current editing area, the line breaking rules, paragraph alignment and line height of the character information are dynamically adjusted.

[0105] The character rendering module 306 is configured to monitor user operation events in real time, adjust the character style of the character information in real time according to the rendering rules and user operation events, and update the typesetting and rendering results; the character style includes: font type, size, color, highlight, thickness and character effects; the user operation events include: mouse movement, text selection and / or style switching.

[0106] As one of the feasible ways, the interaction adaptation module 303 can be configured to: dynamically draw the cursor position and set its flashing effect, and periodically change the transparency or color of the cursor through a timer when simulating the interaction effect; and / or, capture the user's mouse operation and keyboard input events, perform real-time interactive calculations with the typesetting rule based on the input character information, obtain the precise position of the character, line height, character spacing and other typesetting information, and present the results in the form of a drawing on the web page canvas; and / or, when the user selects character information, use the area drawing function of the canvas to dynamically highlight the background of the selected area, and adjust the selection range according to the user's drag operation.

[0107] As one of the feasible ways, the programming code loading module 302 can be configured as follows when predefining typesetting rules and rendering rules based on the programming language: establishing a typesetting rule library through a rule engine in the programming language, defining adaptive typesetting strategies for special characters, and the typesetting strategies include: character overlap, horizontal and vertical alignment; defining character style rules through a rendering engine in the programming language, and presetting dynamic rendering methods for character special effects, and the character special effects include: real-time highlighting, dynamic annotation, gradient color, and optimizing the rendering effect, and the optimization includes: anti-aliasing processing, multi-resolution adaptation and / or high-performance rendering.

[0108] As one of the achievable methods, the character typesetting module 305 parses the character information through typesetting rules to obtain the typesetting rules for each character information, the typesetting rules including: position, width, height, spacing, font baseline offset, and the relative arrangement relationship between the character information and the row, and dynamically adjusts the line breaking rules, paragraph alignment, and row height of the character information according to the size limit of the current editing area. It can be configured as follows: obtaining the character information input by the user in the table through the input device, and calling the typesetting and rendering rules in the table cell; parsing the character information through typesetting rules to obtain the position, width, height, spacing, font baseline offset, and the relative arrangement relationship between each character and the row; identifying the table structure, and merging or splitting the cells in combination with the cell size of the current editing area; dynamically adjusting the line breaking rules, paragraph alignment, and row height of the characters.

[0109] As one of the achievable methods, the device 300 also includes a language type determination module 306, which is configured to: dynamically determine the language type of the input content based on the character information and language feature library input by the user, and automatically switch to the corresponding language environment; dynamically adjust the font size, character spacing and line spacing parameters according to the language type; use pre-trained language models and dictionary data to detect spelling errors in the input text, mark possible typos and provide automatic or manual correction suggestions; for grammatical problems, analyze the structure of the sentence through a grammatical parser, identify grammatical problems in the sentence, and display error prompts and / or optimization suggestions in real time on the editing interface.

[0110] As one of the achievable methods, the device 300 also includes a font cache module 307, which is configured to: implement a dynamic font loading and caching strategy for the font type, select an adaptive font according to the type of operation of the cross-platform rich text editing device, and cache commonly used font packages; when the user inputs character information on the input device, directly call the locally cached commonly used font package, and load the required subset font package according to the frequency of font usage; perform real-time detection of the network status, and compress the commonly used font package through a compression algorithm.

[0111] As one of the achievable methods, the device 300 also includes a function customization module 308, which is configured during function customization to: accept image file uploads through an API, parse file formats, sizes, and resolutions, call a typesetting module to dynamically adjust the relative positions of images and characters, and scale, crop, rotate, and filter images; adapt the image file to the layout of the character information according to typesetting rules; and / or receive external statistical data through an API interface, dynamically convert the statistical data into statistical chart type data, and render them in real time in the editing area, and adapt the chart type data to the layout of the character information according to typesetting rules.

[0112] Each embodiment in this specification is described in a progressive manner, and the same or similar parts between the embodiments can refer to each other, and each embodiment focuses on the differences from other embodiments. In particular, for the cross-platform rich text editing device or the cross-platform rich text editing device embodiment, since it is basically similar to the method embodiment, the description is relatively simple, and the relevant parts can refer to the partial description of the method embodiment. The cross-platform rich text editing device and the cross-platform rich text editing device embodiments described above are merely schematic, wherein the units described as separate components may or may not be physically separated, and the components displayed as units may or may not be physical units, that is, they may be located in one place, or they may be distributed on multiple network units. Some or all of the modules may be selected according to actual needs to achieve the purpose of the scheme of this embodiment. Ordinary technicians in this field can understand and implement it without paying creative labor.

[0113] It should be noted that the user information (including but not limited to user device information, user personal information, etc.) and data (including but not limited to data used for analysis, stored data, displayed data, etc.) involved in this application are all information and data authorized by the user or fully authorized by all parties, and the collection, use and processing of relevant data must comply with the relevant laws, regulations and standards of the relevant countries and regions, and provide corresponding operation entrances for users to choose to authorize or refuse.

[0114] In addition, an embodiment of the present application further provides a computer-readable storage medium on which a computer program is stored, and when the program is executed by a processor, the steps of any one of the methods in the aforementioned method embodiments are implemented.

[0115] And an electronic device, comprising: one or more processors; and a memory associated with the one or more processors, the memory being used to store program instructions, and the program instructions, when read and executed by the one or more processors, execute the steps of any of the methods described in the aforementioned method embodiments.

[0116] The present application also provides a computer program product, including a computer program, which implements the steps of any one of the methods in the aforementioned method embodiments when executed by a processor.

[0117] in, Figure 4The architecture of the electronic device is shown as an example, which may include a processor 410, a video display adapter 411, a disk drive 412, an input / output interface 413, a network interface 414, and a memory 420. The processor 410, the video display adapter 411, the disk drive 412, the input / output interface 413, the network interface 414, and the memory 420 may be communicatively connected via a communication bus 430.

[0118] Among them, the processor 410 can be implemented by a general-purpose CPU, a microprocessor, an application-specific integrated circuit (ASIC), or one or more integrated circuits, etc., to execute relevant programs to implement the technical solution provided in this application.

[0119] The memory 420 can be implemented in the form of ROM (Read Only Memory), RAM (Random Access Memory), static storage device, dynamic storage device, etc. The memory 420 can store a cross-platform rich text editing device 421 for controlling the operation of the electronic device 400, and a basic input and output cross-platform rich text editing device (BIOS) 422 for controlling the low-level operation of the electronic device 400. In addition, a web browser 423, a data storage management cross-platform rich text editing device 424, and a cross-platform cross-platform rich text editing device 425, etc. can also be stored. The above-mentioned cross-platform cross-platform rich text editing device 425 can be an application program that specifically implements the operations of the aforementioned steps in the embodiment of the present application. In short, when the technical solution provided by the present application is implemented by software or firmware, the relevant program code is stored in the memory 420 and is called and executed by the processor 410.

[0120] The input / output interface 413 is used to connect the input / output module to realize information input and output. The input / output module can be configured in the device as a component (not shown in the figure), or it can be externally connected to the device to provide corresponding functions. The input device may include a keyboard, a mouse, a touch screen, a microphone, various sensors, etc., and the output device may include a display, a speaker, a vibrator, an indicator light, etc.

[0121] The network interface 414 is used to connect to a communication module (not shown) to realize communication interaction between the device and other devices. The communication module can realize communication through a wired mode (such as USB, network cable, etc.) or a wireless mode (such as mobile network, WIFI, Bluetooth, etc.).

[0122] The bus 430 comprises a pathway for transmitting information between the various components of the device (eg, the processor 410, the video display adapter 411, the disk drive 412, the input / output interface 413, the network interface 414, and the memory 420).

[0123] It should be noted that, although the above device only shows a processor 410, a video display adapter 411, a disk drive 412, an input / output interface 413, a network interface 414, a memory 420, a bus 430, etc., in the specific implementation process, the device may also include other components necessary for normal operation. In addition, it can be understood by those skilled in the art that the above device may also only include components necessary for implementing the solution of the present application, and does not necessarily include all the components shown in the figure.

[0124] It can be known from the description of the above implementation methods that those skilled in the art can clearly understand that the present application can be implemented by means of software plus a necessary general hardware platform. Based on such an understanding, the technical solution of the present application can be essentially or partly contributed to the prior art in the form of a computer program product, which can be stored in a storage medium such as ROM / RAM, a magnetic disk, an optical disk, etc., and includes several instructions for enabling a computer device (which can be a personal computer, a server, or a network device, etc.) to execute the methods described in the various embodiments of the present application or certain parts of the embodiments.

[0125] The technical solution provided by the present application is described in detail above. The principle and implementation method of the present application are described in detail using specific examples. The description of the above embodiments is only used to help understand the method and core idea of ​​the present application. At the same time, for those skilled in the art, according to the idea of ​​the present application, there will be changes in the specific implementation method and application scope. In summary, the content of this specification should not be understood as limiting the present application.

Claims

1. A cross-platform rich text editing method, characterized in that: The method comprises: Identify the input device and determine the device type, operating system type and browser type of the input device; Predefine typesetting rules and rendering rules in a programming language, obtain programming codes of the typesetting rules and rendering rules, and package and load the programming codes into a browser of a type corresponding to the input device; Adapting the input method and shortcut key logic of the input device according to the programming code configuration, and simulating the interaction effect between the browser and the input device using a web page canvas tool; Acquire character information input by the user through the input device, the character information including: text characters, special characters and graphic symbols; Parsing the character information through the typesetting rules to obtain the typesetting rules of each character information, wherein the typesetting rules include: position, width, height, spacing, font baseline offset, and relative arrangement relationship between character information and lines, and dynamically adjusting the line break rules, paragraph alignment, and line height of the character information according to the size limit of the current editing area; Monitor user operation events in real time, adjust the character style of the character information in real time according to the rendering rules and user operation events, and update the typesetting and rendering results; the character style includes: font type, size, color, highlight, thickness and character effects; the user operation events include: mouse movement, text selection and / or style switching.

2. The cross-platform rich text editing method according to claim 1, characterized in that: The simulation of the interaction effect includes: Dynamically draw the cursor position and set its blinking effect, and periodically change the transparency or color of the cursor through a timer; and / or, Capturing the user's mouse operation and keyboard input events, performing real-time interactive calculations with the typesetting rule based on the input character information, obtaining typesetting information such as the precise position, line height, character spacing, etc. of the character, and presenting the results on the web page canvas in the form of drawings; and / or, When the user selects the character information, the area drawing function of the canvas is used to dynamically highlight the background of the selected area, and the range of the selected area is adjusted according to the user's dragging operation.

3. The cross-platform rich text editing method according to claim 1, characterized in that: The predefined typesetting rules and rendering rules based on programming language include: A typesetting rule library is established in a programming language through a rule engine, and an adaptive typesetting strategy is defined for special characters, wherein the typesetting strategy includes: character overlap, horizontal and vertical alignment; Character style rules are defined in a programming language through a rendering engine, and a dynamic rendering method is preset for character special effects, which include: real-time highlighting, dynamic annotation, gradient color, and the rendering effect is optimized, which includes: anti-aliasing processing, multi-resolution adaptation and / or high-performance rendering.

4. The cross-platform rich text editing method according to claim 1, characterized in that: The character information is parsed by the typesetting rule to obtain the typesetting rule of each character information, wherein the typesetting rule includes: position, width, height, spacing, font baseline offset, and the relative arrangement relationship between the character information and the line, and according to the size limit of the current editing area, the line break rule, paragraph alignment and line height of the character information are dynamically adjusted, including: Acquire the character information input by the user in the table through the input device, and call typesetting and rendering rules in the table cell; Parsing the character information according to the typesetting rules to obtain the position, width, height, spacing, font baseline offset of each character and the relative arrangement relationship between the character and the line; Identify the table structure, and merge or split the cells according to the cell size of the current editing area; Dynamically adjust character line breaks, paragraph alignment, and line height.

5. The cross-platform rich text editing method according to claim 1, further comprising: According to the character information input by the user and the language feature library, dynamically determine the language type of the input content, and automatically switch to the corresponding language environment; dynamically adjust the font size, character spacing and line spacing parameters according to the language type; Use pre-trained language models and dictionary data to detect spelling errors on input text, mark possible typos, and provide automatic or manual correction suggestions; For grammatical problems, the sentence structure is analyzed through the grammar parser, grammatical problems in the sentence are identified, and error prompts and / or optimization suggestions are displayed in real time on the editing interface.

6. The cross-platform rich text editing method according to claim 1, characterized in that: The method further comprises: Implement dynamic font loading and caching strategies for the font types, select adaptive fonts according to the operating system type, and cache commonly used font packages; When the user inputs character information through the input device, the commonly used font package cached locally is directly called, and the required subset font package is loaded according to the font usage frequency; The network status is detected in real time, and the commonly used font package is compressed by a compression algorithm.

7. The cross-platform rich text editing method according to claim 1, characterized in that: The steps also include: receiving external input information through an API interface, and customizing functions according to the input information; The function customization includes: accepting image file uploads through the API, parsing the file format, size and resolution, calling the typesetting module to dynamically adjust the relative position of the image and the characters, and scaling, cropping, rotating and filtering the image, and adapting the layout of the image file and the character information according to the typesetting rules; and / or, External statistical data is received through an API interface, the statistical data is dynamically converted into statistical chart type data, and is rendered in real time in an editing area, and the chart type data is adapted to the layout of the character information according to the typesetting rules.

8. A cross-platform rich text editing device, characterized in that: The device comprises: An input device identification module is configured to identify the input device and determine the device type, operating system type and browser type of the input device; A programming code loading module is configured to obtain programming codes of the typesetting rules and rendering rules based on predefined typesetting rules and rendering rules of a programming language, and to package and load the programming codes into a browser of a type corresponding to the input device; An interactive adaptation module, configured to adapt the input method and shortcut key logic of the input device according to the programming code configuration, and to simulate the interactive effect between the browser and the input device using a web page canvas tool; An input information acquisition module, configured to acquire character information input by a user through the input device, wherein the character information includes: text characters, special characters and graphic symbols; A character typesetting module is configured to parse the character information through the typesetting rules to obtain the typesetting rules of each character information, wherein the typesetting rules include: position, width, height, spacing, font baseline offset, and relative arrangement relationship between character information and lines, and dynamically adjust the line break rules, paragraph alignment, and line height of the character information according to the size limit of the current editing area; The character rendering module is configured to monitor user operation events in real time, adjust the character style of the character information in real time according to the rendering rules and user operation events, and update the typesetting and rendering results; the character style includes: font type, size, color, highlight, thickness and character effects; the user operation events include: mouse movement, text selection and / or style switching.

9. A computer-readable storage medium having a computer program stored thereon, characterized in that: When the program is executed by a processor, the steps of the method according to any one of claims 1 to 7 are implemented.

10. An electronic device, characterized in that: include: one or more processors; And a memory associated with the one or more processors, the memory is used to store program instructions, and when the program instructions are read and executed by the one or more processors, the steps of the method described in any one of claims 1 to 7 are executed.

Images