Neural Prediction Model

    @pachun/rn-pdf-reader-js
    TypeScript icon, indicating that this package has built-in type declarations

    0.5.0 • Public • Published

    PDF reader for Expo

    Android support 🚀





    npm version

    💥 DEMO 💥

    Read a PDF just with JS (no native libs needed)

    Limitations

    • Display file only on full screen.
    • Embeded images binary are not display (yet) in Android

    PRs are welcome...

    Example

    import React from 'react'
    import { StyleSheet, View } from 'react-native'
    import PDFReader from 'rn-pdf-reader-js'
    import Constants from 'expo-constants'
    
    export default class App extends React.Component {
      render() {
        return (
          <View style={styles.container}>
            <PDFReader
              source={{
                uri: 'http://gahp.net/wp-content/uploads/2017/09/sample.pdf',
              }}
            />
          </View>
        )
      }
    }
    
    const styles = StyleSheet.create({
      container: {
        flex: 1,
        paddingTop: Constants.statusBarHeight,
        backgroundColor: '#ecf0f1',
      },
    })

    Props

    • source: Object
      • uri?: string - can be local or served on the web (ie. start withs https:// or file://)
      • base64?: string - should start with data:application/pdf;base64,. A base64 encoded pdf file tends to start with JVBERi0xL so your complete string should look soemthing like this: data:application/pdf;base64,JVBERi0xL...
    • style: object - style props to override default container style
    • webviewStyle: object - style props to override default WebView style
    • onLoad: func - callback that runs after WebView is loaded
    • noLoader: boolean - show/hide the ActivityIndicator. Default is false

    Requirements

    • Use it into Expo app (from expo client, Standalone app or ExpoKit app).
    • Because we need to have access to Expo.FileSystem
    • Only React-Native 0.54+ support, Expo SDK 27

    Features

    • For Android, use react-pdf / pdfjs in the webview
    • For iOS devices, display file directly to the WebView

    What rn-pdf-reader-js use?

    • react-pdf (pdf.js)
    • WebView
    • Expo FileSystem API
    • Base64

    FAQ

    Hire an expert!

    Looking for a ReactNative freelance expert with more than 12 years experience? Contact me from my website!

    Install

    npm i @pachun/rn-pdf-reader-js

    DownloadsWeekly Downloads

    1

    Version

    0.5.0

    License

    MIT

    Unpacked Size

    3.04 MB

    Total Files

    11

    Last publish

    Collaborators

    • pachun