2

I have a pdf that I would like to display to a user once a button is clicked. I have been successful at showing the user a pdf from the like so:

<TouchableOpacity onPress={() => Linking.openURL('www.somesite.com/manual.pdf')}>
  <Text>See pdf</Text>
</TouchableOpacity>

This was great as it opened up a native pdf reader and downloaded the content accordingly. I would like to achieve a similar result with a local application pdf file but I don't know how to achieve a similar effect using the openUrl api.

I have seen answers an answer at How to open local PDF file in WebView in Android? but it seems like this solutions creates a webView component that has to be styled and laid out as an in app component. Its not what I want. I just want a native pdf viewer to read the local file content and do its thing.

alaboudi
  • 3,187
  • 4
  • 29
  • 47

1 Answers1

1

You can try "react-native-view-pdf package. It's pretty simple and has zero NPM dependencies:

import PDFView from 'react-native-view-pdf';

<View style={{ flex: 1 }}>
  <PDFView
    style={{ flex: 1 }}
    onError={(error) => console.log('onError', error)}
    onLoad={() => console.log('PDF rendered from url')}
    resource="http://www.pdf995.com/samples/pdf.pdf"
    resourceType="url"
  />
</View>

And this solution allows to easily embed the PDF document to the application, instead of opening it with external app. It can be a separate page for example. We already use it for some time in production without any issues and it allows us to open PDFs from local files, urls or base64 string.

Otherwise if you want external app to open PDF you need to write it to file and use Linking.

Max
  • 1,090
  • 10
  • 23