0.1.0 • Published 3 years ago

@nghinv/react-native-switch v0.1.0

Weekly downloads
-
License
MIT
Repository
github
Last release
3 years ago

@nghinv/react-native-switch

React Native Switch Library


CircleCI Version MIT License All Contributors PRs Welcome

Installation

yarn add @nghinv/react-native-switch

or

npm install @nghinv/react-native-switch
  • peerDependencies
yarn add react-native-gesture-handler react-native-reanimated

Usage

import React, { useState } from 'react';
import { View, Text, StyleSheet } from 'react-native';
import Switch from '@nghinv/react-native-switch';

function App() {
  const [enable, setEnable] = useState(true);

  return (
    <View style={styles.container}>
      <View style={styles.row}>
        <Text style={styles.title}>Switch</Text>
        <Switch 
          value={enable} 
          onChange={(value) => setEnable(value)} 
        />
      </View>
    </View>
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
  },
  row: {
    flexDirection: 'row',
    alignItems: 'center',
    justifyContent: 'space-between',
    padding: 16,
  },
  title: {
    fontSize: 16,
  },
});

export default App;

Property

PropertyTypeDefaultDescription
sizeNumber27
thumbColorStringwhite
trackColorTrackColorProperty
disabledBoolfalse
valueBoolfalse
onChange(value: boolean) => voidundefined
styleViewStyleundefined
progressAnimated.SharedValue<number>undefined

TrackColorProperty

PropertyTypeDefaultDescription
falseStringrgba(120, 120, 120, 0.3)
trueString#31D158

Credits

0.1.0

3 years ago

0.0.5

3 years ago

0.0.4

3 years ago

0.0.3

3 years ago

0.0.2

3 years ago

0.0.1

3 years ago