mroads-rn-elements

This package provides the react native UI elements provided by mroads

Getting started

These instructions will get you a copy of the project up and running on your local machine for development.

Prerequisites

Install the package mroads-rn-elements from node's package manager(npm)

npm i mroads-rn-elements

Components and Usage

1. Button Usage :

import { Button } from 'mroads-rn-elements';

Sample:

<Button 
    containerStyle={containerStyle} 
    textStyle={textStyle} 
    onPress={onPressHandler}>Go!
</Button>

Props: containerStyle -> This prop specifies the button container style textStyle -> This prop specifies the button text style onPress -> This prop specifies the press handler function for the button

2. TextInput Usage:

import { TextInput } from 'mroads-rn-elements';

Sample:

<TextInput 
    label={'LABEL'} 
    placeholder={'PLACEHOLDER'} 
    labelStyle={labelStyle} 
    secure={secure} 
    containerStyle={containerStyle} 
    textInputStyle={textInputStyle} 
    iconSource={iconSource} 
/>

Props: label -> This prop specifies the text-input label (present over the text input) placeholder -> This prop specifies the placeholder for the text-input labelStyle -> This prop specifies the style that will be applied to text-input label (present over the text input) secure -> This specifies if the text-input data to be secured or not containerStyle -> This prop specifies the text-input container style textInputStyle -> This prop specifies the styles that will be applied for input type iconSource -> This specifies the image source(if any icon is needed for the text-input)

3. Icon Usage:

import { Icon } from 'mroads-rn-elements';

Sample:

<Icon 
    containerStyle={containerStyle}
    imageStyle={imageStyle}
    onPress={onPressHandler}
/>

Props: containerStyle -> This prop specifies the image container style imageStyle -> This specifies the image related styles onPress -> This prop specifies the press handler function for the image