[Mugeda HTML5 technical tutorial 6] add an element, mugedahtml5

[Mugeda HTML5 technical tutorial 6] add an element, mugedahtml5

The previous section describes how to create a new file. After the new product is created, we can add content to it. This section describes how to add elements to a work. The content of an animation is composed of various elements. For an element added to the stage, you can add an animation on the timeline, modify the corresponding attributes in the Properties dialog box, and obtain the element object by name in the script, you can use Javascript code to operate on this element through the Mugeda API to complete more diverse content. This section describes how to add an element and modify its attributes, add an animation to the element, and use a script to operate the element.

 

Mugeda supports image, text, rectangle, rounded rectangle, and elliptical element types. For element types other than images, you can select the desired element object in the toolbar, and click or drag it to the stage to add it. The following describes how to add various types of objects.

You can add images by obtaining local files, obtaining images from webpages, and uploading images in batches.

Click the marked image element to open the upload image dialog box. Click "Upload File" to upload images from a local file.

You can also select the "Enter URL" option to obtain images on the webpage.

Select the batch upload option to upload one or more images from the local device by dragging

Once the image is uploaded, click the select button to add the image to the stage.

You can reuse uploaded images in the image material library.

Double-click an image in the image library or click "add image" to add the selected image to the stage.

You can click the text button, click on the stage, or drag it directly to the stage to add the text element to the stage. Then, you can edit the parameters in the Properties dialog box, including text, color, location, width and height, alignment, and font size.

You can add the corresponding graphic elements to the stage by using the rectangle, rounded rectangle, and oval button, and then edit the parameters in the Properties dialog box. There are few attribute types for each element. For example, only the text type can have the attribute of the text.

For an element that has been added to the stage, you can click "select" and then click this element on the stage to select it.

You can also select one or more elements by dragging them.

You can also press Ctrl to create and click each element to select multiple objects at the same time.

After clicking the "deformation" button, you can drag a control point around the object to scale the object.

You can drag a rotating node to rotate an object.

You can edit attributes such as the object size, position, rotation, and transparency in the Properties dialog box.

In summary, through the above content, we can easily learn how to add the desired elements to the new work and adjust the attributes of the added elements. Next, we will continue to explain how to add animations to the added elements in the next phase to let them move. Stay tuned.