Managing Controls

<< Click to Display Table of Contents >>

Navigation:  Low-code Process Automation > Studio Cloud - Authoring environment > Bizagi Apps > App Designer > App Designer editor > Controls >

Managing Controls

Overview

The App Designer editor offers several features to help you efficiently organize and manage Controls within your app. Key commands such as Delete, Copy, Cut, Paste, Duplicate, and Move streamline your app design process by minimizing manual effort and reducing errors.

 

This article outlines how these features work and how you can use them together to effectively manage Controls in your app.

 

Control selection

Before using any commands in your app's layout, the first step is to select the Controls you want to manage. Click the desired Controls, which will be highlighted with a dashed frame to indicate they are selected. To select multiple Controls, hold down the Ctrl key (Windows) or Command key (Mac) while clicking each Control.

 

ManageControls01

 

Command summary

Each command serves a distinct purpose to enhance your productivity when designing your app layout:

Delete ControlsDeleteIcon: Permanently removes the selected Controls from the app's layout.

Copy ControlsCopyIcon: Creates a copy of the selected Controls while keeping the originals in place, storing the copy in the clipboard.

Cut ControlsCutIcon: Removes the selected Controls from the current layout and stores them in the clipboard for pasting elsewhere.

Paste ControlsPasteIcon: Inserts the Controls stored in the clipboard into a designated column or position within your app. You can paste them on the same Page or onto a different one.

Duplicate ControlsDuplicateIcon: Automatically copies and pastes the selected Controls below the originals in the layout, creating quick duplicates.

Move ControlsMoveIcon: Allows you to click and drag selected Controls to rearrange them within your app’s layout. A real-time preview of one of the selected Controls helps you see the movement as you drag.

 

ManageControls02

 

Command execution

Once Controls are selected, you can execute the commands via the following methods:

 

Control buttons

When Controls are selected, you can choose to Delete, Copy, Cut, Duplicate, or Move them using the options located in the upper right corner of the dashed frame.

 

ManageControls03

 

Contextual menu

By right-clicking the selected Controls, you can open a contextual menu that provides options for Cut, Copy, Paste, Duplicate, Delete, and Manage Translations.

 

ManageControls04

 

Keyboard shortcuts

You can also execute commands using keyboard shortcuts, depending on your operating system:

 

Command

Windows

Mac

Delete

Supr

Delete

Copy

Ctrl + C

Command + C

Cut

Ctrl + X

Command + X

Paste

Ctrl + V

Command + V

Duplicate

Ctrl + D

Command + D

 

Using the features together

The commands work seamlessly to provide flexibility in managing your app layout. For instance, you can Cut or Copy multiple Controls and then Paste them onto a different Page. Alternatively, you can Move and rearrange them within the same Page or Duplicate them for quick repetition. If a Control is no longer needed, you can Delete it.

 

When you use Cut or Copy, columns that are ready for pasting will display a Paste icon, indicating that they can accept new Controls.

 

ManageControls05

 

Considerations

Cut and Copy buttons will not appear when only one Control is selected, but you can still use the commands via the contextual menu or keyboard shortcuts.

Duplicated Controls are placed directly below the originals.

Pasting requires selecting a column where the Controls will be inserted.

On Detail pages, pasted Controls must be reconfigured to match the attributes of the Detail page's entity.

On Private pages, pasted Controls with configured fields related to an entity will not display any data.


Last Updated 10/28/2024 3:20:37 PM