代码拉取完成,页面将自动刷新
Toggle Switch Component for react native, it works on iOS and Android.
npm i toggle-switch-react --save
import ToggleSwitch from 'toggle-switch-react'
To Get Started, Import toggle-switch-react
to your js file.
import ToggleSwitch from 'toggle-switch-react'
Inside your component's render method, or any other method returning views, use ToggleSwitch:
<ToggleSwitch
isOn={false}
onColor="green"
offColor="red"
label="Example label"
labelStyle={{ color: "black", fontWeight: "900" }}
size="large"
onToggle={isOn => console.log("changed to : ", isOn)}
/>
Props | Type | Optional | Default | Description |
---|---|---|---|---|
isOn | Boolean | true | 'false' | Default state, true for On, false for off |
onColor | String | true | '#634fc9' | On Color |
offColor | String | true | '#ecf0f1' | Off Color |
label | String | true | Custom Label Text on the Left of the toggle Button | |
labelStyle | Object | true | {marginHorizontal: 10} | Custom Styling for the Label Text View |
size | String | true | 'medium' | Size of the toggle switch button ( 'large', 'medium', 'small') |
icon | React Component | true | null | Icon for the toggle. Can be any React Component considerate of size |
onToggle | Function Callback | false | none | Callback when the toggle switch component changes the state, params: isOn |
disabled | Boolean | true | 'false' | Disable toggling the component |
If you encountered an Issue, please add a screenshot of the bug or a code snippet.
Quickest way to solve issue is to reproduce it on the example project
Pull requests are welcome. If you want to change the API or imporove something, feel free to create an issue and discuss it first.
MIT Licensed
此处可能存在不合适展示的内容,页面不予展示。您可通过相关编辑功能自查并修改。
如您确认内容无涉及 不当用语 / 纯广告导流 / 暴力 / 低俗色情 / 侵权 / 盗版 / 虚假 / 无价值内容或违法国家有关法律法规的内容,可点击提交进行申诉,我们将尽快为您处理。