ttolbel UI

Component

Toggle

A spring-animated switch with a loading state, the standard control for any on/off setting, used as the right-side accessory of a row.

The primitive

toggle.tsx
<NativeToggle checked={checked} onValueChange={setChecked} />

Example

Attached to rows in a preferences list, each one controlling a single setting independently of the others.

Notifications

Face ID

toggle-example.tsx
<NativeRow label="Notifications" right={<NativeToggle checked={notifications} onValueChange={setNotifications} />} />
<NativeRow label="Face ID" right={<NativeToggle checked={biometrics} onValueChange={setBiometrics} />} />

Capabilities

PropTypeDescription
checkedrequiredboolean
onValueChangerequired(checked: boolean) => void
disabledboolean
loadingboolean