Build a React Native PDF Document Viewer or Reader From URL or Local Device in Android & IOS Using Javascript Full Project For Beginners

 

Welcome folks today in this blog post we will be building a pdf viewer using react native for android and ios apps.All the full source code of the application is shown below.

 

 

 

Get Started

 

 

In order to get started you need to install the below library using the npm command as shown below.

 

 

 

 

npm i react-native-pdf

 

 

Once installed, rendering the PDF is as easy as this:

 

export default class YourClass extends Component {
  constructor(props) {
    super(props);
    this.pdf = null;
  }

  render() {
    let yourPDFURI = {uri:'bundle-assets://pdf/YourPDF.pdf', cache: true};

    return <View style={{flex: 1}}>
      <Pdf ref={(pdf)=>{this.pdf = pdf;}}
        source={yourPDFURI}
        style={{flex: 1}}
        onError={(error)=>{console.log(error);}} />
    </View>
  }
}

Leave a Reply