pFad - Phone/Frame/Anonymizer/Declutterfier! Saves Data!


--- a PPN by Garber Painting Akron. With Image Size Reduction included!

URL: http://github.com/torifat/react-native-bem-check-box

gin="anonymous" media="all" rel="stylesheet" href="https://github.githubassets.com/assets/primer-9e07ff8eaaaff3a3.css" /> GitHub - torifat/react-native-bem-check-box: React Native bridge for awesome BEMCheckBox https://github.com/Boris-Em/BEMCheckBox · GitHub
Skip to content

torifat/react-native-bem-check-box

Repository files navigation

React Native BEMCheckbox

React Native bridge for awesome BEMCheckBox

iOS Only

Preview

Content

Installation

  1. Install package via npm:
npm install --save react-native-bem-check-box
  1. Link your library by one of those ways: either by using rnpm link (see more about rnpm here) or like it's described here.
  2. Inside your code include JS part by adding
import BEMCheckBox from 'react-native-bem-check-box';
  1. Compile and have fun!

Usage example

You can run built-in example via few simple steps:

  1. Clone repository
  2. Go to Example
  3. Run npm install && open CheckBox.xcodeproj
  4. Hit "Run"(cmd+R) button on XCode panel

Basic usage

import BEMCheckBox from 'react-native-bem-check-box';

<BEMCheckBox
  onValueChange={value => this.setState(value)}
/>

Component properties

Check this section in BEMCheckBox document

  • value (boolean) - The current state. Defaults to false

  • lineWidth (number) - The width of the lines of the check mark and box. Defaults to 2.0

  • hideBox (boolean) - boolean to control if the box should be hidden or not. Setting this property to true will basically turn the checkbox into a check mark. Defaults to false

  • boxType (string) - The type of box to use. Defaults to circle

    • circle
    • square
  • tintColor (string) - The color of the line around the box when it is Off. Defaults to #aaaaaa

  • onCheckColor (string) - The color of the check mark when it is On. Defaults to #007aff

  • onFillColor (string) - The color of the inside of the box when it is On. Defaults to transparent

  • onTintColor (string) - The color of the line around the box when it is On. Defaults to #007aff

  • animationDuration (number) - The duration in seconds of the animations. Defaults to 0.5

  • onAnimationType/offAnimationType (string) - The type of animation to use when the checkbox gets checked/unchecked. Defaults to stroke

    • stroke
    • fill
    • bounce
    • flat
    • one-stroke
    • fade
  • onValueChange (function) - every time the check box gets tapped, after its properties are updated, but before the animations are completed.

  • onAnimationEnd (function) - every time the check box finishes being animated.

Changelog

  • 0.3.2 Animate on value property set
  • 0.3.1 Updated podspec
  • 0.2.0 Added Example
  • 0.1.0 Initial release

License

Copyright 2016 Rifat Nabi
Licensed under the MIT License.

About

React Native bridge for awesome BEMCheckBox https://github.com/Boris-Em/BEMCheckBox

Topics

Resources

Stars

Watchers

Forks

Packages

 
 
 

Contributors

pFad - Phonifier reborn

Pfad - The Proxy pFad © 2024 Your Company Name. All rights reserved.





Check this box to remove all script contents from the fetched content.



Check this box to remove all images from the fetched content.


Check this box to remove all CSS styles from the fetched content.


Check this box to keep images inefficiently compressed and original size.

Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.


Alternative Proxies:

Alternative Proxy

pFad Proxy

pFad v3 Proxy

pFad v4 Proxy