Animated checkbox built with Reanimated v2

react-native-checkbox-reanimated

Animated checkbox built with Reanimated v2.
This component has been created for the React Native tutorial here.

Prerequisites

Installation

npm install react-native-checkbox-reanimated
npm install react-native-reanimated react-native-svg

Usage

import React, { useState } from 'react' import { StyleSheet, View, Pressable } from 'react-native' import AnimatedCheckbox from 'react-native-checkbox-reanimated' export default function App() { const [checked, setChecked] = useState<boolean>(false) const handleCheckboxPress = () => { setChecked(prev => { return !prev }) } return ( <View style={styles.container}> <Pressable onPress={handleCheckboxPress} style={styles.checkbox}> <AnimatedCheckbox checked={checked} highlightColor="#4444ff" checkmarkColor="#ffffff" boxOutlineColor="#4444ff" /> </Pressable> </View> ) } const styles = StyleSheet.create({ container: { flex: 1, alignItems: 'center', justifyContent: 'center' }, checkbox: { width: 64, height: 64 } })

License

MIT

GitHub

View Github