Show TOC

Arranging UI Elements in a ViewLocate this document in the navigation structure

Procedure

UI elements enables users to interact with an application. The arrangement of user interface elements are influenced by the business needs of an organization for example:

  • To have a standalone view as a user interface

  • To embed views in a portal

  • To embed views to create a rich business application

You should understand the business scenarios to design a better arrangment of UI elements in a view.

Web Dynpro tools offer the following editors and features for designing the layout. They allow you to simply and quickly develop high-quality user interfaces.

  • Graphical tool support with the View Designer

  • Large set of predefined user interface elements

    • When designing and implementing the user interface you can use container UI elements, which have an own set of properties, for example, for designing the view in a grid or column layout.

    • In the next design step, you will integrate the user interface elements, which shall be finally displayed on the screen. In this design layer you decide about the length of an input field, for example, or the dimension of a business graphic.

Layouts

The layout can be defined for the entire view by defining the RootElement 's layout and for each single container inside a view.

More information: Choosing the Layout

Tables, Pies, Calendars - More than 80 elements for UI design available

Provided via categories to simplify the access, you can use a large set of user interface elements. There are complex rich ones such as tables as well as smaller ones like a simple input field, or a button.

More information: Adding UI Elements

Reusing graphical data such as MIMEs

Mimes, Icons and other graphical application elements can be easily integrated. The only thing you need to know is the path to the path to the image file.

More information: Specifying the Image Source

User interface data in the data flow

Since the user interface elements have two functions - providing a nice layout for the end user as well as processing the outgoing and incoming data - there is a need of course to influence the data flow between the logical applications view and controller. This process is called data binding and can easily be done with graphical support in the Controller Editor.

More information: Binding Data