rn-fab-button

rn-fab-button

A React Native Fab Button Component built using react-native animations providing the user ability to add buttons and customize them accordingly.

Prerequisites

Kindly install @react-native-vector-icons before you start using this component.

Table of content

• Installation

  • yarn add rn-fab-button
  • npm i rn-fab-button

• Usage

• Props

• Credits

Usage

import { FloatingButton } from "rn-fab-button";

<FloatingButton
  noOfButtons={2}
  icons={["example", "example"]}
  size={20}
  toggleBtnSize={20}
  width={40}
  height={40}
  onPress={() => console.log("running")}
  buttonBgColor={"green"}
  toggleButtonStyle={{ backgroundColor: "#8B008B" }}
  iconColor="white"
/>;

Props

Required

Prop	Description	Type	Default
noOfButtons	No of buttons to be displayed	Number	Required
icons	Takes an array of name of icons to renders into the buttons. Receives an object with array {['example','example']}	Arryay	Required
width	Width in pixels for the fab buttons, same for all of them	Number	Required for background of the icons
height	height in pixels for the fab buttons	Number	Required for background of the icons
toggleBtnSize	Size of the toggle button	Number	**Required **
buttonBgColor	background color of the buttons	String	Optional
toggleButtonStyle	styling for the toggle buttons	String	Optional
iconColor	color of the fab button icons	String	Required
size	size of the fab buttons	Number	Requried
onPress	callback when the fab button is pressed	function	Optional

Credits

Written by Rachit Sharma (masquerade-x)