apps
latest
false
UiPath logo, featuring letters U and I in white
Apps User Guide
Automation CloudAutomation Cloud Public SectorAutomation Suite
Last updated Jun 17, 2024

Differences Between Container Controls

Learn the main differences between the container types:

A single container which can hold controls and other containers within it.

A container layout that groups several simple containers, and helps build a complex app layout.

Page containers host another page in the current page.

Grows based on the size of its contents

Has a fixed height, while its width depends on the screen width.

Grows based on the size of the hosted page.

  • Aligns a group of elements similarly.
  • Aligns a specific element different from that of other elements.
  • You can nest containers:
    • To align/position elements in the inner container differently to the outer one.
    • We recommend nesting maximum 4 containers for performance reasons, however no limit is imposed.

  • Creates the page structure.

  • We recommend using it only in page containers.
  • Nesting Container Layouts leads to extra spaces and maintenance issues.

  • Useful for reusing components in your app, for example having a the same header or body across different pages of your app
  • Helps app maintenance

Example on How to Align Controls Using Containers

The below example shows a simple form, where you want to collect the following information from the user - First Name, Last Name, Email & School. While Email & School input boxes can be one below the other, we wanted the First Name and Last Name available side by side. This can be accomplished by the following steps

  • Add a new container
  • Change the layout of the container to Horizontal
  • Add the two text boxes within the container
  • docs image
  • Example on How to Align Controls Using Containers

Was this page helpful?

Get The Help You Need
Learning RPA - Automation Courses
UiPath Community Forum
Uipath Logo White
Trust and Security
© 2005-2024 UiPath. All rights reserved.