UI Designer

• Save and Activate Button (Save changes)

• Display and Edit Button (Change view)

• Add Felx Layout Column Button (Add extra column)

• Run Button (Runs component)

• The user interface designer (UI designer) is integrated into the SDK, and you can use it to create new screens, or modify the screens provided by SAP.

• The UI designer supports drag-and-drop for the development of the view. You can move elements by dragging and dropping into desired position.

• Data Model

• Controller

• Preview Screen

• Create the structure of the data model

• create, delete, and rename nodes in the data model structure

• bin the data model element to the business object element

• display the correspondig properties of the nodes in the properties Explorer

• define the interaction between user interface components by creating event handlers, interfaces, navigations and queries

To preview the changes made to an user interface component

It provides panes and controles that can be used to design the laoyut of the user interface component in the Designer tab

show different areas that the user can use to structure information

Different types of elements that be assigned to a pane. For example InputField

Adjust layout of the form

Choose the type of input variable

• panes

• controls

• layout elements

• ccts-types

1. Screen Scenario with Thing-Based Navigation

2. Screen Scenario with Object-Based Navigation

3. Single Screen Selection

1. Create screens based on business object

2. choose screen scenario with thing based navigation

3. open screen in ui designer

4. modify screen

5. save and activate screen

6. test