. . .

Editing Canvas

By double-clicking on the screens within your project map the editing canvas will appear.

Here you can style and modify specific screens.

images/download/attachments/26247196/ApiOmat-Studio_Editing-Canvas_Overview.png

On the left side there is a tool bar. These are commonly known from image editing software: Select tool, Zoom and Pan, drawing tools like Rectangle, Pen and Brush, Text, etc.

images/download/attachments/26247196/Bildschirmfoto-2018-03-12-um-16.00.16.png

Right next to them in the middle of the screen, you will find the drawing canvas that displays how you screen will appear.

images/download/attachments/26247196/Bildschirmfoto-2018-03-12-um-16.01.11.png

Below is the screen flow, which is also familiar to tools like Photoshop or Sketch. Here you can see how your screen is split into layers.

images/download/attachments/26247196/Bildschirmfoto-2018-03-12-um-16.01.26.png

To the right of the drawing canvas, you have the elements tool bar. You can drag and drop the visual elements to design your screen with elements such as buttons, icons, images, texts or lists.

images/download/attachments/26247196/Bildschirmfoto-2018-03-12-um-16.01.45.png

ApiOmat Studio supports responsive app design out of the box. In the Device Previews column, you can see how your app will appear on individual devices. By selecting a different device, you can make changes to how your app looks on that specific device.

images/download/attachments/26247196/Bildschirmfoto-2018-03-12-um-16.02.19.png

On the far right we have the screen settings menu. Here we can customize the navigation bar, change the data source, set the screen orientation amoungst other things.

images/download/attachments/26247196/Bildschirmfoto-2018-03-12-um-16.02.38.png