Accessibility Canvas Apps

How to make a Power Apps text input accessible?

A keyboard to type in a text input control
A keyboard to type in a text input control

Introduction to the text input control

Text input controls are used whenever a user is needed to type some text in an app. Like if you have a gallery of records, and if you want to provide search capabilities, you will use one to allow users to enter the search text. To learn about its properties, click here.

Screen reader

  1. Use the AccessibleLabel property to clearly indicate the text input control's purpose.
  2. Do not use the Hint Text property for accessibility reasons as different screen readers make use of it differently.
  3. Use a live label to announce the number of characters remaining if a text input control has character limits.

Keyboard tabbing

  1. Set the Tabindex property to 0
  2. Set the FocusBorderThickness to a number greater than 0

Color/contrast

  1. Set the FocusBorderColor with a contrast ratio of 3:1 with the background color.
  2. Set the Color property with a minimum luminosity contrast ratio of 4.5:1 with the background color. There are several tools available to analyze contrast ratios. Click here for one such tool.

Recent articles

  1. How to make a Power Apps button accessible?
  2. How to make a Power Apps label accessible?
  3. Make a Power Apps screen accessible?

Leave a Reply