react-native-pdf
react-native-pdf copied to clipboard
wonday
How to disable bouble tap zooming
What react-native version are you using?"react-native": "0.62.2"
What react-native-pdf version are you using? "react-native-pdf": "^6.2.2"
What platform does your issue occur on? (android/ios/both)both
I want to disable double tap zooming
I used this with patch-package previously:
react-native-pdf+6.2.0.patch
diff --git a/node_modules/react-native-pdf/android/src/main/java/org/wonday/pdf/PdfView.java b/node_modules/react-native-pdf/android/src/main/java/org/wonday/pdf/PdfView.java
index 1c44ad3..c82d082 100644
--- a/node_modules/react-native-pdf/android/src/main/java/org/wonday/pdf/PdfView.java
+++ b/node_modules/react-native-pdf/android/src/main/java/org/wonday/pdf/PdfView.java
@@ -54,6 +54,7 @@ import java.lang.ClassCastException;
import com.shockwave.pdfium.PdfDocument;
import com.google.gson.Gson;
import com.google.gson.GsonBuilder;
+import com.shockwave.pdfium.util.SizeF;
public class PdfView extends PDFView implements OnPageChangeListener,OnLoadCompleteListener,OnErrorListener,OnTapListener,OnDrawListener,OnPageScrollListener, LinkHandler {
private ThemedReactContext context;
@@ -68,6 +69,7 @@ public class PdfView extends PDFView implements OnPageChangeListener,OnLoadCompl
private String password = "";
private boolean enableAntialiasing = true;
private boolean enableAnnotationRendering = true;
+ private boolean enableDoubleTapZoom = true;
private boolean enablePaging = false;
private boolean autoSpacing = false;
@@ -106,14 +108,14 @@ public class PdfView extends PDFView implements OnPageChangeListener,OnLoadCompl
@Override
public void loadComplete(int numberOfPages) {
-
- float width = this.getWidth();
- float height = this.getHeight();
+ SizeF pageSize = getPageSize(0);
+ float width = pageSize.getWidth();
+ float height = pageSize.getHeight();
this.zoomTo(this.scale);
WritableMap event = Arguments.createMap();
- //create a new jason Object for the TableofContents
+ //create a new json Object for the TableofContents
Gson gson = new Gson();
event.putString("message", "loadComplete|"+numberOfPages+"|"+width+"|"+height+"|"+gson.toJson(this.getTableOfContents()));
ReactContext reactContext = (ReactContext)this.getContext();
@@ -232,6 +234,7 @@ public class PdfView extends PDFView implements OnPageChangeListener,OnLoadCompl
.spacing(this.spacing)
.password(this.password)
.enableAntialiasing(this.enableAntialiasing)
+ .enableDoubletap(this.enableDoubleTapZoom)
.pageFitPolicy(this.fitPolicy)
.pageSnap(this.pageSnap)
.autoSpacing(this.autoSpacing)
@@ -284,6 +287,10 @@ public class PdfView extends PDFView implements OnPageChangeListener,OnLoadCompl
this.enableAnnotationRendering = enableAnnotationRendering;
}
+ public void setEnableDoubleTapZoom(boolean enableDoubleTapZoom) {
+ this.enableDoubleTapZoom = enableDoubleTapZoom;
+ }
+
public void setEnablePaging(boolean enablePaging) {
this.enablePaging = enablePaging;
if (this.enablePaging) {
diff --git a/node_modules/react-native-pdf/android/src/main/java/org/wonday/pdf/RCTPdfManager.java b/node_modules/react-native-pdf/android/src/main/java/org/wonday/pdf/RCTPdfManager.java
index d89cddc..a1ae169 100644
--- a/node_modules/react-native-pdf/android/src/main/java/org/wonday/pdf/RCTPdfManager.java
+++ b/node_modules/react-native-pdf/android/src/main/java/org/wonday/pdf/RCTPdfManager.java
@@ -16,10 +16,14 @@ import android.util.Log;
import android.graphics.PointF;
import android.net.Uri;
+import androidx.annotation.NonNull;
+import androidx.annotation.Nullable;
+
import com.facebook.react.bridge.NativeModule;
import com.facebook.react.bridge.ReactApplicationContext;
import com.facebook.react.bridge.ReactContext;
import com.facebook.react.bridge.Arguments;
+import com.facebook.react.bridge.ReadableArray;
import com.facebook.react.bridge.WritableMap;
import com.facebook.react.uimanager.SimpleViewManager;
import com.facebook.react.uimanager.ThemedReactContext;
@@ -110,6 +114,11 @@ public class RCTPdfManager extends SimpleViewManager<PdfView> {
pdfView.setEnableAnnotationRendering(enableAnnotationRendering);
}
+ @ReactProp(name = "enableDoubleTapZoom")
+ public void setEnableDoubleTapZoom(PdfView pdfView, boolean enableDoubleTap) {
+ pdfView.setEnableDoubleTapZoom(enableDoubleTap);
+ }
+
@ReactProp(name = "enablePaging")
public void setEnablePaging(PdfView pdfView, boolean enablePaging) {
pdfView.setEnablePaging(enablePaging);
@@ -120,6 +129,14 @@ public class RCTPdfManager extends SimpleViewManager<PdfView> {
pdfView.setFitPolicy(fitPolicy);
}
+ @Override
+ public void receiveCommand(@NonNull PdfView root, String commandId, @Nullable ReadableArray args) {
+ if (args != null && commandId.equals("scrollTo")) {
+ int pageNumber = args.getInt(0);
+ root.jumpTo(pageNumber > 1 ? pageNumber - 1 : 0, true);
+ }
+ }
+
@Override
public void onAfterUpdateTransaction(PdfView pdfView) {
super.onAfterUpdateTransaction(pdfView);
diff --git a/node_modules/react-native-pdf/index.d.ts b/node_modules/react-native-pdf/index.d.ts
index f69f703..eb8237f 100644
--- a/node_modules/react-native-pdf/index.d.ts
+++ b/node_modules/react-native-pdf/index.d.ts
@@ -9,6 +9,13 @@
import * as React from 'react';
import * as ReactNative from 'react-native';
+export type TableContent = {
+ children: TableContent[],
+ mNativePtr: number,
+ pageIdx: number,
+ title: string,
+};
+
interface Props {
style?: ReactNative.StyleProp<ReactNative.ViewStyle>,
source: object,
@@ -25,18 +32,21 @@ interface Props {
enablePaging?: boolean,
enableRTL?: boolean,
enableAnnotationRendering?: boolean,
+ enableDoubleTapZoom?: boolean,
fitPolicy?: number,
trustAllCerts?: boolean,
onLoadProgress?: (percent: number,) => void,
- onLoadComplete?: (numberOfPages: number, path: string) => void,
+ onLoadComplete?: (numberOfPages: number, path: string, size: {height: number, width: number}, tableContents?: TableContent[]) => void,
onPageChanged?: (page: number, numberOfPages: number) => void,
onError?: (error: object) => void,
+ onPageDoubleTap?: () => void,
onPageSingleTap?: (page: number, x: number, y: number) => void,
onScaleChanged?: (scale: number) => void,
onPressLink?: (url: string) => void,
}
declare class Pdf extends React.Component<Props, any> {
+ scrollTo(pageNumber: number): void;
}
export default Pdf;
diff --git a/node_modules/react-native-pdf/index.js b/node_modules/react-native-pdf/index.js
index 82072f4..ff2d318 100644
--- a/node_modules/react-native-pdf/index.js
+++ b/node_modules/react-native-pdf/index.js
@@ -10,9 +10,11 @@
import React, {Component} from 'react';
import PropTypes from 'prop-types';
import {
+ findNodeHandle,
requireNativeComponent,
View,
Platform,
+ UIManager,
ViewPropTypes,
StyleSheet,
Image
@@ -159,6 +161,14 @@ export default class Pdf extends Component {
}
+ scrollTo(pageNumber) {
+ UIManager.dispatchViewManagerCommand(
+ findNodeHandle(this._root),
+ 'scrollTo',
+ [pageNumber]
+ );
+ }
+
_loadFromSource = (newSource) => {
const source = Image.resolveAssetSource(newSource) || {};
@@ -374,6 +384,8 @@ export default class Pdf extends Component {
this._onError(new Error(message[1]));
} else if (message[0] === 'pageSingleTap') {
this.props.onPageSingleTap && this.props.onPageSingleTap(message[1], message[2], message[3]);
+ } else if (message[0] === 'pageDoubleTap') {
+ this.props.onPageDoubleTap && this.props.onPageDoubleTap();
} else if (message[0] === 'scaleChanged') {
this.props.onScaleChanged && this.props.onScaleChanged(message[1]);
} else if (message[0] === 'linkPressed') {
diff --git a/node_modules/react-native-pdf/ios/RCTPdf/RCTPdfView.h b/node_modules/react-native-pdf/ios/RCTPdf/RCTPdfView.h
index 3d4de0d..f713aa1 100644
--- a/node_modules/react-native-pdf/ios/RCTPdf/RCTPdfView.h
+++ b/node_modules/react-native-pdf/ios/RCTPdf/RCTPdfView.h
@@ -31,6 +31,7 @@ NS_CLASS_AVAILABLE_IOS(11_0) @interface RCTPdfView : UIView <UIGestureRecognizer
@property(nonatomic) BOOL enablePaging;
@property(nonatomic) BOOL enableRTL;
@property(nonatomic) BOOL enableAnnotationRendering;
+@property(nonatomic) BOOL enableDoubleTapZoom;
@property(nonatomic) int fitPolicy;
@property(nonatomic) int spacing;
@property(nonatomic, strong) NSString *password;
@@ -38,6 +39,7 @@ NS_CLASS_AVAILABLE_IOS(11_0) @interface RCTPdfView : UIView <UIGestureRecognizer
@property(nonatomic, copy) RCTBubblingEventBlock onChange;
+- (void)scrollTo:(NSInteger)pageNumber;
@end
diff --git a/node_modules/react-native-pdf/ios/RCTPdf/RCTPdfView.m b/node_modules/react-native-pdf/ios/RCTPdf/RCTPdfView.m
index 203d094..f720d65 100644
--- a/node_modules/react-native-pdf/ios/RCTPdf/RCTPdfView.m
+++ b/node_modules/react-native-pdf/ios/RCTPdf/RCTPdfView.m
@@ -60,6 +60,7 @@ - (instancetype)init
_enablePaging = NO;
_enableRTL = NO;
_enableAnnotationRendering = YES;
+ _enableDoubleTapZoom = YES;
_fitPolicy = 2;
_spacing = 10;
@@ -87,6 +88,12 @@ - (instancetype)init
[[_pdfView document] setDelegate: self];
[_pdfView setDelegate: self];
+ // Disable built-in double tap, so as not to conflict with custom recognizers.
+ for (UIGestureRecognizer *recognizer in _pdfView.gestureRecognizers) {
+ if ([recognizer isKindOfClass:[UITapGestureRecognizer class]]) {
+ recognizer.enabled = NO;
+ }
+ }
[self bindTap];
}
@@ -94,6 +101,19 @@ - (instancetype)init
return self;
}
+- (void)scrollTo:(NSInteger)pageNumber {
+ if (_pdfDocument) {
+ PDFPage *pdfPage = [_pdfDocument pageAtIndex:(pageNumber > 1 ? pageNumber - 1 : 0)];
+ if (pdfPage) {
+ dispatch_async(dispatch_get_main_queue(), ^{
+ [UIView animateWithDuration:0.3 animations:^{
+ [self->_pdfView goToPage:pdfPage];
+ }];
+ });
+ }
+ }
+}
+
- (void)PDFViewWillClickOnLink:(PDFView *)sender withURL:(NSURL *)url
{
NSString *_url = url.absoluteString;
@@ -249,7 +262,16 @@ - (void)didSetProps:(NSArray<NSString *> *)changedProps
if (_pdfDocument && ([changedProps containsObject:@"path"] || [changedProps containsObject:@"enablePaging"] || [changedProps containsObject:@"horizontal"] || [changedProps containsObject:@"page"])) {
PDFPage *pdfPage = [_pdfDocument pageAtIndex:_page-1];
- if (pdfPage) {
+ if (pdfPage && _page == 1) {
+ // goToDestination() would be better. However, there is an
+ // error in the pointLeftTop computation that often results in
+ // scrolling to the middle of the page.
+ // Special case workaround to make starting at the first page
+ // align acceptably.
+ dispatch_async(dispatch_get_main_queue(), ^{
+ [self->_pdfView goToRect:CGRectMake(0, NSUIntegerMax, 1, 1) onPage:pdfPage];
+ });
+ } else if (pdfPage) {
CGRect pdfPageRect = [pdfPage boundsForBox:kPDFDisplayBoxCropBox];
// some pdf with rotation, then adjust it
@@ -429,6 +449,18 @@ - (void)onScaleChanged:(NSNotification *)noti
*/
- (void)handleDoubleTap:(UITapGestureRecognizer *)recognizer
{
+ // Prevent double tap from selecting text.
+ dispatch_async(dispatch_get_main_queue(), ^{
+ [self->_pdfView clearSelection];
+ });
+
+ // Event appears to be consumed; broadcast for JS.
+ _onChange(@{ @"message": @"pageDoubleTap" });
+
+ if (!_enableDoubleTapZoom) {
+ return;
+ }
+
// Cycle through min/mid/max scale factors to be consistent with Android
float min = self->_pdfView.minScaleFactor/self->_fixScaleFactor;
float max = self->_pdfView.maxScaleFactor/self->_fixScaleFactor;
diff --git a/node_modules/react-native-pdf/ios/RCTPdf/RCTPdfViewManager.m b/node_modules/react-native-pdf/ios/RCTPdf/RCTPdfViewManager.m
index e49b171..df0c5f0 100644
--- a/node_modules/react-native-pdf/ios/RCTPdf/RCTPdfViewManager.m
+++ b/node_modules/react-native-pdf/ios/RCTPdf/RCTPdfViewManager.m
@@ -7,6 +7,7 @@
*/
#import <Foundation/Foundation.h>
+#import <React/RCTUIManager.h>
#import "RCTPdfViewManager.h"
#import "RCTPdfView.h"
@@ -36,11 +37,23 @@ - (UIView *)view
RCT_EXPORT_VIEW_PROPERTY(enablePaging, BOOL);
RCT_EXPORT_VIEW_PROPERTY(enableRTL, BOOL);
RCT_EXPORT_VIEW_PROPERTY(enableAnnotationRendering, BOOL);
+RCT_EXPORT_VIEW_PROPERTY(enableDoubleTapZoom, BOOL);
RCT_EXPORT_VIEW_PROPERTY(fitPolicy, int);
RCT_EXPORT_VIEW_PROPERTY(spacing, int);
RCT_EXPORT_VIEW_PROPERTY(password, NSString);
RCT_EXPORT_VIEW_PROPERTY(onChange, RCTBubblingEventBlock);
+RCT_EXPORT_METHOD(scrollTo:(nonnull NSNumber *)reactTag pageNumber:(nonnull NSNumber *)pageNumber) {
+ [self.bridge.uiManager addUIBlock:^(RCTUIManager *uiManager, NSDictionary<NSNumber *,UIView *> *viewRegistry) {
+ RCTPdfView *view = (RCTPdfView *)viewRegistry[reactTag];
+ if (!view || ![view isKindOfClass:[RCTPdfView class]]) {
+ RCTLogError(@"Cannot find RCTPdfView with tag #%@", reactTag);
+ return;
+ }
+ [view scrollTo:pageNumber.integerValue];
+ }];
+}
+
RCT_EXPORT_METHOD(supportPDFKit:(RCTResponseSenderBlock)callback)
{
if([[[UIDevice currentDevice] systemVersion] compare:@"11.0" options:NSNumericSearch] == NSOrderedDescending
It is not perfect, but worked okay. Uncertain the patch still works; I switched away from using this library.
