# toggle-switch-rn

> switch for react-native

Latest version **1.3.7** (published 2018-01-25) · MIT license · 0 weekly downloads

## Install

```sh
npm install toggle-switch-rn
pnpm add toggle-switch-rn
yarn add toggle-switch-rn
bun add toggle-switch-rn
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.3.7 |
| Published | 2018-01-25 |
| First published | 2018-01-24 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 0 |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 0 |
| Author | jtr354 |
| Maintainers | jtr354 |
| Keywords | jtr354, switch, react-native |

## Links

- npm: https://www.npmjs.com/package/toggle-switch-rn
- Repository: https://github.com/JTR354/switch-react-native-jtr354
- Homepage: https://github.com/JTR354/switch-react-native-jtr354#readme
- Issues: https://github.com/JTR354/switch-react-native-jtr354/issues
- npm.io page: https://npm.io/package/toggle-switch-rn

## Recent versions

- 1.3.7 (latest) — 2018-01-25
- 1.3.6 — 2018-01-25
- 1.2.6 — 2018-01-25
- 0.1.2 — 2018-01-24
- 0.1.1 — 2018-01-24
- 0.1.0 — 2018-01-24

## README

# Switch Component for react native, it works on iOS and Android.

## [github地址](https://github.com/JTR354/switch-react-native-jtr354.git)
* 基于View样式改变实现switch功能

## Installation

 * `npm i toggle-switch-rn --save`
 * `import Switch from 'toggle-switch-rn'`

## Demo

```javascript

<Switch
    isOn={this.state.resetSwitch * 1}
    animationType={0}
    change={() => {
        const resetSwitch = !(this.state.resetSwitch * 1)
        this.setState({ resetSwitch })
        this._changReset.call(this, resetSwitch)
    }}
/>
```

## API
|属性值|作用|是否装配|备注|
|:--:|:--:|:--:|:--:|
|isOn|开关状态|是||
|change|开关改变后的方法|是||
|animationType|开关动画效果|否|默认0：spring
|boxStyle|容器样式|否||
|boxIsOnStyle|开启时容器的样式|否||
|switchStyle|按钮的样式|否||

- 属性默认值：
```js
//动画效果类型
const animationType = [
    LayoutAnimation.spring,
    LayoutAnimation.linear,
    LayoutAnimation.easeInEaseOut
]

//默认样式
boxStyle:{
    width: 55,
    height: 30,
    borderRadius: 30,
    backgroundColor: '#D9D9D9'
},
boxIsOnStyle:{
    backgroundColor: '#1678FF'
},
switchStyle:{
    width: 30,
    height: 30,
    backgroundColor: '#fff',
    borderRadius: 30,
    borderColor: 'rgba(0,0,0,.1)',
    borderWidth: .5
},
animationType:0

```

**MIT Licensed**

---
_Source: https://npm.io/package/toggle-switch-rn · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._