Tutorial / Mockplus RP / Editing / Advanced Editing

Advanced Editing

In Mockplus, all multi-item components/compound components on an artboard can be edited in two ways.

Advanced Edit

To open the advanced style editor, press "Ctrl+Enter" on the selected component or select "Advanced edit" from the right-click menu of the selected component.

The advanced style editor consists of three sections: Preview, Element and State.

Preview Section

In the Preview section, you can see all the basic elements of a component. When 

you adjust the properties or styles of the component, the effect will take place automatically, and you will see the result of the operation in real-time.

Use the scroll wheel while holding "Ctrl" to zoom the component or element.

Element Section

Different components consist of different elements, each with its own properties.

You can edit the properties of an individual element by selecting it in the right Element section.

State Section

In this section, some components are displayed with different states, such as "Default," "Selected," and "Mouse hover." You can switch between these states, style the state of an item, and then, the same state settings will automatically be applied to all similar items of that component.

Note that after editing styles, you need to click on "√" to apply or on "×" to discard the changes.

You can double-click on a component to access the component editor, in which you can adjust the inner element's properties.

By double-clicking on a component a few times, you can switch between the component's elements and edit their properties in the right Property panel.

Editing one element's properties automatically trigger the same editing to the other elements in the same state.

Previous Rapid Editing