react-native-read-more-text

React native library to show text in a brief way and expand it when needed. It is a lightweight inline read more text component. It is written in Typescript and supports both TS/JS. It can be used with react native cli and expo both.

Installation

npm i @amuizz/read-more-text --save

or with yarn

yarn add @amuizz/read-more-text

Usage

import React from 'react';
import { View } from 'react-native';
import ReadMoreText from '@amuizz/read-more-text';
const Test = () => {
  return (
    <View>
      <ReadMoreText numberOfLines={1} readMoreText={"read more"} readLessText={"read less"} readMoreStyle={{color: "#CACACA"}} readLessStyle={{color: "#000"}} >
      Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, 
      when an unknown printer took a galley of type and scrambled it to make a type specimen book</ReadMoreText>
    </View>
  );
};
export default Test;

Props

Prop	Type	Required	Note
style	object or array	no	text style
readMoreText	string	no	defaults to more
readMoreStyle	object or array	no	text style for more text
readLessText	string	no	defaults to less
readLessStyle	object or array	no	text style for less text
readMoreSpace	number	no	number of spaces before the more text, defaults to 1
readLessSpace	number	no	number of spaces before the less text, defaults to 1
numberOfLines	number	no	defaults to 1

Any additional props can be passed down to underlying Text component.

Drop a star ⭐ to this repo, if you feel it is good