Edit in GitHubLog an issue

View controller

Users may need to view a set of data in more than one way. The view controller is used to switch between the views of data set.

For solutions not described in this article, please refer to other related patterns or contact the Commerce UX Design Team.

When to Use/When Not to Use

Only use for switching between views of data set.

Variations

Follow are variations of icons to use for their corresponding data set views:

variation

Behavior

User switches between the views using the view controller. User can click on the view, that is corresponding to the view they want to see.

In this case, user select data table view control, the data table view is shown.

behavior

Then, the user can also switch back to tile view in this example.

behavior2

Placement

The view control should always be placed as the most right item on the same row as filter options.

Placement

Style

style

Accessibility

The controller should be accessible by keyboard and have a voice over for screen readers. Accessibility guideline follow buttons' guideline.

(Keyboard shortcut same as checkbox)

Assets

Download View Controller PSD source

Please reach out to the Commerce UX Design team if you need anything else.

  • Privacy
  • Terms of Use
  • Do not sell or share my personal information
  • AdChoices
Copyright © 2024 Adobe. All rights reserved.