Appeggio Help
Search…
Editing your app
High level customisation of branding, images and colors, and editing of other common features.
The simplest way to get your app out there is to choose a template, and then customise and edit it to make it look and feel authentically yours.
In this section we’ll go through some high level customisation of branding, images and colors, and editing of other common features.
Before we get into customisation, it’s important to understand editing toolbars.
The Editing Toolbar
A toolbar is shown above a part when it is selected. This toolbar shows actions specific to the type of part selected as well as common actions. In the image below, a selected part and part toolbar is shown for a card:
In the image below, you'll see a button toolbar:
You'll notice that the toolbars are slightly different, and that's because the actions for a card are slightly different from the actions for a button. The toolbars only show what's relevant to the particular part you've selected.
The common toolbar actions are described below:
Tool
Action
Move the toolbar. Drag the editing toolbar to another location on the screen.
Go to parent. Click the icon to select the containing part.
Add. The + icon anywhere in Appeggio will allow you to add a part.
The shortcut key for Add is the A key.
Change. This allows you to change the part. By clicking on this dropdown you’ll see the range of functions you can apply to change the part.
The shortcut key for Change is the C key.
Color of part. Allows you to change the color of the part using the color picker tool.
Color of text. Allows you to change the color of the text using the color picker tool.
Weight of text. Allows you to adjust the weight of the text within the part.
Alignment of text. Allows you to adjust the alignment of the text within the part to left, center or right.
Size of text. Allows you to adjust the size of the text within the part.
Column width. Click to select the column width span.
Link. Click to link the part to an existing or .new screen within your app,, or to an external URL.
Connect to data.
The shortcut key for Bind to Data is B.
Actions menu. Allows you to delete, duplicate, cut, copy, paste, undo as well as other actions depending on the type of the part.
The icon below is known as a dropdown and will always open a menu to show you the actions available.
The 'dropdown' icon
As you move the mouse over an icon you will see a ‘tooltip’ that describes what the action will do. Most tooltips will contain a letter or meta-key and a letter indicating what keyboard shortcut you can use to invoke the actions. For example ‘Click to Add a Part (A)’ indicates that the A key can be used as a keyboard shortcut.
In the next sections we’ll go through customising the branding, images and colors to make your template look and feel like your own. We'll then go on to quick editing of parts such as text, buttons and icons and other things you'll need to customise for your app.
Last modified 3mo ago
Copy link
Contents
The Editing Toolbar