# Views and the UIManager

All WRTKit user interfaces are divided into "views". The concept of a view is simply a set of user interface elements, such as buttons, textfields, etc., that are hosted in a container. The WRTKit architecture defines a contract for views through a base class called View and implements a concrete view class called ListView that lays out controls vertically. This layout is similar to what is commonly used in mobile device user interfaces and is thus sufficient for the vast majority of widget user interfaces. However the WRTKit allows developers to create their own custom views if some other kind of layout is preferred instead. Creating a custom view is an advanced topic that isn't covered here, but roughly speaking it is a simple matter of creating a subclass of the View class (just like ListView) and implementing all the functions that the View class defines, plus whatever custom layout the developer wants.

Because the ListView uses a vertical list layout for controls, adding controls can be done either to the end of the list or by inserting before a specified control in the list. There is no need to worry about actual control locations, coordinates or anything of that sort. The ListViews handles all of this automatically.

In addition to controls, the ListView has a view caption that is displayed at the very top of the view. The caption is optional but is good to include in order to show what a particular view is about. E.g. a view for settings could have a caption "Settings".

Figure 1. ListView with caption

Only one view can be visible at any given time, as is common in mobile device applications. Views are commanded to be shown using a class called UIManager, which attaches the view to the "view root". The view root is an HTML element that can be specified to the UIManager when it is created, but typically this argument is omitted, resulting in the UIManager creating a view root element that makes views take up the entire screen.

Parent topic: Developing widgets using the WRTKit