Build applications

User Interface Controls

In this course, you will learn more about each User Interface Control in Designer applications, with which you can modify the contents of your page.

Start course
Lessons
15
Level
Beginner
Format
Self-paced
Course contents15 lessons
Course overview
  1. 01Sections and Containers
  2. 02Textbox
  3. 03Checkbox
  4. 04Dropdown
  5. 05Radio Button
  6. 06Calendar
  7. 07File Upload
  8. 08Input Grids
  9. 09Slider
  10. 10Advanced Label
  11. 11Output Grid
  12. 12Charts
  13. 13Maps
  14. 14Gauges
  15. 15Action Button

Build an application interface with controls

This course introduces the controls available in Layout & Controls. Choose controls from the gallery across the top of the workspace, or press Ctrl+Space to use Quick Add. Quick Add can configure a control and bind a compatible named range before you place it on the canvas.

After placing a control, select it and use the Properties panel on the right. The current Designer organizes settings under Setup, Appearance, and Behavior.

Current Layout and Controls workspace with the top control gallery and Properties panel

Requirements

  • A SpreadsheetWeb Control Panel account. You can signup for a trial account here.
  • A Designer application created from a workbook containing named ranges.

Course curriculum

What you’ll learn

  1. 01
    Sections and ContainersBuild responsive layouts with sections and containers in SpreadsheetWeb Designer. Configure columns, surface styles, and colors in the Properties panel.
  2. 02
    TextboxA textbox is a basic control that allows user to input values for capture, storage, or calculation. Each textbox must be associated with a Single Named…
  3. 03
    CheckboxA checkbox control allows end users to enter a TRUE or FALSE value. Each checkbox must be associated with a Boolean Single Named Range (B.SNR) in the…
  4. 04
    DropdownA dropdown control allows users to select a value from a defined list for data entry. Each dropdown must be associated with a Single Named Range (SNR) in…
  5. 05
    Radio ButtonA radio button list control allows users to select a value from a defined list for data entry. For the List Box variation of the Radio Button control, see…
  6. 06
    CalendarA calendar control is a basic control that allows user to select dates and/or times for data entry. Each calendar control must be associated with a Single…
  7. 07
    File UploadA file upload control is a drag-and-drop control that allows user to upload files to the server for storage upon performing a save action. Each file upload…
  8. 08
    Input GridsAn input grid is a control that allows the user to select and edit a range of items corresponding to a Table Named Range (TNR) from the spreadsheet model.…
  9. 09
    SliderA slider is a control that allows user to input values by shifting a horizontal or vertical button within a predetermined minimum and maximum values. Each…
  10. 10
    Advanced LabelAdd formatted text, rich HTML content, and dynamic named-range values to an application with the SpreadsheetWeb Advanced Label control.
  11. 11
    Output GridAn output grid is a control that allows the user to view a range of items corresponding to a Table Named Range (TNR) from the spreadsheet model. These…
  12. 12
    ChartsA chart is a complex output control that allows users to display a visual representation of a data set in the user interface. Widely used in data analysis…
  13. 13
    MapsA map is a complex output control that allows users to visualize geographic data and its relationships. You can choose from hundreds of available maps and…
  14. 14
    GaugesGauges are output controls that display a visual representation of a cell value in the user interface. Widely used in data analysis and presenting key…
  15. 15
    Action ButtonA button control is used to trigger specific actions in the workflow of an application, such as navigation, calculation, and saving. The Text property…