Designing Screens

Widgets overview

Widgets in OutSystems are visual elements that help you to design and organize your app’s user interface. They serve as building blocks to accelerate UI development.

You can drag widgets to UI Screens, and then set their relevant properties. Widgets appear in the Service Studio toolbox, on the left side of the main screen. Available widgets vary by app type.

You can use widgets to accelerate the following development tasks, among many others:

• Display one or more record or line of information with display widgets, such as Table widgets
• Take input from users with widgets such as Text and Input widgets
• Use Button or Link widgets to navigate between Screens or to trigger other actions
• Display one of two areas on a Screen based on a Boolean condition with an If Widget
• Provide yes or no input options or one selection out of many options with Checkbox or Radio Button widgets
• Use Container widgets to group other widgets and to apply styles to them
• Create reusable UI elements for use within an app or across apps with Block or Web Block widgets

Articles in this Section

• Button Widget

• Cell Widget

• Check Box Widget

• Combo Box Widget

• Comment Widget

• Container Widget

• Editable Table Widget

  Displays the records of an Entity or a Structure in a tabular layout and allows the user to create new records, update, or delete existing records.

• Edit Record Widget

• Expression Widget

• Form Widget

• Header Row Widget

• If Widget

  Reference information on the If widget for displaying content on the screen based on a condition.

• Image Widget

• Input Password Widget

• Input Widget

• Label Widget

• Link Widget

• List Box Widget

  Allows the user to select one or more values from a list of possible values.

• List Records Widget

• Placeholder Widget

  Reference information on the Placeholder widget for reserving space in your block for filling when the block is used.

• Radio Button Widget

• Row Widget

• Show Record Widget

• Table Records Widget

  Learn how to use the Table Records widget to display the records of an entity or a structure in a tabular layout. Reference.

• Table Widget

• Text Widget

  Reference information on the Text widget for enclosing the text that users type in your screen or block.

• Upload Widget

• Web Block Widget