Getting Started

Installation

First, install the package:

npm install react-native-just-checkbox

Quick Start

import React, { useState } from 'react';
import { StyleSheet, Text, View } from "react-native";
import { CheckBox } 'react-native-just-checkbox';

export default function App() {
  const [isChecked, setIsChecked] = useState(false);

  return (
    <View style={styles.container}>
      <CheckBox isChecked={isChecked} onPress={() => setIsChecked(!isChecked)} />
    </View>
  );
};

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: "#fefefe",
    justifyContent: "center",
    paddingHorizontal: 50,
  }
});

Props

Prop
Type
Description
Default

isChecked

boolean

Whether the checkbox is checked or not.

-

isDisabled

boolean

Whether the checkbox is disabled or not. Disabled checkboxes will not trigger touch events and their opacity will be set to 0.2.

false

checkBoxSize

number

The size of the checkbox (applied to both width and height).

20

checkColor

string

The color of the checkmark.

#1a1a1a

animationType

"bounce" | "opacity" | "none"

The animation type for the checkbox.

"none"

fillMode

boolean

Whether to fill the background of the CheckBox.

false

fillColor

string

The background fill color of the CheckBox.

-

borderWidth

number

The border width of the CheckBox.

1.5

borderRadius

number

The border radius of the CheckBox.

checkBoxSize

onPress

() => void

Function called when the checkbox is pressed.

-

Last updated