A method, apparatus, electronic device, and medium for image editing
By creating a custom view control object and initializing its width according to the input box width, the problem of pictures and text lines in rich text editing controls under iOS platform is solved, and the display and click preview function of exclusive image lines is realized.
Patent Information
- Application Number
- CN202111424977.2
- Authority / Receiving Office
- CN · China
- Patent Type
- Patents(China)
- Current Assignee / Owner
- Filing Date
- 2021-11-26
- Publication Date
- 2025-06-24
- Estimated Expiration
- 2041-11-26
AI Technical Summary
On the iOS platform, rich text editing controls such as UITextView and YYTextView do not directly support the function of taking up a single line of images, resulting in pictures and text that may appear on the same line, affecting the display effect of the rich text editor.
By creating a custom view control object, initialize its width according to the width of the input box, and assign it to the first property of the view control object to display the picture exclusively in the input box.
It realizes the display of the image with one line in the input box, avoiding the problem of the image and text appearing on the same line, and supports the image click preview event and the correct position display of the cursor.
Smart Images

Figure CN114116077B_ABST
Abstract
Description
Technical Field
[0001] The present invention relates to the field of computer technology, and particularly to an image editing method, an image editing device, an electronic device, and a computer-readable storage medium. Background Art
[0002] In the prior art, to implement the rich text editing function under iOS (a mobile operating system developed by Apple Inc.), generally UITextView and YYTextView are used currently. However, neither UITextView nor YYTextView directly supports the function that a picture occupies a single line. Only when the width of the picture is large enough can it be ensured that the picture and the text do not appear on the same line. If the width of the picture is less than the display width of the TextView (a text box control), the picture and the 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 an image editing method and a corresponding image editing device, an electronic device, and a computer-readable storage medium that overcome the above problems or at least partially solve the above problems.
[0004] Embodiments of the present invention disclose an image editing method. A view control object used as an input box is provided through a rich text editor of a terminal. The method includes:
[0005] When adding a target picture to the input box, a custom view control object for the target picture is created by inheritance;
[0006] The width of the custom view control object is initialized according to the width of the input box;
[0007] The initialized custom view control object is assigned to a first attribute of a control class included in the view control object to display the target picture in the input box; the first attribute is used to store the picture information to be displayed.
[0008] Optionally, the step of when adding a target picture to the input box, creating a custom view control object for the target picture by inheritance includes:
[0009] An image display control object is added to the custom view control object, and a gesture processor is added to the image display control object; the gesture processor is used to trigger a picture click preview event.
[0010] Optionally, assigning the initialized custom view control object to the first property of the control class included in the view control object to display the target picture in the input box includes:
[0011] Taking the attribute information included in the first property as input parameter information and passing it into a preset call method to generate a corresponding rich text string object;
[0012] Assigning the rich text string object to the second property of the view control object to display the target picture in the input box; the second property is used to display the included attribute information in the input box.
[0013] Optionally, the method further includes:
[0014] Monitoring input events for the input box;
[0015] When an input event for the input box is monitored, triggering a preset proxy method for the input box and intercepting the input content of the input event based on the preset proxy method;
[0016] Determining the input position of the input content, and determining a corresponding input strategy for input processing according to the input content and the input position, so that after the input content is added to the input box, the cursor of the input box is not at the starting position of the picture or the starting position of the custom view control object.
[0017] Optionally, determining a corresponding input strategy for input processing according to the input content and the input position includes:
[0018] Judging whether the input content is a deletion character; and / or, judging whether the input position is the starting position of the picture or the starting position of the custom view control object;
[0019] Determining a corresponding input strategy for input processing according to the judgment result.
[0020] Optionally, determining a corresponding input strategy for input processing according to the judgment result includes:
[0021] If the input content is not a deletion character and the input position is the starting position of the picture or the starting position of the custom view control object, adding a line break after the text information included in the input content, and converting the processed text information into rich text information and displaying it in the input box.
[0022] Optionally, determining a corresponding input strategy for input processing according to the judgment result includes:
[0023] If the input content is a deletion character, the content to be deleted is a line break, the deletion position is not the starting position of the input box, and the next position after the position where the line break to be deleted is located is the position of a picture or the position of a custom view control object, then move the cursor before the line break, delete one character before the line break, and convert the remaining text information after deletion into rich text information and display it in the input box.
[0024] An embodiment of the present invention also discloses a picture editing device, which provides a view control object used as an input box through a rich text editor of a terminal. The device includes:
[0025] A creation module, configured to create a custom view control object for the target picture by inheritance when adding a target picture to the input box;
[0026] An initialization module, configured to initialize the width of the custom view control object according to the width of the input box;
[0027] An assignment module, configured to assign the initialized custom view control object to a first attribute of a control class included in the view control object, so as to display the target picture in the input box; the first attribute is used to store picture information to be displayed.
[0028] Optionally, the creation module includes:
[0029] An addition sub-module, configured to add a picture display control object to the custom view control object, and add a gesture processor to the picture display control object; the gesture processor is used to trigger a picture click preview event.
[0030] Optionally, the assignment module includes:
[0031] A generation sub-module, configured to use the attribute information included in the first attribute as input parameter information and pass it into a preset call method to generate a corresponding rich text string object;
[0032] An assignment sub-module, configured to assign the rich text string object to a second attribute of the view control object, so as to display the target picture in the input box; the second attribute is used to display the included attribute information in the input box.
[0033] Optionally, the device further includes:
[0034] A monitoring module, configured to monitor input events for the input box;
[0035] An interception module, configured to trigger a preset proxy method for the input box when the input event for the input box is monitored, and intercept the input content of the input event based on the preset proxy method;
[0036] A determination module, configured to determine the input position of the input content, and determine a corresponding input strategy for input processing according to the input content and the input position, so that after the input content is added to the input box, the cursor of the input box is not at the starting position of the picture or the starting position of the custom view control object.
[0037] Optionally, the determination module includes:
[0038] A judgment sub-module, configured to judge whether the input content is a deletion character; and / or, judge whether the input position is the starting position of the picture or the starting position of the custom view control object;
[0039] A determination sub-module, configured to determine a corresponding input strategy for input processing according to the judgment result.
[0040] Optionally, the determination sub-module includes:
[0041] A first display unit, configured to add a line break after the text information included in the input content if the input content is not a deletion character and the input position is the starting position of the picture or the starting position of the custom view control object, and convert the processed text information into rich text information and display it in the input box.
[0042] Optionally, the determination sub-module includes:
[0043] A second display unit, configured to move the cursor to before the line break, delete a character before the line break, and convert the remaining text information after deletion into rich text information and display it in the input box if the input content is a deletion character, the content to be deleted is a line break, the deletion position is not the starting position of the input box, and the next position of the position where the line break to be deleted is located is the position where the picture is located or the position where the custom view control object is located.
[0044] An embodiment of the present invention also discloses an electronic device, including: a processor, a memory, and a computer program stored on the memory and capable of running on the processor, where when the computer program is executed by the processor, the steps of a picture editing method as described above are implemented.
[0045] An embodiment of the present invention also discloses a computer-readable storage medium, where a computer program is stored on the computer-readable storage medium, and when the computer program is executed by a processor, the steps of a picture editing method as described above are implemented.
[0046] The embodiments of the present invention include the following advantages:
[0047] In the embodiments of the present invention, when it is necessary to insert a picture into an input box, a custom view control object for the picture is created, and the width of the custom view control object is initialized according to the width of the input box. By adopting the above method, the width of the custom view control object for displaying the picture is kept consistent with the width of the input box, and then the custom view control object is assigned to the first property in the view control object for picture display, so that the picture can be displayed on a single line in the input box. Description of the Drawings
[0048] Figure 1 is a flowchart of the steps of a picture editing method provided by the embodiments of the present invention;
[0049] Figure 2 is a flowchart of the steps of another picture editing method provided by the embodiments of the present invention;
[0050] Figure 3 is a schematic diagram of the cursor displayed at the starting position of the picture;
[0051] Figure 4 is a schematic diagram of the cursor displayed at the ending position of the picture;
[0052] Figure 5 is a schematic diagram of the processing flow of the rich text editor in response to an input event provided by the embodiments of the present invention;
[0053] Figure 6 is a block diagram of the structure of a picture editing device provided by the embodiments of the present invention. Detailed Embodiments
[0054] To make the above objects, features, and advantages of the present invention more obvious and understandable, the present invention will be further described in detail below with reference to the drawings and specific embodiments. Obviously, the described embodiments are only a part of the embodiments of the present invention, rather than all of the embodiments. Based on the embodiments of the present invention, all other embodiments obtained by those of ordinary skill in the art shall fall within the protection scope of the present invention.
[0055] In the prior art, to implement the rich text editing function under iOS (a mobile operating system developed by Apple Inc.), UITextView and YYTextView are generally used. However, neither UITextView nor YYTextView directly supports the function of allowing an image to occupy a single line. Only when the width of the image is large enough can it be ensured that the image and text do not appear on the same line. If the width of the image is less than the display width of the TextView (a text box control), the image and text will appear on the same line, thus affecting the display effect of the rich text in the rich text editor.
[0056] In addition, for the rich text editor implemented based on YYTextView, besides not being able to ensure that an image occupies a single line, in the editing mode, it also does not support clicking on an image to enter the large image preview mode. Because although the part where YYTextView sets the highlight can listen to the click method, this click method does not respond in the editing state. Moreover, when there is text on the line above the image, if text input or deletion operations are performed in front of the image, there will be a problem that after inputting or deleting text, the cursor stays in front of the image but the operation is on the text of the previous line, which does not conform to the user's operation expectation.
[0057] One of the core concepts of the embodiments of the present invention is that when an image needs to be inserted into the input box, a custom view control object for the image is created, and the width of the custom view control object is initialized according to the width of the input box. By adopting the above method, keeping the width of the custom view control object for displaying the image consistent with the width of the input box, and then assigning the custom view control object to the first attribute in the view control object for image display, it can be ensured that the image occupies a single line and is displayed in the input box.
[0058] Refer to Figure 1 , which shows the step flowchart of a method for image editing provided by the embodiments of the present invention. By providing a view control object used as an input box through the rich text editor of the terminal, it may specifically include the following steps:
[0059] Step 101, when adding a target image to the input box, create a custom view control object for the target image by inheritance.
[0060] The terminal can be a mobile terminal. A mobile terminal, i.e., a mobile communication terminal, refers to a computer device that can be used while moving. Its mobility is mainly reflected in its mobile communication ability and portable size. It can include mobile phones, laptops, POS machines, and even in-vehicle computers. The mobile terminal has an operating system, such as Windows Mobile, Symbian, Palm, Android, iOS, etc. A rich text editor, Multi-function Text Editor, abbreviated as MTE, is a text editor that can be embedded in a browser and is what-you-see-is-what-you-get. YYKit is a large and feature-rich set of iOS components. Among them, YYText provides a powerful iOS rich text framework. In the embodiment of the present invention, the YYTextView can be used to implement the rich text editing function, and a view control object serving as an input box in the rich text editor is provided through the YYTextView.
[0061] UIVIew is a view object in iOS, which is the base class of all objects displayed on the screen. All objects displayed on the screen inherit from UIView.
[0062] In the embodiment of the present invention, when adding a target picture to the input box, a custom view control object for the target picture can be created by inheritance. Specifically, the custom view control object can be a subclass that customarily inherits from UIView, denoted as NTImageAttachmentContent. This custom view control object supports passing in the picture information for the target picture and calculates the display size of the picture according to the picture display rule and then displays the picture. In one example, if the target picture is a local picture, the picture information of the local picture can be directly passed into the custom view control object; if the target picture is a network picture, the address information of the network picture can be passed into the custom view control object.
[0063] Step 102: Initialize the width of the custom view control object according to the width of the input box.
[0064] In the embodiment of the present invention, the width of the custom view control object is determined according to the width of the input box. Keeping the width of the entire custom view control object consistent with the width of the input box can ensure that pictures of any size can be displayed on a single line exclusively.
[0065] Step 103: Assign the initialized custom view control object to the first property of the control class included in the view control object to display the target picture in the input box.
[0066] In the embodiment of the present invention, the control class included in the view control object has a first attribute, the control class is used to display pictures, and the first attribute is used to store the picture information to be displayed. By using the initialized custom view control object (including the picture information of the target picture) as the attribute information of the first attribute in the control class, the target picture can be displayed in the input box. By assigning the first attribute to the custom view control object instead of directly assigning the picture to be displayed, it can be ensured that the picture can be displayed in a single line.
[0067] In a specific implementation, the control class of the view control object can be YYTextAttachment, which is a class cluster of NSAttributedString, and its instance is used as the value of the rich text key attribute YYTextAttachmentAttributeName. When the rich text contains YYTextAttachment, it will be displayed using text rules. For example, when the content of the attachment is UIImage, it will be drawn as CGContext; when the content of the attachment is UIView or CALayer, it will be added to the view layer or layer layer of the text container. The first attribute of the control class is the content attribute in YYTextAttachment. The above assignment process is equivalent to assigning the instance object of NTImageAttachmentContent to the content attribute in YYTextAttachment to generate a YYTextAttachment instance object.
[0068] In summary, in the embodiment of the present invention, when a picture needs to be inserted into an input box, a custom view control object for the picture is created, and the width of the custom view control object is initialized according to the width of the input box. By adopting the above method, the width of the custom view control object used to display the picture is kept consistent with the width of the input box, and then the custom view control object is assigned to the first attribute in the view control object to display the picture, so that the picture can be displayed in a single line in the input box.
[0069] Reference Figure 2 , shows a flowchart of another picture editing method provided by an embodiment of the present invention, which provides a view control object used as an input box through a rich text editor of a terminal, and specifically may include the following steps:
[0070] Step 201, when a target image is added to the input box, a custom view control object for the target image is created by inheritance.
[0071] In an embodiment of the present invention, a view control object is used as the input box of a rich text editor. When adding a target picture to this input box, a custom view control object for displaying the target picture can be created by inheritance, that is, storing the picture information of the target picture in the container of the custom view control object.
[0072] Since this step is similar to step 101, for a detailed description, reference can be made to step 101 and will not be elaborated here.
[0073] For step 201, the following sub-steps can be executed:
[0074] Sub-step S11, adding a picture display control object to the custom view control object, and adding a gesture processor to the picture display control object.
[0075] Among them, the gesture processor is used to trigger the picture click preview event.
[0076] In an alternative embodiment of the present invention, adding a picture display control object to the custom view control object as the display control of the picture, the display width of the picture display control object can be set according to the actual needs of the user. By adding a gesture processor to the picture display control object, it is possible to perform a picture click operation in the editing state for picture zoom-in preview. That is, the custom view control object provides a proxy method for clicking on a picture, and using this control can achieve the function of clicking to preview pictures.
[0077] Step 202, initializing the width of the custom view control object according to the width of the input box.
[0078] Initializing a view control object as the input box, when adding a picture to the input box, instantiating a custom view control object, and when initializing the instantiated custom view control object, setting the display width of the custom view control object to the width of the input box.
[0079] Step 203, assigning the initialized custom view control object to the first property of the control class included in the view control object, so as to display the target picture in the input box.
[0080] Among them, the first property is used to store the picture information to be displayed.
[0081] The control class included in the view control object has a first property, and the picture information to be displayed can be assigned to this first property. In the embodiment of the present invention, the custom view control object containing the picture information is assigned to the first property.
[0082] For example, the first property of the control class can be the content property in the YYTextAttachment class. Assigning the custom view control object NTImageAttachmentContent to the content property actually assigns the instance object of NTImageAttachmentContent to the content property in YYTextAttachment to generate a YYTextAttachment instance object.
[0083] Since this step is similar to step 103, for a detailed description, please refer to step 103 and will not be elaborated here.
[0084] For step 203, the following sub-steps can be executed:
[0085] Sub-step S21: Pass the attribute information included in the first property as input parameter information into a preset call method to generate a corresponding rich text string object.
[0086] Sub-step S22: Assign the rich text string object to the second property of the view control object to display the target picture in the input box.
[0087] Among them, the second property is used to display the included attribute information in the input box.
[0088] The view control object has a second property, and the attribute information of the second property can be directly displayed in the input box.
[0089] For example, it can be to call the yy_attachmentStringWithContent:contentMode:width:ascent:descent: method to generate an NSMutableAttributedString instance object. Since the custom view control object NTImageAttachmentContent is assigned to the content property, the property information of the content property is the instance object of NTImageAttachmentContent. Let the instance object of NTImageAttachmentContent be used as the input parameter of the first parameter of the yy_attachmentStringWithContent:contentMode:width:ascent:descent: method to generate an NSMutableAttributedString instance object. The NSMutableAttributedString instance object is a rich text string, and it can be assigned to the attributedText property of YYTextView to display the user input content, that is, the NSMutableAttributedString instance object can be inserted into the cursor position of the input box, realizing the display of the picture in the input box and ensuring that the picture occupies a single line.
[0090] To enable those skilled in the art to better understand steps 201 to 203 of the embodiments of the present invention, the following is illustrated by an example:
[0091] In a mobile terminal, a rich text editor is implemented using YYTextView. A subclass NTImageAttachmentContent that inherits from UIView is customized. A YYAnimatedImageView object is added in NTImageAttachmentContent as a display control for the picture, and then a UITapGestureRecognizer gesture is added to the YYAnimatedImageView object to trigger the picture click preview event.
[0092] The editing process in this rich text editor can include:
[0093] 1. Initialize a YYTextView instance object as an input box.
[0094] 2. When adding a picture to the input box, instantiate an NTImageAttachmentContent object. When initializing the NTImageAttachmentContent instance object, set the width of the NTImageAttachmentContent instance object to the width of the input box. The display width of the YYAnimatedImageView instance object in the NTImageAttachmentContent instance object can be set according to the user's needs.
[0095] 3. Assign the NTImageAttachmentContent instance object to the content property in YYTextAttachment. YYTextView uses YYTextAttachment for picture display. The content property of YYTextAttachment can be used to store pictures. The content property can accept any type. Not directly assigning the picture to be displayed to the content property is to ensure that this picture can be displayed on a single line.
[0096] 4. Call the yy_attachmentStringWithContent:contentMode:width:ascent:descent: method to generate an NSMutableAttributedString instance object with the content property as the input parameter.
[0097] 5. Assign the NSMutableAttributedString instance object to the attributedText property of the YYTextView instance object for display. Insert the NSMutableAttributedString instance object at the cursor position, which not only realizes the display of the picture in the input box but also ensures that the picture occupies a single line.
[0098] Step 204, monitor the input event for the input box.
[0099] In the embodiment of the present invention, the input event can also be monitored in the input box. Among them, the input event can be triggered by peripheral devices such as a keyboard or a stylus. The embodiment of the present invention does not specifically limit this.
[0100] Step 205, when the input event for the input box is monitored, trigger the preset proxy method for the input box and intercept the input content of the input event based on the preset proxy method.
[0101] When it is detected that the user performs an input operation, the proxy method provided by the input box is triggered to intercept the input content. For example, the proxy method can be the textView:shouldChangeTextInRange:replacementText: proxy method.
[0102] Step 206: Determine the input position of the input content, and determine a corresponding input strategy for input processing based on the input content and the input position, so that after the input content is added to the input box, the cursor of the input box is not at the starting position of the picture or the starting position of the custom view control object. The input position is the position of the cursor in the input box. The starting position of the picture refers to the position where the picture information starts to be displayed. Refer to Figure 3 As shown, it is a schematic diagram of the cursor displayed at the starting position of the picture. The cursor is displayed in front of the picture (at the location). In contrast, the ending position of the picture refers to the position where the picture information ends to be displayed. Refer to Figure 4 As shown, it is a schematic diagram of the cursor displayed at the ending position of the picture. The cursor is displayed behind the picture. And the position where the picture is located includes the complete display area of the picture information. Since in this application, the picture information is stored in the custom view control object container for display, therefore, the starting position of the picture can also be the starting position of the custom view control object.
[0103] Determine the input strategy according to the input content and the input position, and perform corresponding input operations according to the input strategy, so that after the input operation is executed, the cursor is not at the starting position of the picture or the starting position of the custom view control object.
[0104] For step 206, the following sub-steps can be executed:
[0105] Sub-step S31: Judge whether the input content is a deletion character; and / or judge whether the input position is the starting position of the picture or the starting position of the custom view control object.
[0106] Sub-step S32: Determine the corresponding input strategy for input processing according to the judgment result.
[0107] Sub-step S33: If the input content is not a deletion character, and the input position is the starting position of the picture or the starting position of the custom view control object, then add a line break after the text information included in the input content, and convert the processed text information into rich text information and display it in the input box.
[0108] Sub-step S34: If the input content is a deletion character, the content to be deleted is a line break character, the deletion position is not the starting position of the input box, and the next position after the position where the line break character to be deleted is located is the position of an image or the position of a custom view control object, then move the cursor before the line break character, delete the character before the line break character, and convert the remaining text information after deletion into rich text information and display it in the input box.
[0109] Since in this application, the image information is stored in the container of the custom view control object for display, therefore, the position where the image is located can also be the position of the custom view control object.
[0110] Refer to Figure 5 As shown, it is a schematic diagram of the processing flow of the rich text editor in response to an input event provided by an embodiment of the present invention. When an input event is detected, a proxy method is triggered. It can be judged in the proxy method whether the input content is a deletion character. If it is not a deletion character, continue to judge whether the input position is the starting position of the image (corresponding to Figure 5 the location position in it). If it is not at the starting position of the image, it means that the user is not inputting at the starting position of the image, and the input operation can be directly performed without processing; if it is at the starting position of the image, a line break character can be added after the text information included in the input content, and then the processed text information is converted into rich text information and inserted and displayed at the cursor position in the input box, and the new rich text information is assigned to the second attribute of the input box, realizing that the display of the input content has been completed when assigning a value to the second attribute, and other proxy processes of the input box do not need to be executed, for example, the textViewDidChange: proxy method does not need to be executed.
[0111] If the input content is a deletion character, continue to judge whether the content to be deleted is a line break character and judge whether the input position is not the starting position of the input box (corresponding to Figure 5 not 0 in it). If this condition is not met, judge whether the input position is the starting position of the image, and the subsequent process can refer to the above process; if this condition is met, judge whether the next position after the position where the line break character to be deleted is located is the position of the image. If it is not the position of the image, judge whether the input position is the starting position of the image, and the subsequent process can refer to the above process; if this condition is met, it means that the user wants to delete the line break character before the image. This line break character was added during input, and the user actually does not know the existence of this line break character. Therefore, this line break character does not need to be deleted. In this case, the cursor needs to be moved before the line break character, the character before the line break character is deleted, and then the remaining text information is converted into rich text information, and the new rich text information is assigned to the second attribute of the input box. From the user's perspective, a character in front of the image is deleted, which meets the user's operation expectation.
[0112] In summary, in the embodiment of the present invention, when it is necessary to insert a picture into the input box, a custom view control object for the picture is created, and the width of the custom view control object is initialized according to the width of the input box. By adopting the above method, the width of the custom view control object for displaying the picture is kept consistent with the width of the input box, and then the custom view control object is assigned to the first property in the view control object to display the picture, so that the picture can be displayed on a single line in the input box.
[0113] The present invention provides an implementation solution of a rich text editor that can make a picture occupy a single line, respond to a picture click event in the editing state, and keep the cursor behind the input or deleted text. By customizing a view control and keeping the width of the control consistent with the width of the input box, the picture can be displayed on a single line. The control provides a proxy method for clicking on the picture to implement the function of previewing the picture. When inputting text, by judging the input content and input position, if it is at the starting position of the picture and the input is not a deletion character, a line break is inserted after the input text, so that the cursor will be positioned after the input text after the input is completed; if the input is a deletion character, since a line break is added as long as it is at the starting position of the picture during input, that is, there is a line break between each picture and the text, when the input is a deletion character, only the position of the cursor needs to be moved to the front of the line break, and then a character before the line break is deleted, so that a character before the picture can be deleted and the cursor can be positioned after the input text.
[0114] It should be noted that for the method embodiments, for the sake of simple description, they are all expressed as a series of action combinations. However, those skilled in the art should know that the embodiments of the present invention are not limited by the described action sequences, because according to the embodiments of the present invention, certain steps can be performed in other sequences or simultaneously. Secondly, those skilled in the art should also know that the embodiments described in the specification are all preferred embodiments, and the actions involved are not necessarily essential for the embodiments of the present invention.
[0115] Referring to Figure 6 , a structural block diagram of a picture editing device provided by an embodiment of the present invention is shown. A view control object used as an input box is provided through the rich text editor of the terminal, and specifically may include the following modules:
[0116] A creation module 601, configured to create a custom view control object for the target picture by inheritance when adding a target picture to the input box;
[0117] An initialization module 602, configured to initialize the width of the custom view control object according to the width of the input box;
[0118] An assignment module 603, configured to assign the initialized custom view control object to a first attribute of a control class included in the view control object, so as to display the target picture in the input box; the first attribute is used to store picture information to be displayed.
[0119] In an embodiment of the present invention, the creation module includes:
[0120] An adding sub-module, configured to add a picture display control object to the custom view control object, and add a gesture processor to the picture display control object; the gesture processor is used to trigger a picture click preview event.
[0121] In an embodiment of the present invention, the assignment module includes:
[0122] A generating sub-module, configured to use the attribute information included in the first attribute as input parameter information and input the information into a preset call method to generate a corresponding rich text string object;
[0123] An assignment sub-module, configured to assign the rich text string object to a second attribute of the view control object, so as to display the target picture in the input box; the second attribute is used to display the included attribute information in the input box.
[0124] In an embodiment of the present invention, the device further includes:
[0125] A monitoring module, configured to monitor an input event for the input box;
[0126] An intercepting module, configured to, when detecting the input event for the input box, trigger a preset proxy method for the input box, and intercept the input content of the input event based on the preset proxy method;
[0127] A determining module, configured to determine an input position of the input content, and determine a corresponding input policy for input processing according to the input content and the input position, so that after adding the input content to the input box, the cursor of the input box is not at the starting position of the picture or the starting position of the custom view control object.
[0128] In an embodiment of the present invention, the determining module includes:
[0129] A judging sub-module, configured to judge whether the input content is a deletion character; and / or judge whether the input position is the starting position of the picture or the starting position of the custom view control object;
[0130] A determining sub-module, configured to determine a corresponding input policy for input processing according to the judgment result.
[0131] In an embodiment of the present invention, the determining sub-module includes:
[0132] A first display unit, configured to, if the input content is not a deletion character, and the input position is the starting position of a picture or the starting position of a custom view control object, add a line break after the text information included in the input content, and convert the processed text information into rich text information and display it in the input box.
[0133] In an embodiment of the present invention, the determining sub-module includes:
[0134] A second display unit, configured to, if the input content is a deletion character, the deletion content is a line break, the deletion position is not the starting position of the input box, and the next position of the position where the line break to be deleted is located is the position of a picture or the position of a custom view control object, move the cursor before the line break, delete a character before the line break, and convert the remaining text information after deletion into rich text information and display it in the input box.
[0135] In summary, in an embodiment of the present invention, when a picture needs to be inserted into an input box, a custom view control object for the picture is created, and the width of the custom view control object is initialized according to the width of the input box. By adopting the above method, the width of the custom view control object for displaying the picture is kept consistent with the width of the input box, and then the custom view control object is assigned to the first attribute in the view control object for picture display, so that the picture can be displayed alone on one line in the input box.
[0136] For the device embodiment, since it is basically similar to the method embodiment, the description is relatively simple. For related parts, refer to the partial description of the method embodiment.
[0137] An embodiment of the present invention further provides an electronic device, including: a processor, a memory, and a computer program stored on the memory and capable of running on the processor. When the computer program is executed by the processor, it implements each process of the above-mentioned method embodiment for picture editing and can achieve the same technical effect. To avoid repetition, it will not be elaborated here.
[0138] An embodiment of the present invention further provides a computer-readable storage medium, on which a computer program is stored. When the computer program is executed by a processor, it implements each process of the above-mentioned method embodiment for picture editing and can achieve the same technical effect. To avoid repetition, it will not be elaborated here.
[0139] Each embodiment in this specification is described in a progressive manner. The key point of each embodiment is to illustrate the differences from other embodiments. For the same or similar parts among the embodiments, reference can be made to each other.
[0140] Those skilled in the art should understand that the embodiments of the present invention can be provided as a method, a device, or a computer program product. Therefore, the embodiments of the present invention can take the form of a complete hardware embodiment, a complete software embodiment, or an embodiment combining software and hardware aspects. Moreover, the embodiments of the present invention can take the form of a computer program product implemented on one or more computer-usable storage media (including but not limited to disk storage, CD-ROM, optical storage, etc.) containing computer-usable program code.
[0141] 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 processes and / or blocks in the flowchart and / or block diagram, can be realized by computer program instructions. These computer program instructions can be provided to the processors of general-purpose computers, special-purpose computers, embedded processors, or other programmable data processing terminal devices to generate a machine, such that the instructions executed by the processors of the computer or other programmable data processing terminal devices generate a device for realizing the functions specified in Figure 1 one process or multiple processes and / or blocks Figure 1 one block or multiple blocks.
[0142] These computer program instructions can also be stored in a computer-readable memory that can direct a computer or other programmable data processing terminal device to work in a specific manner, such that the instructions stored in the computer-readable memory generate a manufactured article including an instruction device, and the instruction device realizes the functions specified in Figure 1 one process or multiple processes and / or blocks Figure 1 one block or multiple blocks.
[0143] These computer program instructions can also be loaded onto a computer or other programmable data processing terminal device, such that a series of operation steps are executed on the computer or other programmable terminal device to generate a computer-implemented process. Thus, the instructions executed on the computer or other programmable terminal device provide steps for realizing the functions specified in Figure 1 one process or multiple processes and / or blocks Figure 1 one block or multiple blocks.
[0144] Although the preferred embodiments of the embodiments of the present invention have been described, those skilled in the art can make additional changes and modifications once they learn the basic creative concept. Therefore, the appended claims are intended to be construed as including the preferred embodiments and all changes and modifications that fall within the scope of the embodiments of the present invention.
[0145] Finally, it should also be noted that in this text, relational terms such as first and second are only used to distinguish one entity or operation from another entity or operation, and do not necessarily require or imply any such actual relationship or order between these entities or operations. Moreover, the term "comprising", "including" or any other variant thereof is intended to cover non-exclusive inclusion, so that a process, method, article or terminal device comprising a series of elements not only includes those elements, but also includes other elements not expressly listed, or elements inherent to such process, method, article or terminal device. Without further limitation, an element defined by the statement "comprising an..." does not exclude the presence of additional identical elements in the process, method, article or terminal device comprising the element.
[0146] The above has introduced in detail a picture editing method, a picture editing device, an electronic device and a computer-readable storage medium provided by the present invention. Specific examples are used in this text to elaborate on the principle and implementation manner of the present invention. The description of the above embodiments is only used to help understand the method and its core idea of the present invention; at the same time, for those of ordinary skill in the art, according to the idea of the present invention, there will be changes in the specific implementation manner and application scope. In summary, the content of this specification should not be construed as a limitation to the present invention.
Claims
1. A picture editing method, characterized in that, Provide a view control object for use as an input box through the rich text editor of the terminal. The method includes: When adding a target picture to the input box, create a custom view control object for the target picture by inheritance; wherein, the custom view control object supports passing in picture information for the target picture, and calculates the picture display size according to the picture display rule and then displays the picture. Initialize the width of the custom view control object according to the width of the input box; wherein, the width of the input box is the same as the width of the custom view control object. Assign the initialized custom view control object to the first property of the control class included in the view control object to display the target picture in the input box; the first property is used to store the picture information to be displayed.
2. The method according to claim 1, characterized in that, The step of, when adding a target picture to the input box, creating a custom view control object for the target picture by inheritance includes: Add a picture display control object to the custom view control object, and add a gesture processor to the picture display control object; the gesture processor is used to trigger a picture click preview event.
3. The method according to claim 1, characterized in that, The step of assigning the initialized custom view control object to the first property of the control class included in the view control object to display the target picture in the input box includes: Pass the attribute information included in the first property as input parameter information into a preset call method to generate a corresponding rich text string object. Assign the rich text string object to the second property of the view control object to display the target picture in the input box; the second property is used to display the included attribute information in the input box.
4. The method according to claim 1, characterized in that The method further includes: Monitor the input event for the input box. When the input event for the input box is monitored, trigger a preset proxy method for the input box, and intercept the input content of the input event based on the preset proxy method. Determine the input position of the input content, and determine a corresponding input strategy for input processing according to the input content and the input position, so that after adding the input content to the input box, the cursor of the input box is not at the starting position of the picture or the starting position of the custom view control object. Wherein, the step of determining a corresponding input strategy for input processing according to the input content and the input position includes: Judge whether the input content is a deletion character; and / or, judge whether the input position is the starting position of the picture or the starting position of the custom view control object. If the input content is not a deletion character and the input position is the starting position of the picture or the starting position of the custom view control object, add a line break after the text information included in the input content, and convert the processed text information into rich text information and then display it in the input box. If the input content is a deletion character, the content to be deleted is a line break, the deletion position is not the starting position of the input box, and the next position after the position where the line break to be deleted is located is the position of a picture or the position of a custom view control object, then move the cursor before the line break, delete one character before the line break, and convert the remaining text information after deletion into rich text information and display it in the input box.
5. An image editing device, characterized in that, A view control object used as an input box is provided through a rich text editor of a terminal. The device includes: A creation module, configured to create a custom view control object for the target picture by inheritance when adding a target picture to the input box; wherein, the custom view control object supports passing in picture information for the target picture, and calculates the picture display size according to the picture display rule and then displays the picture. An initialization module, configured to initialize the width of the custom view control object according to the width of the input box; wherein, the width of the input box is the same as the width of the custom view control object. An assignment module, configured to assign the initialized custom view control object to a first attribute of a control class included in the view control object, so as to display the target picture in the input box; the first attribute is used to store the picture information to be displayed.
6. An electronic device, characterized in that, including: A processor, a memory, and a computer program stored on the memory and capable of running on the processor. When the computer program is executed by the processor, the steps of a picture editing method according to any one of claims 1-4 are implemented.
7. A computer-readable storage medium, characterized in that, A computer program is stored on the computer-readable storage medium. When the computer program is executed by a processor, the steps of a picture editing method according to any one of claims 1 to 4 are implemented.
Citation Information
Patent Citations
An optimization method for customizing diversified combination controls based on a UI
CN109828806A
Interactive image management method and device based on live broadcast, equipment and storage medium
CN113157157A