compdfkit(rn) - 新增设置页面，优化示例代码

android/src/main/java/com/compdfkitpdf/reactnative/util/CPDFDocumentUtil.java

@@ -8,6 +8,7 @@ public class CPDFDocumentUtil {
   public static final String ASSETS_SCHEME = "file:///android_asset";
 
   public static final String CONTENT_SCHEME = "content://";
+  public static final String FILE_SCHEME = "file://";
 
   public static String getAssetsDocument(Context context, String document) {
       String assetsPath = document.replace(ASSETS_SCHEME + "/","");

android/src/main/java/com/compdfkitpdf/reactnative/view/CPDFView.java

@@ -64,7 +64,12 @@ public class CPDFView extends FrameLayout {
     if (document.startsWith(CPDFDocumentUtil.ASSETS_SCHEME)) {
       this.document = CPDFDocumentUtil.getAssetsDocument(getContext(), document);
     } else if (document.startsWith(CPDFDocumentUtil.CONTENT_SCHEME)) {
-     this.document = document;
+      this.document = document;
+    } else if (document.startsWith(CPDFDocumentUtil.FILE_SCHEME)) {
+      Uri uri = Uri.parse(document);
+      this.document = uri.toString();
+    } else {
+      this.document = document;
     }
     initDocumentFragment();
   }
@@ -79,7 +84,8 @@ public class CPDFView extends FrameLayout {
       return;
     }
     if (documentFragment == null) {
-      if (document.startsWith(CPDFDocumentUtil.CONTENT_SCHEME)){
+      if (document.startsWith(CPDFDocumentUtil.CONTENT_SCHEME) ||
+        document.startsWith(CPDFDocumentUtil.FILE_SCHEME)){
         documentFragment = CPDFDocumentFragment.newInstance(Uri.parse(document), password, configuration);
       }else {
         documentFragment = CPDFDocumentFragment.newInstance(document, password, configuration);
@@ -111,5 +117,4 @@ public class CPDFView extends FrameLayout {
     super.requestLayout();
     post(mLayoutRunnable);
   }
-
 }

android/src/main/java/com/compdfkitpdf/reactnative/viewmanager/CPDFViewManager.java

@@ -58,19 +58,18 @@ public class CPDFViewManager extends ViewGroupManager<CPDFView> {
   }
 
 
-
   @ReactProp(name = "document")
-  public void setDocument(CPDFView pdfView, ReadableMap documentInfo){
+  public void setDocument(CPDFView pdfView, ReadableMap documentInfo) {
     Log.e("ComPDFKitRN", "CPDFViewManager-setDocument()");
     String document = documentInfo.getString("path");
     String password = documentInfo.getString("password");
-    Log.e("ComPDFKitRN", document.toString());
+    Log.e("ComPDFKitRN", "document:" + document);
+    Log.e("ComPDFKitRN", "password:" + password);
     pdfView.setDocument(document, password);
-
   }
 
   @ReactProp(name = "configuration")
-  public void setConfiguration(CPDFView pdfView, String configurationJson){
+  public void setConfiguration(CPDFView pdfView, String configurationJson) {
     Log.e("ComPDFKitRN", "CPDFViewManager-setConfiguration()");
     CPDFConfiguration configuration = CPDFConfigurationUtils.fromJson(configurationJson);
     pdfView.setConfiguration(configuration);

example/android/app/build.gradle

@@ -124,7 +124,7 @@ android {
 dependencies {
     // The version of react-native is set by the React Native Gradle Plugin
     implementation("com.facebook.react:react-android")
-  implementation 'com.google.android.material:material:1.8.0'
+    implementation 'com.google.android.material:material:1.8.0'
 
     if (hermesEnabled.toBoolean()) {
         implementation("com.facebook.react:hermes-android")

example/src/screens/CPDFReaderViewExampleScreen.tsx

@@ -4,9 +4,12 @@ import { Platform } from 'react-native';
 
 class CPDFReaderViewExampleScreen extends Component {
 
-
     render() {
-        var samplePDF: string = Platform.OS == 'android' ? 'file:///android_asset/PDF_Document.pdf' : 'PDF_Document.pdf'
+        var samplePDF: string = Platform.OS == 'android' ? 'file:///android_asset/test_pdf.pdf' : 'PDF_Document.pdf'
+        // android file path example:
+        // var samplePDF = 'file:///android_asset/PDF_Document.pdf'
+        // var samplePDF = '/data/user/0/com.compdfkit.reactnative.example/cache/PDF_Document.pdf'
+        // var samplePDF = 'content://xxxx/xxx.pdf'
         return (
             <CPDFReaderView 
             document={{
@@ -15,7 +18,6 @@ class CPDFReaderViewExampleScreen extends Component {
             }}
             zoomEnabled={true}
             configuration={ComPDFKit.getDefaultConfig({})}
-            
             style={{flex : 1}}/>
         );
     }

example/src/examples.tsx

@@ -10,7 +10,6 @@
 import { Platform } from 'react-native';
 import { ComPDFKit } from '@compdfkit_pdf_sdk/react_native';
 import DocumentPicker from 'react-native-document-picker'
-import { useNavigation } from "@react-navigation/native";
 
 const examples = [
     {
@@ -45,7 +44,7 @@ const examples = [
     },
     {
         key: 'item3',
-        title: 'Show CPDFReaderView',
+        title: 'Show CPDFReaderView Component',
         description: 'Display pdf view in react native component',
         action: (component: any)  => {
             component.props.navigation.navigate('CPDFReaderViewExample');

example/src/screens/HomeScreen.tsx

@@ -2,38 +2,17 @@ import React, { Component } from "react";
 import {
   FlatList,
   Image,
-  NativeModules,
   Text,
   StyleSheet,
   TouchableOpacity,
   View,
 } from 'react-native';
-import { Platform } from 'react-native';
 
-import { ComPDFKit } from '@compdfkit_pdf_sdk/react_native';
 import examples from "../examples";
 
 type Props = {};
 class HomeScreen extends Component<Props> {
 
-  state = {
-    versionCode: ''
-  }
-
-
-  constructor(props: Props) {
-    super(props)
-    this.getVersionCode()
-  }
-
-  async getVersionCode() {
-    // Get the version code of ComPDFKit SDK
-    var version = await ComPDFKit.getVersionCode()
-    this.setState({
-      versionCode: version
-    })
-  }
-
   render() {
     return (
         <View style={styles.container}>
@@ -43,8 +22,6 @@ class HomeScreen extends Component<Props> {
             renderItem={this._renderItem}
             keyExtractor={item => item.key}
           />
-
-            <Text style={styles.body2}>ComPDFKit for {Platform.OS == 'android' ? 'Android' : 'iOS'} {this.state.versionCode}</Text>
       </View>
     );
   }

example/src/screens/SettingScreen.tsx

@@ -0,0 +1,139 @@
+import React, { Component } from "react";
+import {
+    FlatList,
+    Image,
+    NativeModules,
+    Text,
+    StyleSheet,
+    TouchableOpacity,
+    View,
+    Platform,
+    Linking
+} from 'react-native';
+
+import { ComPDFKit } from '@compdfkit_pdf_sdk/react_native';
+
+type Props = {};
+class SettingScreen extends Component {
+
+
+    state = {
+        versionCode: ''
+    }
+
+    constructor(props: Props) {
+        super(props)
+        this.getVersionCode()
+    }
+
+    async getVersionCode() {
+        // Get the version code of ComPDFKit SDK
+        var version = await ComPDFKit.getVersionCode()
+        this.setState({
+            versionCode: version
+        })
+    }
+
+    render() {
+        return (
+            <View style={styles.container}>
+                <View style={styles.header}>
+                    <Text style={styles.headerText}>SDK Information</Text>
+                </View>
+                <View style={styles.infoItem}>
+                    <Text style={styles.infoItemText}>Versions</Text>
+                    <Text style={styles.infoItemText}>ComPDFKit {this.state.versionCode} for {Platform.OS} </Text>
+                </View>
+                <View style={styles.header}>
+                    <Text style={styles.headerText}>Company Information</Text>
+                </View>
+                <View style={{ flex: 1 }}>
+                    <View>{this.linkItem('https://www.compdf.com/', 'https://www.compdf.com/')}</View>
+                    <View>{this.linkItem('About ComPDFKit', 'https://www.compdf.com/company/about')}</View>
+                    <View>{this.linkItem('Technical Support', 'https://www.compdf.com/support')}</View>
+                    <View>{this.linkItem('Contact Sales', 'https://www.compdf.com/contact-sales')}</View>
+                    <View>{this.linkItem('support@compdf.com', 'mailto:support@compdf.com?subject=Technical Support')}</View>
+                </View>
+                <View style={styles.copyRightContainer}>
+                    <Text style={styles.copyRightText}>© 2014-2024 PDF Technologies, Inc. All Rights Reserved.</Text>
+                    <View style={{ flexDirection: 'row' }}>
+                        <TouchableOpacity onPress={() => {
+                            Linking.openURL('https://www.compdf.com/privacy-policy')
+                        }}>
+                            <Text style={styles.copyRightText_1}>Privacy Policy</Text>
+                        </TouchableOpacity>
+
+                        <Text style={styles.copyRightText_1}>   |   </Text>
+                        <TouchableOpacity onPress={() => {
+                            Linking.openURL('https://www.compdf.com/terms-of-service')
+                        }}>
+                            <Text style={styles.copyRightText_1}>Terms of Service</Text>
+                        </TouchableOpacity>
+                    </View>
+                </View>
+            </View>
+        );
+    }
+
+    linkItem = (title: string, url: string) => {
+        return (
+            <TouchableOpacity onPress={async () => {
+                const supported = await Linking.canOpenURL(url)
+                if (supported) {
+                    await Linking.openURL(url)
+                } else {
+                    console.log(`Don't know how to open this URL: ${url}`);
+                }
+            }}>
+                <View style={styles.infoItem}>
+                    <Text style={styles.infoItemText}>{title}</Text>
+                    <Image source={require('../../assets/arrow_right.png')} style={{ width: 24, height: 24 }} />
+                </View>
+            </TouchableOpacity>
+        );
+    };
+}
+
+const styles = StyleSheet.create({
+    header: {
+        backgroundColor: '#F2F2F2',
+        paddingVertical: 6,
+        paddingHorizontal: 16
+    },
+    headerText: {
+        fontSize: 12,
+        color: '#42464D'
+    },
+    container: {
+        backgroundColor: '#FFF',
+        flex: 1
+    },
+    infoItem: {
+        paddingHorizontal: 16,
+        height: 56,
+        flexDirection: 'row',
+        alignItems: 'center',
+        justifyContent: 'space-between',
+        borderBottomWidth: 0.5,
+        borderBottomColor: '#0000001A'
+    },
+    infoItemText: {
+        color: '#42464D',
+        fontSize: 14
+    },
+    copyRightContainer: {
+        alignItems: 'center',
+        justifyContent: 'center',
+        paddingBottom: 16
+    },
+    copyRightText: {
+        color: '#42464D',
+        fontSize: 11
+    },
+    copyRightText_1: {
+        fontSize: 11,
+        color: '#1460F3'
+    }
+});
+
+export default SettingScreen;

src/index.tsx

@@ -10,7 +10,6 @@
 import { NativeModules } from 'react-native';
 import { CPDFConfiguration } from './configuration/CPDFConfiguration';
 import { CPDFAlignment, CPDFAnnotationType, CPDFBorderStyle, CPDFCheckStyle, CPDFConfigTool, CPDFContentEditorType, CPDFDisplayMode, CPDFFormType, CPDFLineType,CPDFThemeMode, CPDFThemes, CPDFToolbarAction, CPDFToolbarMenuAction, CPDFTypeface, CPDFViewMode } from './configuration/CPDFOptions';
-import { CPDFReaderView } from './view/CPDFReaderView';
 
 declare module 'react-native' {
   interface NativeModulesStatic {