dotnet / dotnet/maui

Investigate IndicatorView accessibility

Open
#10,404 1 comment 1 reaction 0 assignees View on GitHub
area-controls-collectionview platform/android platform/ios platform/macos platform/windows s/triaged t/a11y t/bug
Dominant language
C#
Stars
23.3k
Forks
2k
Avg merge
1d 14h
Merged PRs (30d)
296

Description

### Description

IndicatorView is a cross-platform control used largely to indicate which view of a carousel a user is seeing. It is represented by a series of dots, one of which is highlighted to represent the current view.

![image](https://user-images.githubusercontent.com/21988533/193122822-dd82bbb0-0b65-47e8-bee1-91e5b4c10f3f.png)

Beyond just the decorative indication, however, these tiny dots are also interactive - the dots can be clicked on! However, the dots are usually very tiny and hard to click on, so it's an accessibility issue. And while the size of the dots _can_ be increased to the minimum 44x44 - it takes away from the experience.

![image](https://user-images.githubusercontent.com/21988533/193122667-482e30c8-5876-480d-8f0e-a1d64861d90b.png)

So what can we do? Here are some potential ideas:

## Approach 1: Make the IndicatorView noninteractive

Perhaps it would be best to make the IndicatorView noninteractive entirely, and make it purely decorative, no exceptions.

## Approach 2: Add a property to make the IndicatorView noninteractive

Perhaps there is utility in the interactive quality of IndicatorView. Maybe we can introduce a property to make it noninteractive and only decorative by default. But a property can be set to make it behave as it currently does should developers have a unique scenario

## Approach 3: Attempt the iOS approach

IndicatorView is only inherent to the iOS platform - we have custom code to make it exist on the other platforms. So if we're copying iOS, perhaps we should copy the full scope of their control.

On iOS, the individual dots are not interactive - the entire IndicatorView, the series of dots as a single unit, is interactive. Users hold down and drag their finger left/right to navigate views.

## Open to other ideas!

### Steps to Reproduce

1. Run .NET MAUI control gallery
2. Navigate to IndicatorView page

### Link to public reproduction project repository

dotnet/maui

### Version with bug

6.0.486 (current)

### Last version that worked well

Unknown/Other

### Affected platforms

iOS, Android, Windows, macOS

### Affected platform versions

all

### Did you find any workaround?

_No response_

### Relevant log output

_No response_

Contributor guide

Open the contributing guide

Research direction

Start by running the .NET MAUI control gallery and opening the IndicatorView page to reproduce the small interactive dots on each affected platform. The issue presents several competing approaches but names no implementation file or test, so first establish the intended interaction and accessibility behavior; done requires an agreed design and verification that the resulting control is accessible.

Written by the indexing model from the issue text.

Assessment

Tech stack
csharp
Domain
accessibility
Issue type
Feature
Difficulty
5/5
Estimated time
Over a week
Activity status
Stale
Clarity
Needs clarification
Newbie friendliness
25/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.