rumax / react-native-PDFView

📚 PDF viewer for React Native
MIT License
300 stars 92 forks source link

Cannot display file in device local storage on Android #64

Closed ld234 closed 6 years ago

ld234 commented 6 years ago

I followed exactly the example code. It works for resource type url but does not work for file. I dragged a file from my computer into the AVD and it says that the file is stored in /sdcard/Download. When I go to the Internal storage/Download folder, I do see the file in there. But it just does not appear in my app. Here is my code.

import PDFView from 'react-native-view-pdf';
import React from 'react';
import { View, Platform, Text } from 'react-native';

const resources = {
  file: Platform.OS === 'ios' ? 'food_questionnaire.pdf' : 'file:///sdcard/Download/food_questionnaire.pdf',
  /* I also tried /sdcard/Download/food_questionnaire.pdf 
   * and /storage/emulated/0/Download/food_questionnaire.pdf but none of them worked.
   */
  url: 'https://www.ets.org/Media/Tests/TOEFL/pdf/SampleQuestions.pdf',
  base64: 'JVBERi0xLjMKJcfs...',
};

export default class PDFFile extends React.Component {
  render() {
    const resourceType = 'file';

    return (
      <View style={{ flex: 1, height: null }}>
        {/* Some Controls to change PDF resource */}
        <PDFView
          fadeInDuration={250.0}
          style={{ flex: 1 }}
          resource={resources[resourceType]}
          resourceType={resourceType}
          onLoad={() => console.log(`PDF rendered from ${resourceType}`)}
          onError={(error) => console.log('Cannot render PDF', error)}
        /> 
      </View>
    );
  }
}

My environment: react-native: ~0.55.2 react-native-view-pdf: ^0.4.1 android/app/build.gradle

android {
    compileSdkVersion 23
    buildToolsVersion "23.0.1"

    defaultConfig {
        applicationId "com.healthscout"
        minSdkVersion 19
        targetSdkVersion 26
        versionCode 1
        versionName "1.0"
        ndk {
            abiFilters "armeabi-v7a", "x86"
        }
    }
    splits {
        abi {
            reset()
            enable enableSeparateBuildPerCPUArchitecture
            universalApk false  // If true, also generate a universal APK
            include "armeabi-v7a", "x86"
        }
    }
    buildTypes {
        release {
            minifyEnabled enableProguardInReleaseBuilds
            proguardFiles getDefaultProguardFile("proguard-android.txt"), "proguard-rules.pro"
        }
    }
    // applicationVariants are e.g. debug, release
    applicationVariants.all { variant ->
        variant.outputs.each { output ->
            // For each separate APK per architecture, set a unique version code as described here:
            // http://tools.android.com/tech-docs/new-build-system/user-guide/apk-splits
            def versionCodes = ["armeabi-v7a":1, "x86":2]
            def abi = output.getFilter(OutputFile.ABI)
            if (abi != null) {  // null for the universal-debug, universal-release variants
                output.versionCodeOverride =
                        versionCodes.get(abi) * 1048576 + defaultConfig.versionCode
            }
        }
    }
}

dependencies {
    compile project(':react-native-fs')
    compile project(':react-native-view-pdf')
    compile project(':rn-fetch-blob')
    compile project(':react-native-spinkit')
    compile project(':react-native-vector-icons')
    compile fileTree(dir: "libs", include: ["*.jar"])
    compile "com.android.support:appcompat-v7:23.0.1"
    compile "com.facebook.react:react-native:+"  // From node_modules
}

// Run this once to be able to run the application with BUCK
// puts all compile dependencies into folder libs for BUCK to use
task copyDownloadableDepsToLibs(type: Copy) {
    from configurations.compile
    into 'libs'
}
ld234 commented 6 years ago

I finally figured out the problem. I was not able to read from internal storage because I did have the right permission. See PermissionsAndroid for more details.

rumax commented 6 years ago

Thanks for update, I readme is updated. Btw, you can check demo project, there is implementation for PermissionsAndroid.