Search

CN-121996113-A - Component editing method and device and electronic equipment

CN121996113ACN 121996113 ACN121996113 ACN 121996113ACN-121996113-A

Abstract

The invention provides a component editing method, a device and electronic equipment, wherein the method, the device and the electronic equipment are used for responding to the dragging operation of a first component and controlling the first component to move in a page editing interface along with the dragging operation, the dragging position responding to the dragging operation is positioned at the component position of a second component in the page editing interface, component placement information is controlled to be displayed at the dragging position and used for indicating whether the first component can be placed in the second component, if the component placement information indicates that the first component can be placed in the second component, the first component is placed in the second component responding to the end of the dragging operation. In the mode, the user can observe the prompt of the component placement information in real time along with the dragging position in the process of dragging the component on the page editing interface, the mode is easier to help a new user to adjust the position of the component, meanwhile, the accuracy of page editing operation is improved, and the repeated trial and error cost caused by difficulty in resolving the level position of the component by the user is reduced.

Inventors

  • RUAN JIALI
  • WANG TAO
  • Ou xuan

Assignees

  • 网易（杭州）网络有限公司

Dates

Publication Date
20260508
Application Date
20251223

Claims (10)

  1. 1. A component editing method, characterized in that a page editing interface is provided by a terminal device, the page editing interface includes a plurality of components located at different display levels, the method includes: Controlling a first component to move in the page editing interface along with a dragging operation of the first component in response to the dragging operation; Controlling to display component placement information on a dragging position in response to the dragging position of the dragging operation being positioned on a component position of a second component in the page editing interface, wherein the component placement information is used for indicating whether the first component can be placed in the second component; and if the component placement information indicates that the first component can be placed into the second component, placing the first component into the second component in response to the end of the drag operation.
  2. 2. The method according to claim 1, wherein the method further comprises: And if the component placement information indicates that the first component cannot be placed in the second component, responding to the end of the dragging operation, placing the first component at a designated position in the page editing interface, and/or displaying prompt information in the page editing interface, wherein the prompt information is used for indicating that the position adjustment of the first component fails.
  3. 3. The method of claim 1, wherein the step of controlling the display of the component placement information on the drag position in response to the drag position of the drag operation being located on the component position of the second component in the page editing interface comprises: And responding to the dragging position of the dragging operation on the component position of the second component in the page editing interface, determining component placement information according to the component configuration information of the second component and the configuration information of the first component, and displaying the component placement information on the dragging position.
  4. 4. The method of any of claims 1-3, wherein the page editing interface comprises a canvas area and a structural placeholder area, wherein the canvas area is used for displaying component models of a plurality of components, the structural placeholder area is used for displaying hierarchical relationships of the plurality of components, and the component position of the second component comprises a position of the component model of the second component in the canvas area or a hierarchical position of the structural placeholder area to which the second component belongs.
  5. 5. The method of claim 4, wherein the step of controlling the display of the component placement information on the drag position in response to the drag position of the drag operation being located on the component position of the second component in the page editing interface comprises: and responding to the dragging position of the dragging operation to be positioned at the position of the component model of the second component in the canvas area, displaying component placement information on the dragging position, and displaying component placement identification at the hierarchical position of the second component in the structure occupation area.
  6. 6. The method of claim 4, wherein the step of controlling the display of the component placement information on the drag position in response to the drag position of the drag operation being located on the component position of the second component in the page editing interface comprises: And responding to the dragging position of the dragging operation to be positioned at the hierarchical position of the second component in the structural occupation area, displaying component placement information on the dragging position, and displaying component placement identification on the position of the canvas area where the component model of the second component is positioned.
  7. 7. The method of claim 1, wherein the component placement information includes a target identifier, the method further comprising: Setting a target identifier in the component placement information as a first identifier in response to the component placement information indicating that the first component can be placed in the second component; And setting a second identifier in the component placement information as a second identifier in response to the component placement information indicating that the first component is not placed in the second component.
  8. 8. A component editing apparatus, characterized in that a page editing interface is provided by a terminal device, the page editing interface including a plurality of components located at different display levels therein, the apparatus comprising: the device comprises a component moving module, a first component editing module and a second component editing module, wherein the component moving module is used for responding to a dragging operation for the first component and controlling the first component to move in the page editing interface along with the dragging operation; The information display module is used for responding to the dragging position of the dragging operation to be positioned on the component position of the second component in the page editing interface and controlling to display component placement information on the dragging position, wherein the component placement information is used for indicating whether the first component can be placed in the second component or not; and the component placement module is used for placing the first component into the second component in response to the end of the dragging operation if the component placement information indicates that the first component can be placed into the second component.
  9. 9. An electronic device comprising a processor and a memory, the memory stores computer executable instructions executable by the processor, the processor executing the computer-executable instructions to implement the component editing method of any of claims 1-7.
  10. 10. A computer-readable storage medium, wherein the computer-readable storage medium stores computer-executable instructions, the computer executable instructions, when invoked and executed by a processor, cause the processor to implement the component editing method of any of claims 1-7.

Description

Component editing method and device and electronic equipment Technical Field The present invention relates to the field of page editing technologies, and in particular, to a method and an apparatus for editing a component, and an electronic device. Background In the editor, the insert position placeholder can be seen in real time in the structural tree as the user edits the drag component on the page. When the placement position supports the placement component, a blue placement guide wire can be seen on the canvas, a blue occupation block can be seen on the structural tree, when the placement position does not support the placement component, a red placement guide wire can be seen on the canvas, and a red occupation block can be seen on the structural tree. Disclosure of Invention Accordingly, the present invention is directed to a method, an apparatus and an electronic device for editing a component, so as to improve the accuracy of page editing operation and reduce the trial and error cost of a user caused by difficulty in resolving the hierarchical position of the component. In a first aspect, an embodiment of the invention provides a component editing method, a page editing interface is provided through a terminal device, the page editing interface comprises a plurality of components located at different display levels, the method comprises the steps of responding to dragging operation for a first component, controlling the first component to move in the page editing interface along with the dragging operation, responding to the dragging position of the dragging operation to be located at a component position of a second component in the page editing interface, and controlling to display component placement information at the dragging position, wherein the component placement information is used for indicating whether the first component can be placed in the second component or not, and if the component placement information indicates that the first component can be placed in the second component, responding to the end of the dragging operation, placing the first component in the second component. In a second aspect, an embodiment of the present invention further provides a device for editing a page, where the device provides a page editing interface through a terminal device, the page editing interface includes a plurality of components located at different display levels, and the device includes a component moving module configured to control a first component to move in the page editing interface in response to a drag operation for the first component, an information display module configured to control to display component placement information at a drag position in response to the drag position of the drag operation on a component position of a second component in the page editing interface, where the component placement information is configured to indicate whether the first component can be placed in the second component, and a component placement module configured to place the first component in the second component in response to an end of the drag operation if the component placement information indicates that the first component can be placed in the second component. In a third aspect, an embodiment of the present invention further provides an electronic device, where the electronic device includes a processor and a memory, and the memory stores computer-executable instructions that can be executed by the processor, and the processor executes the computer-executable instructions to implement the above component editing method. In a fourth aspect, embodiments of the present invention also provide a computer-readable storage medium storing computer-executable instructions that, when invoked and executed by a processor, cause the processor to implement the above-described component editing method. The embodiment of the disclosure brings the following beneficial effects: According to the method, the device and the electronic equipment for editing the components, the first component is controlled to move in the page editing interface along with the dragging operation in response to the dragging operation of the first component, the dragging position in response to the dragging operation is located at the component position of the second component in the page editing interface, component placement information is controlled to be displayed on the dragging position, the component placement information is used for indicating whether the first component can be placed in the second component or not, and if the component placement information indicates that the first component can be placed in the second component, the first component is placed in the second component in response to the end of the dragging operation. In the mode, the user can observe the prompt of the component placement information in real time along with the dragging position in the process of dragging the component on the page editin