Switch
Toggle component from Magnus UI, moved to colorScheme prop from Chakra UI.
Import
import { Switch } from "react-native-ficus-ui";
Usage
Props
colorScheme
The background color of switch when is active.
| Type | Required | Default | 
|---|---|---|
| string | No | green | 
bg
The background color property (backgroundColor style prop in StyleSheet)
| Type | Required | Default | 
|---|---|---|
| string | No | gray.400 | 
thumbBg
The background color of thumb component (circle).
| Type | Required | Default | 
|---|---|---|
| string | No | white | 
activeThumbBg
The background color of thumb when toggle is on.
| Type | Required | Default | 
|---|---|---|
| string | No | white | 
isDisabled
Disables onPress handler when true.
| Type | Required | 
|---|---|
| boolean | No | 
onPress
onPress event handler.
| Type | Required | 
|---|---|
| () => void | No | 
on
makes the toggle active when true.
| Type | Required | 
|---|---|
| boolean | No | 
m
The margin property (margin style prop in StyleSheet)
| Type | Required | 
|---|---|
| number, string | No | 
mt
The margin top property (marginTop style prop in StyleSheet)
| Type | Required | 
|---|---|
| number, string | No | 
mb
The margin bottom property (marginBottom style prop in StyleSheet)
| Type | Required | 
|---|---|
| number, string | No | 
mr
The margin right property (marginRight style prop in StyleSheet)
| Type | Required | 
|---|---|
| number, string | No | 
ml
The margin left property (marginLeft style prop in StyleSheet)
| Type | Required | 
|---|---|
| number, string | No | 
mx
The margin horizontal property (marginHorizontal style prop in StyleSheet)
| Type | Required | 
|---|---|
| number, string | No | 
my
The margin vertical property (marginVertical style prop in StyleSheet)
| Type | Required | 
|---|---|
| number, string | No | 
p
The padding property (padding style prop in StyleSheet)
| Type | Required | 
|---|---|
| number, string | No | 
pt
The padding top property (paddingTop style prop in StyleSheet)
| Type | Required | 
|---|---|
| number, string | No | 
pb
The padding bottom property (paddingBottom style prop in StyleSheet)
| Type | Required | 
|---|---|
| number, string | No | 
pr
The padding right property (paddingRight style prop in StyleSheet)
| Type | Required | 
|---|---|
| number, string | No | 
pl
The padding left property (paddingLeft style prop in StyleSheet)
| Type | Required | 
|---|---|
| number, string | No | 
px
The padding horizontal property (paddingHorizontal style prop in StyleSheet)
| Type | Required | 
|---|---|
| number, string | No | 
py
The padding vertical property (paddingVertical style prop in StyleSheet)
| Type | Required | 
|---|---|
| number, string | No | 
h
The height property (height style prop in StyleSheet)
| Type | Required | 
|---|---|
| number, string | No | 
w
The width property (width style prop in StyleSheet)
| Type | Required | 
|---|---|
| number, string | No | 
borderRadius
The border radius property (borderRadius style prop in StyleSheet)
| Type | Required | Default | 
|---|---|---|
| number, string | No | none | 
borderTopRadius
The border radius top property (borderTopLeftRadius and borderTopRightRadius style props in StyleSheet)
| Type | Required | Default | 
|---|---|---|
| number, string | No | none | 
borderBottomRadius
The border radius bottom property (borderBottomLeftRadius and borderBottomRightRadius style props in StyleSheet)
| Type | Required | Default | 
|---|---|---|
| number, string | No | none | 
borderLeftRadius
The border radius left property (borderTopLeftRadius and borderBottomLeftRadius style props in StyleSheet)
| Type | Required | Default | 
|---|---|---|
| number, string | No | none | 
borderRightRadius
The border radius right property (borderTopRightRadius and borderBottomRightRadius style props in StyleSheet)
| Type | Required | Default | 
|---|---|---|
| number, string | No | none | 
borderTopLeftRadius
The border radius top left property (borderTopLeftRadius style prop in StyleSheet)
| Type | Required | Default | 
|---|---|---|
| number, string | No | none | 
borderTopRightRadius
The border radius top right property (borderTopRightRadius style prop in StyleSheet)
| Type | Required | Default | 
|---|---|---|
| number, string | No | none | 
borderBottomLeftRadius
The border radius bottom left property (borderBottomLeftRadius style prop in StyleSheet)
| Type | Required | Default | 
|---|---|---|
| number, string | No | none | 
borderBottomRightRadius
The border radius bottom right property (borderBottomRightRadius style prop in StyleSheet)
| Type | Required | Default | 
|---|---|---|
| number, string | No | none | 
borderColor
The border color property (borderColor style prop in StyleSheet)
| Type | Required | 
|---|---|
| string | No | 
borderTopColor
The border top color property (borderTopColor style prop in StyleSheet)
| Type | Required | 
|---|---|
| string | No | 
borderBottomColor
The border bottom color property (borderBottomColor style prop in StyleSheet)
| Type | Required | 
|---|---|
| string | No | 
borderRightColor
The border right color property (borderRightColor style prop in StyleSheet)
| Type | Required | 
|---|---|
| string | No | 
borderLeftColor
The border left color property (borderLeftColor style prop in StyleSheet)
| Type | Required | 
|---|---|
| string | No | 
borderWidth
The border width property (borderWidth style prop in StyleSheet)
| Type | Required | 
|---|---|
| number | No | 
borderTopWidth
The border top width property (borderTopWidth style prop in StyleSheet)
| Type | Required | 
|---|---|
| number | No | 
borderBottomWidth
The border bottom width property (borderBottomWidth style prop in StyleSheet)
| Type | Required | 
|---|---|
| number | No | 
borderRightWidth
The border right width property (borderRightWidth style prop in StyleSheet)
| Type | Required | 
|---|---|
| number | No | 
borderLeftWidth
The border left width property (borderLeftWidth style prop in StyleSheet)
| Type | Required | 
|---|---|
| number | No |