React-native-stars-rating NPM

react-native-stars-rating

This is a simple rating component for react-native.

Dependencies

react-native-vector-icons
class-autobind

Installation

$ npm install react-native-stars-rating --save

Link Material Icons Usage

$ react-native link

Usage Example

import Stars from 'react-native-stars-rating';

<Stars
  isActive={true}
  rateMax={5}
  isHalfStarEnabled={false}
  onStarPress={(rating) => console.log(rating)}
  rate={3}
  size={60}
/>

Props

type Props = {
  size?: number;
  color?: number;
  rate: number;
  rateMax: number;
  isActive: boolean;
  onStarPress?: (rating: number) => void;
  isHalfStarEnabled?: boolean;
  rounding: 'up' : 'down';
};

Props Explanation

Prop	Description	Default	Required
size	The Size of the stars	20	no
color	Determine the color of the stars rating	#EEB211	no
rate	Shows current rating for the star component to display	0 (if not active) or 1 (if active)	yes
rateMax	Determine the maximum stars rating to display	5	yes
isActive	Enable the stars rating to be clickable	`false`	yes
onStarPress	A function that returns the current active rating number using callback	`null`	no
isHalfStarEnabled	Enable the star rating component to support half rating	`false`	no
rounding	Enabled rounding logic on rating (3.25 -> 3.5) if using up or vice versa	`down`	yes