Skip to content

Backgrounds shapes to React Native based in flex (Android + IOS)

License

Notifications You must be signed in to change notification settings

bytesleo/react-native-background-shapes

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

22 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

react-native-background-shapes

NPM version GitHub license

Beautiful backgrounds shapes to React Native based in flex (Android + IOS)

Examples

Installation

Yarn

yarn add react-native-background-shapes

Npm

npm i react-native-background-shapes

Basic usage

import react from "react";
import {View} from "react-native";
import {Shapes} from "react-native-background-shapes";

export const example () => {
return (
    <View>
        <Shapes />
    </View>
    );
}

Options

// Advance
 <Shapes
    primaryColor="#416DF8"
    secondaryColor="#2F53D5"
    height={3}
    borderRadius={20}
    figures={[
      {name: 'circle', position: 'center', size: 60},
      {name: 'donut', position: 'flex-start', axis: 'top', size: 80},
      {name: 'circle', position: 'center', axis: 'right', size: 100},
    ]}
 />
  • primaryColor: String, HEX color.
  • secondaryColor: String, HEX color.
  • height: Number, 1 = full screen, default (3.5)
  • borderRadius: Number, default 30
  • figures: Array
    • name: String = "circle","donut, "triangle", "diamondNarrow", "cutDiamond"
    • position: String = "flex-start", "center, "flex-end", "baseline", "stretch"
    • axis: String = "top", "right, "bottom", "left"

License

MIT © Leonardo Rico

Releases

No releases published

Packages

No packages published