Package Exports
- @lucasmrc435/rn-fab
This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (@lucasmrc435/rn-fab) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.
Readme
@lucasmrc435/rn-fab
React Native Floating Action Button
Install
Using npm
npm install @lucasmrc435/rn-fab --save
Using yarn
yarn add @lucasmrc435/rn-fab
Import
import FloatingActionButton from '@lucasmrc435/rn-fab'
Usage
<FloatingActionButton
color="orange"
onPress={() => {
console.log("FAB Pressed!");
}}
/>
Example
import React from 'react';
import { View, Text } from 'react-native';
import FloatingActionButton from '@lucasmrc435/rn-fab'
const App = () => {
return (
<View>
<Text>Look at the FAB</Text>
<FloatingActionButton
color="orange"
onPress={() => {
console.log("FAB Pressed!");
}}
/>
<FloatingActionButton
position="center"
onPress={() => {
console.log("FAB Pressed!");
}}
/>
<FloatingActionButton
position="left"
icon="wallet"
onPress={() => {
console.log("FAB Pressed!");
}}
/>
<View>
);
}
Props
Property | Type | Default | Description |
---|---|---|---|
color | String | #049bdb | FAB's Color |
position | String | right |
FAB's position |
icon | String | plus |
FAB's Icon |
iconColor | String | white | Icon's Color |
OnPress | Function | null | FAB's onPress function |
color
The color that will fill the FAB. Any color of StyleSheets and CSS
type : String
position
The FAB's position. Position can only be left
| center
| right
type : String
icon
The Icon that will appear inside the FAB. Any Icon from MaterialCommunityIcons
type : String
iconColor
The color that will fill the FAB's Icon
type : String
onPress
The function that is called when the button is activated.
type : Void Function