Long image layout interaction for message editing graphical user interfaces on electronic devices

Abstract

1. Name of the product in this design: Long image layout interaction for message editing interactive graphical user interface of electronic device. 2. Purpose of this design: An electronic device. 3. The key design features of this product are: the parts within the graphical user interface, with the area outside the dotted lines being the protected area. 4. The picture or photo that best illustrates the key design points: Design 1 front view. 5. Design 1 is designated as the basic design. 6. Purpose of the graphical user interface: Used in message editing interaction, the protected local purpose is to assist users in layout of long images in message editing interaction. 7. Human-computer interaction method of graphical user interface: In Design 1, the main view of Design 1 is the message editing interface. When a user clicks the "Photo / Video" control at the bottom of the Design 1 main view interface, they can insert an image or video into the message, displaying the interface changes from the Design 1 main view to the Design 1 interface state diagram. In Design 2, the main view is the message editing interface. When a user clicks the "Photo / Video" control at the bottom of the Design 2 main view interface, they can insert an image or video into the message. When the aspect ratio of the inserted image or video exceeds the preset range, the image or video will be collapsed by default and relevant prompt information will be displayed, showing the interface change from the Design 2 main view to the Design 2 interface state diagram. In Design 3, the main view is the message editing interface. When a user clicks the "Photo / Video" control at the bottom of the Design 3 main view interface, they can insert an image or video into the message. When the aspect ratio of the inserted image or video exceeds the preset range, the image or video will be collapsed by default and relevant prompt information will be displayed, presenting the interface change from the Design 3 main view to the Design 3 interface state diagram 1. When a user clicks the "UNFOLD" control in the upper right corner of the inserted image or video in Design 3 Interface Change State Diagram 1, the image or video will be unfolded and displayed. The "UNFOLD" control will change to a "FOLD" control, presenting the interface change from Design 3 Interface Change State Diagram 1 to Design 3 Interface Change State Diagram 2.

Images