Power Apps List Box: Setup, Formatting, Data, and Selection

The List Box control in Power Apps is ideal when you need to display multiple items at once and support selecting several items simultaneously.

Here is a practical walkthrough—from adding the control and formatting it, to connecting external data and reading the selected items.


Adding a list box and defining items

Add a List Box to your screen and set its Items property to the array of values you want to display. This property controls the content rendered in the control.

// Static array example for Items
["Orange", "Banana", "Apple", "Grape", "Melon"]
  
  • Items property: Determines what the List Box displays. It can be a static array or data source column.
  • Immediate feedback: After you set Items, save and Play to preview behavior quickly.

Formatting the list box

You can style the List Box using standard properties. Adjust size to control how many items are visible before a scrollbar appears.

  • Font: Change Font and FontSize for readability.
  • Size: Use Width and Height; if item count exceeds visible space, a vertical scrollbar is added automatically.
  • Colors: Customize Color (text) and Fill (background) to match your app theme.

Tip: Reduce Height to test the scrollbar. Increase it again to show more items without scrolling.

Selecting multiple items

The List Box supports multi-select by default. Users can click several entries to select them at once. If you need single selection, turn off multi-select.

  • Multi-select: Enabled by default; users can select more than one item.
  • Single-select: Set SelectMultiple to false to restrict selection to one item.

Comparing list box, drop down, and radio

Choose the right control based on visibility and selection needs. Here are the core differences you’ll see in practice.

  • List Box: Shows all visible items at once; supports multi-select; scrolls when needed.
  • Drop down: Collapsed view that shows one value until opened; single-select only.
  • Radio: Shows all items like List Box but is single-select; ideal for short lists.

Connecting to Dataverse

You can bind the List Box to a Dataverse table to display live data. After adding the data source, set Items to the table and choose which column to show.

// After adding the Products table as a data source:
// Show product names
Items: Products

// Show another column instead (e.g., Price)
Items: Products.Price
  
  • Data source: Add Dataverse > select Products.
  • Items binding: Use the table or a specific column (e.g., Products.Name or Products.Price).
  • Display field: For record-based Items, consider DisplayFields to control which field renders.

Reading selected items with a label

To display the selected values from the List Box, use a Label and the SelectedItems property. Combine selections into a string with Concat.

// Example: show selected Names separated by commas
// Replace ListBox2 with your control's name
Text (Label):
Concat(ListBox2.SelectedItems, Name & ", ")
  
  • SelectedItems: Returns a table of the currently selected records or values.
  • Concat: Converts the selected table into a readable string (e.g., “Mouse, Smartphone”).
  • Live update: Adding/removing selections immediately updates the label text.

Quick reference

  • Add items (static):
    [“Orange”, “Banana”, “Apple”, “Grape”, “Melon”]
  • Bind to Dataverse:
    Items: Products
  • Show another field:
    Items: Products.Price
  • Multi-select off:
    SelectMultiple: false
  • Read selections:
    Concat(ListBox2.SelectedItems, Name & “, “)
  • Format basics:
    FontSize, Color, Fill, Width, Height

Comments

Leave a Comment

Your email address will not be published. Required fields are marked *