React Native Elements

Cross Platform React Native UI Toolkit

Get Started

Installation

• If you are using create-react-native-app or Expo, follow these instructions.

• If your project is a standard React Native project (if you have an ios/android directory and created it with react-native init), follow these installation instructions.

Usage

Start using the components:

import { Button } from 'react-native-elements';

<Button
  raised
  icon={{name: 'home', size: 32}}
  buttonStyle={{backgroundColor: 'red', borderRadius: 10}}
  textStyle={{textAlign: 'center'}}
  title={`Welcome to\nReact Native Elements`} />

Components Included

• Buttons
• Social Icons / Social Icon Buttons
• Icons
• Side Menu
• Form Elements
• Search Bar
• ButtonGroup
• Checkboxes
• List Element
• Badge
• Tab Bar Component
• HTML style headings
• Card component
• Pricing Component
• Grid Component
• Slider Component
• Tile Component
• Avatar Component

Documentation

View the full docs here

Demo App

Check out the pre built and configured React Native Hackathon Starter Project which uses all of these elements.

Roadmap

FIRST CONTRIBUTORS

• Add Profile Component
• Add Header Component
• Add Badge Component
• Refactor Social Icon to use Button

NOT STARTED

• Floating labels on FormInput
• Compatibility with react-native-web
• Support Multiple FormInput refs
• Two-Marker Slider
• Add Notification Component
• Add Image Component which supports parallax
• Add DatePicker/Calendar Component
• Add Theming & Default Styles
• Something you's like to see? Submit an issue or a pull request

Contributing

Interested in contributing to this repo? Have a look at our Contributing Guide

Also come say hi to the RNE community on our public Slack team. See you on the other side! :)

Backers

Support us with a monthly donation and help us continue our activities. [Become a backer]

Sponsors

Become a sponsor and get your logo on our README on Github with a link to your site. [Become a sponsor]