react-native-just-checkbox
  • Introduction
  • Getting Started
  • Examples
  • Change Log
  • Migration Guide: v1 to v2
Powered by GitBook
On this page
  • Installation
  • Quick Start
  • Props

Getting Started

Installation

First, install the package:

npm install react-native-just-checkbox
yarn add 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

() => void

Function called when the checkbox is pressed.

-

PreviousIntroductionNextExamples

Last updated 11 months ago

onPress