# Page control

> A page control is a row of small dots that shows which page of a swipeable sequence is current. iOS calls it a Page Control, and Material 3 has no matching component.

Page: https://www.appetiteui.com/glossary/page-control. Page control and pagination dots: iOS and Android. Also called Pagination dots, Pager, Page indicator.

## Why it matters

A page control only reports; it answers where am I and how many are left. Past about 10 dots they are hard to count, and then another arrangement serves better.

It suits an ordered sequence, not a hierarchy.

## iOS and Android

|  | iOS | Android (Material 3) | Appetite UI |
| --- | --- | --- | --- |
| Name | Page control | No page control; carousels | Pagination |
| Dots in the file | Page Control, 3, 5 and 8 pages | No counterpart | See below |
| Current dot | Solid dot | None | See below |

## In Appetite UI

Pagination has a Dots style, with the current dot 8 and the others 5, and a Numbered style with 36 targets that neither platform ships. On mobile the docs say to prefer scrolling wherever the content allows.

## Example

An image carousel shows five dots under the photo, the current one solid. Onboarding screens use three dots and a Continue button.

## Common mistakes

- More than about 10 dots. Use another arrangement, such as a grid.
- Using dots for non-sequential pages.
- Dots as the only way to move. Keep the swipe and a button.
- Placing the control away from the bottom center.

## Questions

### How many dots should a page control have?

Apple notes that more than about 10 are hard to count at a glance, and suggests a different arrangement, such as a grid, for more peers.

### Does Android have a page control?

Not as a Material 3 component. Apps draw dots under a pager or use a carousel. Appetite UI draws one for both.

## Sources

1. [Apple Human Interface Guidelines: Page controls](https://developer.apple.com/design/human-interface-guidelines/page-controls)

## Related

- Docs: [Pagination](https://www.appetiteui.com/docs/pagination)
- Docs: [Onboarding app screens](https://www.appetiteui.com/docs/screens-onboarding)
- Article: [Mobile onboarding screen patterns for iOS and Android](https://www.appetiteui.com/blog/mobile-onboarding-screen-patterns)
- Glossary: [Onboarding](https://www.appetiteui.com/glossary/onboarding)
- Glossary: [Carousel](https://www.appetiteui.com/glossary/carousel)
- Glossary: [Stepper](https://www.appetiteui.com/glossary/stepper)
