Text processing method, device, electronic device and medium
By using table view controls and cell class cells in the iOS rich text editor, a data model is created based on the insertion position information, the problem of displaying pictures and text lines is solved, the function of exclusive pictures is realized, and the editing operation of pictures is supported.
Patent Information
- Application Number
- CN202210062576.5
- Authority / Receiving Office
- CN · China
- Patent Type
- Patents(China)
- Current Assignee / Owner
- Filing Date
- 2022-01-19
- Publication Date
- 2025-08-12
- Estimated Expiration
- 2042-01-19
AI Technical Summary
The existing technology cannot realize the function of taking up a single line of pictures in iOS, resulting in pictures and text being displayed on the same line, affecting the display effect of rich text editors.
Use the table view control as the input box for the rich text editor, create an image data model and a text data model by inserting position information, and use cell class units to make layout adjustments to ensure that the image occupies one row.
It realizes that pictures and text are not displayed on the same line in the rich text editor, ensuring that the picture is exclusive to one line, and supporting the preview and deletion of pictures.
Smart Images

Figure CN114386369B_ABST
Abstract
Description
Technical Field
[0001] The present invention relates to the field of computer technology, and in particular to a text processing method, a text processing device, an electronic device, and a computer-readable storage medium. Background Art
[0002] In the existing technology, rich text editing is generally implemented in iOS (Apple's mobile operating system) using UITextView and YYTextView. However, neither UITextView nor YYTextView directly supports the function of displaying images on their own line. Only when the image width is large enough can the image and text be displayed separately. If the image width is smaller than the display width of the TextView (text box control), the image and text will appear on the same line. Summary of the Invention
[0003] In view of the above problems, embodiments of the present invention are proposed to provide a text processing method and a corresponding text processing device, an electronic device, and a computer-readable storage medium that overcome the above problems or at least partially solve the above problems.
[0004] An embodiment of the present invention discloses a text processing method, which provides a table view control used as an input box through a rich text editor of a terminal, wherein the data source of the table view control is a variable array. The method includes:
[0005] When inserting a target image into the input box, determining the insertion position information of the target image;
[0006] Creating a corresponding picture data model and / or text data model according to the insertion position information, and splicing and storing them in the variable array to obtain a changed variable array;
[0007] In the input box, creating a corresponding image unit and / or text unit, and rendering the image unit using the image data model, and / or rendering the text unit using the text data model; wherein the image unit and the text unit are cell-type units;
[0008] The layout of each content unit in the input box is adjusted according to each model in the changed variable array, so as to display the rendered image unit and / or the rendered text unit in the input box.
[0009] Optionally, the input box displays previous text information, and the step of creating a corresponding image data model and / or text data model based on the insertion position information and splicing and storing the data model into the variable array to obtain a changed variable array includes:
[0010] When the target image is inserted after the previous text information, a picture data model and a text data model corresponding to the target image are created, and are sequentially spliced and stored in the variable array to obtain the changed variable array.
[0011] Optionally, creating a corresponding picture data model and / or text data model according to the insertion position information, and splicing and storing them in the variable array to obtain a changed variable array includes:
[0012] When the target image is inserted at the starting position of the first line of the input box, a picture data model and two text data models corresponding to the target image are created;
[0013] The one picture data model is inserted between the two text data models, and the two are spliced and stored in the variable array to obtain the changed variable array.
[0014] Optionally, the input box displays previous text information, and the step of creating a corresponding image data model and / or text data model based on the insertion position information and splicing and storing the data model into the variable array to obtain a changed variable array includes:
[0015] When the target image is inserted into the previous text information, creating an image data model corresponding to the target image;
[0016] Splitting the previous text data model corresponding to the previous text information according to the insertion position of the target image to obtain two split text data models;
[0017] The one picture data model is inserted between the two split text data models and the two are spliced and stored in the variable array to obtain the changed variable array.
[0018] Optionally, the input box displays previous image information, and the step of creating a corresponding image data model and / or text data model based on the insertion position information and splicing and storing the data model into the variable array to obtain a changed variable array includes:
[0019] When the target picture is inserted after the previous picture information, a picture data model and two text data models corresponding to the target picture are created;
[0020] The one picture data model is inserted between the two text data models, and the two are spliced and stored in the variable array to obtain the changed variable array.
[0021] Optionally, creating a corresponding image unit and / or text unit in the input box, and rendering the image unit using the image data model, and / or rendering the text unit using the text data model, includes:
[0022] In the input box, create the same number of picture units as the newly created picture data model, and / or create the same number of text units as the newly created text data model, and use the newly created picture data model to render the newly created picture units in a one-to-one correspondence, and / or use the newly created text data model to render the newly created text units in a one-to-one correspondence.
[0023] Optionally, adjusting the layout of each content unit in the input box according to each model in the changed variable array includes:
[0024] The rendered newly created image unit is displayed in the next row of the row where the insertion position information corresponds to the insertion position, and if the newly created text unit exists, the rendered newly created text unit is displayed in the next row of the row where the newly created image unit is located.
[0025] Optionally, the input box displays previous image information, and the method further includes:
[0026] When deleting the previous picture information, if there is previous text information in both the previous row and the next row of the previous picture unit corresponding to the previous picture information, after deleting the previous picture data model corresponding to the previous picture information in the variable array, the two previous text data models corresponding to the previous text information are merged to obtain a merged text data model.
[0027] Optionally, creating a corresponding image unit and / or text unit in the input box includes:
[0028] Adding a picture display control to the picture unit, and adding a picture preview control and a picture deletion control to the picture display control;
[0029] and / or,
[0030] Add a text display control on the text unit.
[0031] An embodiment of the present invention further discloses a text processing device, which provides a table view control used as an input box through a rich text editor of a terminal, wherein the data source of the table view control is a variable array, and the device includes:
[0032] A determination module, configured to determine insertion position information of the target image when the target image is inserted into the input box;
[0033] A first creation module is used to create a corresponding image data model and / or text data model according to the insertion position information, and splice and store them in the variable array to obtain a changed variable array;
[0034] A second creation module is configured to create a corresponding image unit and / or text unit in the input box, and render the image unit using the image data model, and / or render the text unit using the text data model; wherein the image unit and the text unit are cell-type units;
[0035] An adjustment module is used to adjust the layout of each content unit in the input box according to each model in the changed variable array, so as to display the rendered image unit and / or the rendered text unit in the input box.
[0036] Optionally, the input box displays previous text information, and the first creation module includes:
[0037] The first creation submodule is used to create an image data model and a text data model corresponding to the target image when the target image is inserted after the prior text information, and to splice and store them in the variable array in sequence to obtain the changed variable array.
[0038] Optionally, the first creation module includes:
[0039] A second creation submodule is configured to create an image data model and two text data models corresponding to the target image when the target image is inserted at the starting position of the first line of the input box;
[0040] The first inserting submodule is used to insert the image data model between the two text data models and store the resultant data in the variable array to obtain the changed variable array.
[0041] Optionally, the input box displays previous text information, and the first creation module includes:
[0042] A third creation submodule is configured to create a picture data model corresponding to the target picture when the target picture is inserted into the previous text information;
[0043] a splitting submodule, configured to split the previous text data model corresponding to the previous text information according to the insertion position of the target image to obtain two split text data models;
[0044] The second insertion submodule is used to insert the one picture data model between the two split text data models, splice and store them in the variable array to obtain the changed variable array.
[0045] Optionally, the input box displays previous image information, and the first creation module includes:
[0046] a fourth creation submodule, configured to create a picture data model and two text data models corresponding to the target picture when the target picture is inserted after the previous picture information;
[0047] The third inserting submodule is used to insert the one picture data model between the two text data models, splice and store them in the variable array to obtain the changed variable array.
[0048] Optionally, the second creation module includes:
[0049] The fifth creation submodule is used to create, in the input box, the same number of picture units as the newly created picture data model, and / or, the same number of text units as the newly created text data model, and use the newly created picture data model to render the newly created picture units in a one-to-one correspondence, and / or, use the newly created text data model to render the newly created text units in a one-to-one correspondence.
[0050] Optionally, the adjustment module includes:
[0051] The display submodule is used to display the rendered newly created image unit in the next row of the row where the insertion position information corresponds to the insertion position, and if the newly created text unit exists, display the rendered newly created text unit in the next row of the row where the newly created image unit is located.
[0052] Optionally, the input box displays previous picture information, and the device further includes:
[0053] A deletion module is used to, when deleting the previous picture information, if there is previous text information in both the previous row and the next row of the row where the previous picture unit corresponding to the previous picture information is located, then after deleting the previous picture data model corresponding to the previous picture information in the variable array, merge the two previous text data models corresponding to the previous text information to obtain a merged text data model.
[0054] Optionally, the second creation module includes:
[0055] An adding submodule, configured to add a picture display control to the picture unit, and to add a picture preview control and a picture deletion control to the picture display control;
[0056] and / or,
[0057] Add a text display control on the text unit.
[0058] An embodiment of the present invention further discloses an electronic device, comprising: a processor, a memory, and a computer program stored in the memory and capable of running on the processor, wherein the computer program implements the steps of the above-mentioned text processing method when executed by the processor.
[0059] An embodiment of the present invention further discloses a computer-readable storage medium, on which a computer program is stored. When the computer program is executed by a processor, the steps of the above-mentioned text processing method are implemented.
[0060] The embodiments of the present invention include the following advantages:
[0061] In an embodiment of the present invention, the input box of the rich text editor is a table view control. When a target image is inserted into the input box, a corresponding image data model and / or text data model can be created according to the insertion position information, and corresponding image units and / or text units can be created to display the data content contained in the image data model and / or text data model. Among them, the image unit and the text unit are both set as cell-type units. By adopting the above method, a customized data model is used, an image data model is used to store image data, and a text data model is used to store text data, and different cell-type content units are used accordingly to realize the display and editing of text and images, thereby ensuring that the text and images in the rich text editor are not displayed in the same row, and realizing the function of allowing the image to occupy a row alone. BRIEF DESCRIPTION OF THE DRAWINGS
[0062] Figure 1 This is a flowchart of the steps of a text processing method provided by an embodiment of the present invention;
[0063] Figure 2 is a flowchart of another text processing method provided by an embodiment of the present invention;
[0064] Figure 3 This is a structural block diagram of a text processing device provided by an embodiment of the present invention. DETAILED DESCRIPTION
[0065] To make the above-mentioned objects, features, and advantages of the present invention more clearly understood, the present invention is further described in detail below with reference to the accompanying drawings and specific embodiments. It is obvious that the embodiments described are only some embodiments of the present invention, rather than all embodiments. All other embodiments obtained by persons of ordinary skill in the art based on the embodiments of the present invention are within the scope of protection of the present invention.
[0066] In the prior art, rich text editing functionality is typically implemented using UITextView and YYTextView in iOS (Apple's mobile operating system). However, neither UITextView nor YYTextView directly supports the ability to display images on their own line. This ensures that images and text are not displayed on the same line only when the image width is large enough. If the image width is smaller than the display width of the TextView (text box control), the image and text will appear on the same line, affecting the rich text display quality in the rich text editor.
[0067] One of the core concepts of an embodiment of the present invention is that the input box of the rich text editor is a table view control. When a target image is inserted into the input box, a corresponding image data model and / or text data model can be created according to the insertion position information, and corresponding image units and / or text units can be created to display the data content contained in the image data model and / or text data model. Among them, the image unit and the text unit are both set as cell-type units. By adopting the above method, a customized data model is used, an image data model is used to store image data, and a text data model is used to store text data, and different cell-type content units are used accordingly to realize the display and editing of text and images, thereby ensuring that the text and images in the rich text editor are not displayed in the same row, and realizing the function of allowing the image to occupy a row alone.
[0068] Reference Figure 1 , shows a flowchart of the steps of a text processing method provided by an embodiment of the present invention, which provides a table view control used as an input box through a rich text editor of a terminal, and the data source of the table view control is a variable array. Specifically, the method may include the following steps:
[0069] Step 101: When inserting a target image into the input box, determine the insertion position information of the target image.
[0070] In the embodiments of the present invention, a mobile terminal is an example of a terminal, i.e., a computer device that can be used on the move. Its mobility is primarily reflected in its mobile communication capabilities and portability. Examples include mobile phones, laptops, POS terminals, and in-vehicle computers. Mobile terminals are equipped with operating systems such as Windows Mobile, Symbian, Palm, Android, and iOS.
[0071] A Multi-function Text Editor (MTE) is a text editor that can be embedded in a browser and provides a WYSIWYG experience. UITableView is a table view control in iOS used to display list information. The data source in this table view control is typically an array, with each array element corresponding to a cell.
[0072] In this application, the terminal may be a smart terminal running iOS. In this smart terminal, a UITableView is used to implement rich text editing functionality, with the UITableView serving as the main input box in the rich text editor. When inserting a target image into the input box, the user's insertion location information may be determined first. The insertion location information may refer to contextual information about the insertion location. For example, the user may insert the target image within a previous text message, or insert the target image after a previous image message, etc.
[0073] Step 102: Create a corresponding picture data model and / or text data model according to the insertion position information, and concatenate and store them in the variable array to obtain a changed variable array.
[0074] In an embodiment of the present invention, the data source of the table view control, that is, the variable array stores various data models, and the input content of the input box in the rich text editor can be obtained by splicing the data content of each model in the variable array.
[0075] Users can customize data models. In this application, the data model can be divided into a text data model and a picture data model, which are used to store the text information entered by the user and the selected picture information respectively. All data models are stored in a variable array, and the models in the variable array can be used to render the corresponding cell content units.
[0076] When a user inserts a target image in a rich text editor, an image data model can be created based on the insertion position information of the target image to store the image information corresponding to the target image. In addition, a text data model can also be created at the same time. The text data model is used to adjust the arrangement layout of each content unit in the input box after the target image is inserted.
[0077] In the embodiment of the present invention, the newly created picture data model and / or text data model may be sequentially spliced and stored in a variable array to obtain a changed variable array.
[0078] In one example, the custom data model can be ZZRichTextModel, in which the type attribute in the model is used to indicate the data type; the text attribute is used to store the text content entered by the user; the image attribute is used to store the image selected by the user; the height attribute is used to store the display height of the content unit cell corresponding to the model. If the model is of text type, the height stores the display height of the text; the imgWidth attribute is used to store the display width of the image; and the imageUrl attribute is used to store the address of the network image. When the data type is text type, the text attribute can have a value or be empty. When the text attribute is empty, it indicates that an empty input area is displayed. When the data type is image type, the image attribute or the imageUrl attribute has a value. When the image is a local image, the image is stored in the image attribute. When the image is an online image, the image link is stored in the imageUrl attribute.
[0079] Step 103: Create a corresponding image unit and / or text unit in the input box, and render the image unit using the image data model, and / or render the text unit using the text data model.
[0080] Among them, picture units and text units are cell-type units.
[0081] In an embodiment of the present invention, an input box may use a cell-type content unit to display rich text content. A cell-type content unit may include an image unit and a text unit. There is a one-to-one correspondence between an image data model and an image unit, i.e., one image data model renders one image unit; and a one-to-one correspondence between a text data model and a text unit, i.e., one text data model renders one text unit.
[0082] Therefore, after inserting the target image and creating the corresponding data model, you also need to create the corresponding content unit in the input box and render the data model into the corresponding content unit for display. By using the cell-type content unit to display and edit text and images, because the cell-type unit has the characteristic of occupying a single line, it can ensure that text and images are displayed in different lines, so that images can occupy their own line.
[0083] In a specific implementation, the input box can be a UITableView, and each content cell within the input box can be a UITableViewCell. You can customize a UITableViewCell subclass and add a UITextView instance to the cell to display and edit text. When the model type is text, render a cell of that type. You can also customize a UITableViewCell subclass and add a UIImageView instance to the cell to display an image. When the model type is image, render a cell of that type.
[0084] Step 104 : adjusting the layout of each content unit in the input box according to each model in the changed variable array, so as to display the rendered image unit and / or the rendered text unit in the input box.
[0085] In an embodiment of the present invention, the data models in the variable array are arranged in a certain order, and the arrangement layout of the content units in the input box can be adjusted accordingly according to the models in the changed array. After the adjustment, the newly added rendered image units and / or text units can be displayed in the input box, that is, the inserted target image can be displayed in the input box, and the target image is displayed in a separate line.
[0086] In summary, in an embodiment of the present invention, the input box of the rich text editor is a table view control. When a target image is inserted into the input box, a corresponding image data model and / or text data model can be created according to the insertion position information, and corresponding image units and / or text units can be created to display the data content contained in the image data model and / or text data model. Among them, the image unit and the text unit are both set as cell-type units. By adopting the above method, a customized data model is used, an image data model is used to store image data, and a text data model is used to store text data, and different cell-type content units are used accordingly to realize the display and editing of text and images, thereby ensuring that the text and images in the rich text editor are not displayed in the same row, and realizing the function of allowing the image to occupy a row alone.
[0087] Reference Figure 2 , shows a flowchart of another text processing method provided by an embodiment of the present invention, which provides a table view control used as an input box through a rich text editor of a terminal, and the data source of the table view control is a variable array. Specifically, the following steps may be included:
[0088] Step 201: When inserting a target image into the input box, determine the insertion position information of the target image.
[0089] In this embodiment of the present invention, a table view control is used as the main input box in a rich text editor. The data source of the table view control is a variable array, and the array elements in the variable array can be data models. The basic unit of the input box is a cell-type content unit, and one data model is used to render one content unit.
[0090] When inserting a target image into the input box of a rich text editor, the insertion position information inserted by the user can be determined first.
[0091] Since this step is similar to step 101 , a detailed description may refer to step 101 and will not be repeated here.
[0092] Step 202: Create a corresponding picture data model and / or text data model according to the insertion position information, and concatenate and store them in the variable array to obtain a changed variable array.
[0093] In an embodiment of the present invention, when a user inserts a target image into a rich text editor, an image data model for storing the image information corresponding to the target image can be created based on the target image's insertion position information. Furthermore, a text data model can be simultaneously created. This text data model is used to adjust the arrangement and layout of the content units in the input box after the target image is inserted. The newly created image data model and / or text data model are sequentially concatenated and stored in a variable array to obtain a modified variable array.
[0094] According to the different insertion positions of the target image, the text processing method of the present application has corresponding processing solutions. The following describes the insertion position as inserting after the previous text information.
[0095] In an optional example of the present application, prior text information is displayed in the input box.
[0096] For step 202, the following steps may be performed:
[0097] Sub-step S11, when the target image is inserted after the previous text information, a picture data model and a text data model corresponding to the target image are created, and they are sequentially spliced and stored in the variable array to obtain the changed variable array.
[0098] When inserting a target image after the preceding text, two data models must be created: one for the image and one for the text. The image data model comes first, followed by the text data model. These data models are then combined and stored in a variable array. The image attribute in the image data model can be used to store the target image, while the text attribute in the text data model can be left empty.
[0099] The following explains that the insertion position is the starting position of the first line of the input box.
[0100] In another optional example of the present application, the target image may be inserted at the starting position of the first line of the input box. For step 202, the following steps may be performed:
[0101] Sub-step S12, when the target picture is inserted at the starting position in the first line of the input box, create an image data model and two text data models corresponding to the target picture; insert the one image data model between the two text data models and splice and store them in the variable array to obtain the changed variable array.
[0102] In this embodiment of the present invention, when inserting a target image at the beginning of the first line of an input box, three data models are created: one image data model and two text data models. These data models are then stored in a variable array serving as the data source, with one text data model first, the image data model in the middle, and the remaining text data model at the end.
[0103] Correspondingly, in the input box, create a corresponding image unit and two text units, and use one image data model to render one image unit, and two text units to render two text units respectively using two text data models. In this way, one of the two rendered text units can be displayed in the first line of the input box, the rendered image unit can be displayed in the next line of the first line, and the other of the two rendered text units can be displayed in the next line of the line where the image unit is located. The purpose of using this insertion method is to ensure that after the user adds a picture for picture display, the user can continue to edit the text before and after the picture, ensuring that editing is still possible before the picture.
[0104] The following describes the insertion position as inserting into the previous text information.
[0105] In another optional example of the present application, the input box displays previous text information, and the target image may be inserted into the previous text information. For step 202, the following steps may be performed:
[0106] Sub-step S13, when the target image is inserted into the prior text information, a picture data model corresponding to the target image is created; the prior text data model corresponding to the prior text information is split according to the insertion position of the target image to obtain two split text data models after the split; the one picture data model is inserted between the two split text data models and spliced and stored in the variable array to obtain the changed variable array.
[0107] In this embodiment of the present invention, when inserting a target image into a prior text message, only one corresponding image data model needs to be created. The prior text data model corresponding to the prior text message needs to be split based on the insertion position of the target image and sequentially concatenated and stored in a variable array. The content unit in the input box is adjusted accordingly based on the modified model in the variable array.
[0108] The following describes the insertion position after the previous picture information.
[0109] In another optional example of the present application, the input box displays the previous picture information, and the target picture may be inserted after the previous picture information. For step 202, the following steps may be performed:
[0110] Sub-step S14, when the target image is inserted after the prior image information, creates an image data model and two text data models corresponding to the target image; inserts the image data model between the two text data models and splices and stores them in the variable array to obtain the changed variable array.
[0111] In an embodiment of the present invention, when inserting a target image after a previous image, three data models need to be created: one image data model and two text data models. These data models are then spliced and stored in a variable array serving as the data source, with one text data model in the front, the image data model in the middle, and the remaining text data model in the back. The content units in the input box are adjusted accordingly based on the models in the modified variable array. The cursor can be positioned in the newly created text unit, ensuring that text editing is possible between the two images.
[0112] It should be noted that there may be many other situations for the insertion position of the target image. In other cases, the method of the present application can still be used for processing to achieve the function of the image occupying a single line. Those skilled in the art should know that it still belongs to the inventive content of the present invention.
[0113] Step 203: In the input box, create the same number of picture units as the newly created picture data model, and / or create the same number of text units as the newly created text data model, and use the newly created picture data model to render the newly created picture units one-to-one, and / or use the newly created text data model to render the newly created text units one-to-one.
[0114] Among them, picture units and text units are cell-type units.
[0115] In an embodiment of the present invention, after creating a data model, the same number of corresponding content units need to be created in the input box to display the newly created data model. Therefore, corresponding image units and text units need to be created, and the newly created image data model is used to render the newly created image unit, and the newly created text data model is used to render the newly created text unit.
[0116] In one embodiment, corresponding to the above sub-step S11, step 203 may perform the following steps:
[0117] In the input box, a corresponding image unit and a corresponding text unit are created, and the image unit is rendered using the image data model, and the text unit is rendered using the text data model.
[0118] That is, a corresponding image unit and a corresponding text unit may be created, and a newly created image data model may be used to render the image unit, and a newly created text data model may be used to render the text unit.
[0119] Step 204, display the rendered newly created image unit in the next line of the line where the insertion position information corresponds to the insertion position, and if the newly created text unit exists, display the rendered newly created text unit in the next line of the line where the newly created image unit is located.
[0120] In an embodiment of the present invention, to display each data model in the changed variable array in the input box, it is necessary to adjust the arrangement layout of the content units accordingly, that is, to display the rendered newly created image unit in the line below the line where the insertion position information corresponds to the insertion position, and if there is a newly created text unit, to display the rendered newly created text unit in the line below the line where the newly created image unit is located, so that the image selected by the user can be displayed in the input box and the cursor can be positioned in the newly created text unit. By inserting the image using the above method, the user can perform editing operations before or after the inserted image.
[0121] In one embodiment, corresponding to the above sub-step S11, step 204 may perform the following steps:
[0122] The rendered image unit is displayed in a row next to the row where the previous text unit corresponding to the previous text information is located, and the rendered text unit is displayed in a row next to the row where the image unit is located.
[0123] The prior text information has a corresponding prior text data model and a prior text unit. In the present application, after inserting the target image, the data models in the variable array include at least the prior text data model, the newly created image data model, and the newly created text data model in order. To display the changed data models in the variable array in the input box, it is necessary to adjust the arrangement and layout of the content units accordingly, that is, to display a rendered image unit in the next row of the row where the prior text unit corresponding to the prior text information is located, and to display a rendered text unit in the next row of the row where the image unit is located, so that the user's selected image can be displayed in the input box, and then the cursor can be positioned in the newly created text unit.
[0124] In one implementation, the reloadData method of UITableView may be used to refresh the display of the image.
[0125] In another optional example of the present application, the input box displays the previous picture information, and the previous picture can also be deleted in the input box.
[0126] When deleting the previous picture information, if there is previous text information in both the previous row and the next row of the previous picture unit corresponding to the previous picture information, after deleting the previous picture data model corresponding to the previous picture information in the variable array, the two previous text data models corresponding to the previous text information are merged to obtain a merged text data model.
[0127] In this embodiment of the present invention, when a user deletes a previous image, if there is text before or after the previous image, the two previous text models are merged into one. The original previous image model and the previous text model after the previous image are then deleted from the variable array before refreshing the display. After refreshing, the text before and after the previous image is merged into a single text unit for display, and the deleted image is no longer displayed.
[0128] In an optional example of the present application, creating a corresponding image unit and / or text unit in the input box includes:
[0129] Adding a picture display control to the picture unit, and adding a picture preview control and a picture deletion control to the picture display control; and / or adding a text display control to the text unit.
[0130] In a specific implementation, you can customize a UITableViewCell subclass and add a UITextView instance to the cell to display and edit text. When the model type is text, render a cell of that type. You can also customize a UITableViewCell subclass and add a UIImageView instance to the cell to display images; add a UITapGestureRecognizer instance to the UIImageView instance to implement the click preview function; and add a UIButton instance to the UIImageView instance to implement the image deletion function. When the model type is image, render a cell of that type.
[0131] In order to enable those skilled in the art to better understand the embodiments of the present invention, an example is given below to illustrate:
[0132] In mobile terminals, UITableView is used to implement a rich text editor, and tableView is used to define two types of cells: one for editing text and the other for displaying images. The cell for editing text mainly uses UITextView to display and edit text. The cell for displaying images mainly uses UIImageView and UITapGestureRecognizer to display and click on images, and then uses another UIButton to implement the image deletion function. Custom data models are divided into text type and image type to store the text entered by the user and the selected image. Then, the data model is created in sequence for the text and image entered by the user, and an array is used to store these data models. Finally, the model in the array is used to render the corresponding cell.
[0133] Editing in the rich text editor can include:
[0134] 1. Initialize a UITableView instance object as the total input box.
[0135] 2. Initialize a variable array as the data source of the UITableView instance object to store various models.
[0136] 3. When entering the editor for the first time, create a text type model and display a cell for editing text so that users can edit the text.
[0137] 4. When the user inserts an image after a text cell, after selecting the image, a model of the image type is created using the selected image, followed by a model of the text type. Both models are added to an array, with each model in the array corresponding to a cell. Finally, the tableView's reloadData method is used to refresh the display. The added image is displayed, and the cursor is positioned in the next row, which is the newly added text editing cell. This allows users to edit both before and after the image.
[0138] 5. When the user adds an image at the beginning of the first line of the input box, you need to add a text model, an image model, and another text model to the array in order and refresh the display. The purpose is to ensure that after the user selects an image, they can enter text before the image. That is, leave a blank text editing line in the first line. After the image is displayed, the user can continue to edit text before and after the image.
[0139] 6. When the user adds an image in the middle of a text cell, the original text model needs to be split into two text models according to the cursor position, and then the image model is inserted into the two models and refreshed. Because the image model is inserted between the two text models, there is a text model behind the image model, so there is no need to add an additional text model.
[0140] 7. When the user chooses to add another image after an image, a text model needs to be added before and after the new image model. Then, all three models are added to the array and refreshed. The cursor is positioned in the text editing cell after the newly added image. This ensures that text editing is possible between the two images.
[0141] 8. When a user deletes an image, if there is text before and after the image, the two text models need to be merged into one. Then, the original image model and the text model after the image are deleted from the array and the display is refreshed. After the refresh, the text before and after the original image is merged into a single text cell for display, and the deleted image is not displayed.
[0142] 9. Concatenate the text and image contents of each model in the array to obtain the input content of the rich text editor.
[0143] In summary, in an embodiment of the present invention, the input box of the rich text editor is a table view control. When a target image is inserted into the input box, a corresponding image data model and / or text data model can be created according to the insertion position information, and corresponding image units and / or text units can be created to display the data content contained in the image data model and / or text data model. Among them, the image unit and the text unit are both set as cell-type units. By adopting the above method, a customized data model is used, an image data model is used to store image data, and a text data model is used to store text data, and different cell-type content units are used accordingly to realize the display and editing of text and images, thereby ensuring that the text and images in the rich text editor are not displayed in the same row, and realizing the function of allowing the image to occupy a row alone. The present invention provides an implementation scheme of a rich text editor that can allow a picture to occupy a row alone, can respond to a picture click event to preview the picture in the editing state, and has a picture delete button. By using different tableViewCells to realize the display and editing of text and images, it can be ensured that the text and images are in different rows, thereby realizing the function of allowing the picture to occupy a row alone.
[0144] It should be noted that for the sake of simplicity, the method embodiments are described as a series of actions. However, those skilled in the art should be aware that the embodiments of the present invention are not limited by the order of the actions described, because according to the embodiments of the present invention, certain steps can be performed in other orders or simultaneously. Secondly, those skilled in the art should also be aware that the embodiments described in this specification are all preferred embodiments, and the actions involved are not necessarily required by the embodiments of the present invention.
[0145] Reference Figure 3 , shows a structural block diagram of a text processing device provided by an embodiment of the present invention, which provides a table view control used as an input box through a rich text editor of a terminal. The data source of the table view control is a variable array, and specifically includes the following modules:
[0146] A determination module 301 is configured to determine the insertion position information of the target image when the target image is inserted into the input box;
[0147] A first creation module 302 is configured to create a corresponding image data model and / or text data model according to the insertion position information, and concatenate and store the data into the variable array to obtain a changed variable array;
[0148] A second creation module 303 is configured to create a corresponding image unit and / or text unit in the input box, and render the image unit using the image data model, and / or render the text unit using the text data model; wherein the image unit and the text unit are cell-type units;
[0149] The adjustment module 304 is configured to adjust the layout of each content unit in the input box according to each model in the changed variable array, so as to display the rendered image unit and / or the rendered text unit in the input box.
[0150] In an embodiment of the present invention, the input box displays previous text information, and the first creation module includes:
[0151] The first creation submodule is used to create an image data model and a text data model corresponding to the target image when the target image is inserted after the prior text information, and to splice and store them in the variable array in sequence to obtain the changed variable array.
[0152] In an embodiment of the present invention, the first creation module includes:
[0153] A second creation submodule is configured to create an image data model and two text data models corresponding to the target image when the target image is inserted at the starting position of the first line of the input box;
[0154] The first inserting submodule is used to insert the image data model between the two text data models and store the resultant data in the variable array to obtain the changed variable array.
[0155] In an embodiment of the present invention, the input box displays previous text information, and the first creation module includes:
[0156] A third creation submodule is configured to create a picture data model corresponding to the target picture when the target picture is inserted into the previous text information;
[0157] a splitting submodule, configured to split the previous text data model corresponding to the previous text information according to the insertion position of the target image to obtain two split text data models;
[0158] The second insertion submodule is used to insert the one picture data model between the two split text data models, splice and store them in the variable array to obtain the changed variable array.
[0159] In an embodiment of the present invention, the input box displays previous image information, and the first creation module includes:
[0160] a fourth creation submodule, configured to create a picture data model and two text data models corresponding to the target picture when the target picture is inserted after the previous picture information;
[0161] The third inserting submodule is used to insert the one picture data model between the two text data models, splice and store them in the variable array to obtain the changed variable array.
[0162] In this embodiment of the present invention, the second creation module includes:
[0163] The fifth creation submodule is used to create, in the input box, the same number of picture units as the newly created picture data model, and / or, the same number of text units as the newly created text data model, and use the newly created picture data model to render the newly created picture units in a one-to-one correspondence, and / or, use the newly created text data model to render the newly created text units in a one-to-one correspondence.
[0164] In an embodiment of the present invention, the adjustment module includes:
[0165] The display submodule is used to display the rendered newly created image unit in the next row of the row where the insertion position information corresponds to the insertion position, and if the newly created text unit exists, display the rendered newly created text unit in the next row of the row where the newly created image unit is located.
[0166] In an embodiment of the present invention, the input box displays previous image information, and the device further includes:
[0167] A deletion module is used to, when deleting the previous picture information, if there is previous text information in both the previous row and the next row of the row where the previous picture unit corresponding to the previous picture information is located, then after deleting the previous picture data model corresponding to the previous picture information in the variable array, merge the two previous text data models corresponding to the previous text information to obtain a merged text data model.
[0168] In this embodiment of the present invention, the second creation module includes:
[0169] An adding submodule, configured to add a picture display control to the picture unit, and to add a picture preview control and a picture deletion control to the picture display control;
[0170] and / or,
[0171] Add a text display control on the text unit.
[0172] In summary, in an embodiment of the present invention, the input box of the rich text editor is a table view control. When a target image is inserted into the input box, a corresponding image data model and / or text data model can be created according to the insertion position information, and corresponding image units and / or text units can be created to display the data content contained in the image data model and / or text data model. Among them, the image unit and the text unit are both set as cell-type units. By adopting the above method, a customized data model is used, an image data model is used to store image data, and a text data model is used to store text data, and different cell-type content units are used accordingly to realize the display and editing of text and images, thereby ensuring that the text and images in the rich text editor are not displayed in the same row, and realizing the function of allowing the image to occupy a row alone.
[0173] As for the device embodiment, since it is basically similar to the method embodiment, the description is relatively simple, and the relevant parts can be referred to the partial description of the method embodiment.
[0174] An embodiment of the present invention also provides an electronic device, comprising: a processor, a memory, and a computer program stored in the memory and capable of running on the processor. When the computer program is executed by the processor, the various processes of the above-mentioned text processing method embodiment are implemented and the same technical effect can be achieved. To avoid repetition, it will not be repeated here.
[0175] An embodiment of the present invention also provides a computer-readable storage medium, on which a computer program is stored. When the computer program is executed by a processor, the various processes of the above-mentioned text processing method embodiment are implemented and the same technical effect can be achieved. To avoid repetition, it will not be repeated here.
[0176] The various embodiments in this specification are described in a progressive manner, and each embodiment focuses on the differences from other embodiments. The same or similar parts between the various embodiments can be referenced to each other.
[0177] Those skilled in the art will appreciate that embodiments of the present invention may be provided as methods, apparatus, or computer program products. Thus, embodiments of the present invention may take the form of a fully hardware embodiment, a fully software embodiment, or an embodiment combining software and hardware. Furthermore, embodiments of the present invention may take the form of a computer program product implemented on one or more computer-usable storage media (including but not limited to magnetic disk storage, CD-ROM, optical storage, etc.) containing computer-usable program code.
[0178] The embodiments of the present invention are described with reference to the flowcharts and / or block diagrams of the methods, terminal devices (systems), and computer program products according to the embodiments of the present invention. It should be understood that each process and / or block in the flowchart and / or block diagram, as well as the combination of the processes and / or blocks in the flowchart and / or block diagram, can be implemented by computer program instructions. These computer program instructions can be provided to a processor of a general-purpose computer, a special-purpose computer, an embedded processor, or other programmable data processing terminal device to produce a machine, so that the instructions executed by the processor of the computer or other programmable data processing terminal device generate instructions for implementing the process in the flowchart and / or block diagram. 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.
[0179] These computer program instructions may also be stored in a computer readable memory that can direct a computer or other programmable data processing terminal device to operate in a specific manner, so that the instructions stored in the computer readable memory produce a manufactured product including an instruction device, which implements the process Figure 1 a process or multiple processes and / or boxes Figure 1 The function specified in one or more boxes.
[0180] These computer program instructions can also be loaded onto a computer or other programmable data processing terminal device so that a series of operating steps are executed on the computer or other programmable terminal device to produce a computer-implemented process, thereby providing instructions for executing on the computer or other programmable terminal device to implement the process. Figure 1 a process or multiple processes and / or boxes Figure 1 A step that specifies a function in one or more boxes.
[0181] Although the preferred embodiments of the present invention have been described, those skilled in the art may make additional changes and modifications to these embodiments once they become aware of the basic creative concepts. Therefore, the appended claims are intended to be interpreted as including the preferred embodiments and all changes and modifications that fall within the scope of the embodiments of the present invention.
[0182] Finally, it should be noted that, in this document, relational terms such as first and second, etc., are used only to distinguish one entity or operation from another entity or operation, and do not necessarily require or imply any actual relationship or order between these entities or operations. Moreover, the terms "comprises," "comprising," or any other variations thereof are intended to cover non-exclusive inclusion, such that a process, method, article, or terminal device that includes a series of elements includes not only those elements, but also other elements not explicitly listed, or elements inherent to such process, method, article, or terminal device. In the absence of further limitations, an element defined by the phrase "comprising a ..." does not exclude the presence of additional identical elements in the process, method, article, or terminal device that includes the element.
[0183] The above describes in detail a text processing method and a text processing device, an electronic device, and a computer-readable storage medium provided by the present invention. Specific examples are used herein to illustrate the principles and implementation methods of the present invention. The description of the above embodiments is only used to help understand the method of the present invention and its core idea. At the same time, for those skilled in the art, according to the idea of the present invention, there may be changes in the specific implementation methods and application scope. In summary, the content of this specification should not be understood as limiting the present invention.
Claims
1. A text processing method, characterized in that: A table view control used as an input box is provided through a rich text editor of a terminal, wherein the data source of the table view control is a variable array, and the method includes: When inserting a target image into the input box, determining the insertion position information of the target image; Creating a corresponding picture data model and / or text data model according to the insertion position information, and splicing and storing them in the variable array to obtain a changed variable array; In the input box, creating corresponding image units and / or text units, and rendering the image units using the image data model, and / or rendering the text units using the text data model; wherein the image units and the text units are cell-type units; Adjusting the layout of each content unit in the input box according to each model in the changed variable array, so as to display the rendered image unit and / or the rendered text unit in the input box; Wherein, creating corresponding picture units and / or text units in the input box includes: Adding a picture display control to the picture unit, and adding a picture preview control and a picture deletion control to the picture display control; and / or adding a text display control to the text unit.
2. The method according to claim 1, characterized in that The input box displays the previous text information, and the corresponding image data model and / or text data model is created according to the insertion position information, and the image data model and / or text data model are spliced and stored in the variable array to obtain a changed variable array, including: When the target image is inserted after the previous text information, a picture data model and a text data model corresponding to the target image are created, and are sequentially spliced and stored in the variable array to obtain the changed variable array.
3. The method according to claim 1, characterized in that The step of creating a corresponding picture data model and / or text data model according to the insertion position information and splicing and storing the data model into the variable array to obtain a changed variable array includes: When the target image is inserted at the starting position of the first line of the input box, a picture data model and two text data models corresponding to the target image are created; The one picture data model is inserted between the two text data models, and the two are spliced and stored in the variable array to obtain the changed variable array.
4. The method according to claim 1, wherein The input box displays the previous text information, and the corresponding image data model and / or text data model is created according to the insertion position information, and the image data model and / or text data model are spliced and stored in the variable array to obtain a changed variable array, including: When the target image is inserted into the previous text information, creating an image data model corresponding to the target image; Splitting the previous text data model corresponding to the previous text information according to the insertion position of the target image to obtain two split text data models; The one picture data model is inserted between the two split text data models and the two are spliced and stored in the variable array to obtain the changed variable array.
5. The method according to claim 1, wherein The input box displays the previous image information, and the corresponding image data model and / or text data model is created according to the insertion position information, and the images and / or text data models are spliced and stored in the variable array to obtain a changed variable array, including: When the target picture is inserted after the previous picture information, a picture data model and two text data models corresponding to the target picture are created; The one picture data model is inserted between the two text data models, and the two are spliced and stored in the variable array to obtain the changed variable array.
6. The method according to any one of claims 2 to 5, characterized in that The step of creating a corresponding image unit and / or text unit in the input box, and rendering the image unit using the image data model, and / or rendering the text unit using the text data model, includes: In the input box, create the same number of picture units as the newly created picture data model, and / or create the same number of text units as the newly created text data model, and use the newly created picture data model to render the newly created picture units in a one-to-one correspondence, and / or use the newly created text data model to render the newly created text units in a one-to-one correspondence.
7. The method according to claim 6, characterized in that The adjusting the layout of each content unit in the input box according to each model in the changed variable array includes: The rendered newly created image unit is displayed in the next row of the row where the insertion position information corresponds to the insertion position, and if the newly created text unit exists, the rendered newly created text unit is displayed in the next row of the row where the newly created image unit is located.
8. The method according to claim 1, characterized in that The input box displays previous picture information, and the method further includes: When deleting the previous picture information, if there is previous text information in both the previous row and the next row of the previous picture unit corresponding to the previous picture information, after deleting the previous picture data model corresponding to the previous picture information in the variable array, the two previous text data models corresponding to the previous text information are merged to obtain a merged text data model.
9. A text processing device, characterized in that: A table view control used as an input box is provided through a rich text editor of a terminal, wherein the data source of the table view control is a variable array, and the apparatus includes: A determination module, configured to determine insertion position information of the target image when the target image is inserted into the input box; A first creation module is used to create a corresponding image data model and / or text data model according to the insertion position information, and splice and store them in the variable array to obtain a changed variable array; A second creation module is configured to create a corresponding image unit and / or text unit in the input box, and render the image unit using the image data model, and / or render the text unit using the text data model; wherein the image unit and the text unit are cell-type units; an adjusting module, configured to adjust the layout of each content unit in the input frame according to each model in the changed variable array, so as to display the rendered image unit and / or the rendered text unit in the input frame; The second creation module includes: The adding submodule is used to add a picture display control on the picture unit, and to add a picture preview control and a picture deletion control on the picture display control; and / or to add a text display control on the text unit.
10. An electronic device, characterized in that: include: A processor, a memory, and a computer program stored in the memory and capable of running on the processor, wherein when the computer program is executed by the processor, the steps of a text processing method according to any one of claims 1 to 8 are implemented.
11. A computer-readable storage medium, characterized in that The computer-readable storage medium stores a computer program, and when the computer program is executed by a processor, the steps of a text processing method according to any one of claims 1 to 8 are implemented.
Citation Information
Patent Citations
Method and system for typesetting and rendering image-text mixed content
CN103678267A