Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
22 changes: 16 additions & 6 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -25,7 +25,10 @@ So you should install react-native-pdf and rn-fetch-blob
| progress-bar-android | | | | 1.0.3+ |
| progress-view | | | | 1.0.3+ |

Currently, Windows support is partial. The rn-fetch-blob module is not yet available on Windows, only loading bundled PDFs is supported.
Currently, Windows support is partial. For Windows, it's necessary to install `rn-fetch-blob` from the [PR that adds Windows support](https://github.com/joltup/rn-fetch-blob/pull/701):
```
yarn add github:joltup/rn-fetch-blob#pull/701/head
```

### Installation

Expand All @@ -37,6 +40,11 @@ npm install react-native-pdf rn-fetch-blob @react-native-community/progress-bar-
yarn add react-native-pdf rn-fetch-blob @react-native-community/progress-bar-android @react-native-community/progress-view
```

For Windows, it's necessary to install `rn-fetch-blob` from the [PR that adds Windows support](https://github.com/joltup/rn-fetch-blob/pull/701):
```
yarn add github:joltup/rn-fetch-blob#pull/701/head
```

Then follow the instructions for your platform to link react-native-pdf into your project:

### iOS installation
Expand Down Expand Up @@ -96,12 +104,14 @@ react-native link react-native-pdf
- Right-click Solution icon in Solution Explorer > Add > Existing Project...
- Add `node_modules\@react-native-community\progress-view\windows\progress-view\progress-view.vcxproj`
- If running RNW 0.62: add `node_modules\react-native-pdf\windows\RCTPdf\RCTPdf.vcxproj`
- If running RNW 0.62: add `node_modules\rn-fetch-blob\windows\RNFetchBlob\RNFetchBlob.vcxproj`
- Right-click main application project > Add > Reference...
- Select `progress-view` and in Solution Projects
- If running 0.62, also select `RCTPdf`
- If running 0.62, also select `RCTPdf` and `RNFetchBlob`
- In app `pch.h` add `#include "winrt/progress_view.h"` and `#include "winrt/RCTPdf.h"`
- If running 0.62, also select `#include "winrt/RNFetchBlob.h"`
- In `App.cpp` add `PackageProviders().Append(winrt::progress_view::ReactPackageProvider());` before `InitializeComponent();`
- If running RNW 0.62, also add `PackageProviders().Append(winrt::RCTPdf::ReactPackageProvider());`
- If running RNW 0.62, also add `PackageProviders().Append(winrt::RCTPdf::ReactPackageProvider());` and `PackageProviders().Append(winrt::RNFetchBlob::ReactPackageProvider());`

#### Bundling PDFs with the app
To add a `test.pdf` like in the example add:
Expand Down Expand Up @@ -299,7 +309,7 @@ const styles = StyleSheet.create({

| Property | Type | Default | Description | iOS | Android | Windows | FirstRelease |
| ------------- |:-------------:|:----------------:| ------------------- | ------| ------- | ------- | ------------ |
| source | object | not null | PDF source like {uri:xxx, cache:false}. see the following for detail.| ✔ | ✔ | partial | <3.0 |
| source | object | not null | PDF source like {uri:xxx, cache:false}. see the following for detail.| ✔ | ✔ | | <3.0 |
| page | number | 1 | initial page index | ✔ | ✔ | ✔ | <3.0 |
| scale | number | 1.0 | should minScale<=scale<=maxScale| ✔ | ✔ | ✔ | <3.0 |
| minScale | number | 1.0 | min scale| ✔ | ✔ | ✔ | 5.0.5 |
Expand Down Expand Up @@ -340,11 +350,11 @@ const styles = StyleSheet.create({

| Usage | Description | iOS | Android | Windows |
| ------------ | ----------- | --- | ------- | ------- |
| `{uri:"http://xxx/xxx.pdf"}` | load pdf from a url | ✔ | ✔ | |
| `{uri:"http://xxx/xxx.pdf"}` | load pdf from a url | ✔ | ✔ | |
| `{require("./test.pdf")}` | load pdf relate to js file (do not need add by xcode) | ✔ | ✖ | ✖ |
| `{uri:"bundle-assets://path/to/xxx.pdf"}` | load pdf from assets, the file should be at android/app/src/main/assets/path/to/xxx.pdf | ✖ | ✔ | ✖ |
| `{uri:"bundle-assets://xxx.pdf"}` | load pdf from assets, you must add pdf to project by xcode. this does not support folder. | ✔ | ✖ | ✖ |
| `{uri:"data:application/pdf;base64,JVBERi0xLjcKJc..."}` | load pdf from base64 string | ✔ | ✔ | |
| `{uri:"data:application/pdf;base64,JVBERi0xLjcKJc..."}` | load pdf from base64 string | ✔ | ✔ | |
| `{uri:"file:///absolute/path/to/xxx.pdf"}` | load pdf from local file system | ✔ | ✔ | ✔ |
| `{uri:"ms-appx:///xxx.pdf"}}` | load pdf bundled with UWP app | ✖ | ✖ | ✔ |

Expand Down
19 changes: 11 additions & 8 deletions index.js
Original file line number Diff line number Diff line change
Expand Up @@ -21,15 +21,18 @@ import {
import { ProgressBar } from '@react-native-community/progress-bar-android'
import { ProgressView } from '@react-native-community/progress-view'

let RNFetchBlob = {
fs : {
dirs: {
CacheDir: ''
}
}
};
if (Platform.OS !== 'windows') {
let RNFetchBlob;
try {
RNFetchBlob = require('rn-fetch-blob').default;
} catch(e) {
// For Windows, when not using rn-fetch-blob with Windows support.
RNFetchBlob = {
fs : {
dirs: {
CacheDir: ''
}
}
};
}

const SHA1 = require('crypto-js/sha1');
Expand Down
12 changes: 8 additions & 4 deletions windows/RCTPdf/RCTPdfControl.cpp
Original file line number Diff line number Diff line change
Expand Up @@ -68,10 +68,10 @@ namespace winrt::RCTPdf::implementation
double currentRenderScale = renderScale;
return currentRenderScale < imageScale || currentRenderScale > imageScale * m_downscaleTreshold;
}
winrt::IAsyncAction PDFPageInfo::render() {
winrt::Windows::Foundation::IAsyncAction PDFPageInfo::render() {
return render(imageScale);
}
winrt::IAsyncAction PDFPageInfo::render(double useScale) {
winrt::Windows::Foundation::IAsyncAction PDFPageInfo::render(double useScale) {
double currentRenderScale;
while (true) {
currentRenderScale = renderScale;
Expand Down Expand Up @@ -558,10 +558,14 @@ namespace winrt::RCTPdf::implementation

void RCTPdfControl::SetOrientation(bool horizontal) {
m_horizontal = horizontal;
FindName(winrt::to_hstring("OrientationSelector")).try_as<StackPanel>().Orientation(m_horizontal ? Orientation::Horizontal : Orientation::Vertical);
StackPanel orientationSelector;
if (FindName(winrt::to_hstring("OrientationSelector")).try_as<StackPanel>(orientationSelector))
{
orientationSelector.Orientation(m_horizontal ? Orientation::Horizontal : Orientation::Vertical);
}
}

winrt::IAsyncAction RCTPdfControl::RenderVisiblePages(int page) {
winrt::Windows::Foundation::IAsyncAction RCTPdfControl::RenderVisiblePages(int page) {
auto lifetime = get_strong();
auto container = PagesContainer();
auto currentHorizontalOffset = container.HorizontalOffset();
Expand Down
6 changes: 3 additions & 3 deletions windows/RCTPdf/RCTPdfControl.h
Original file line number Diff line number Diff line change
Expand Up @@ -18,8 +18,8 @@ namespace winrt::RCTPdf::implementation
unsigned pageVisiblePixels(bool horizontal, double viewportStart, double viewportEnd) const;
unsigned pageSize(bool horizontal) const;
bool needsRender() const;
winrt::IAsyncAction render();
winrt::IAsyncAction render(double useScale);
winrt::Windows::Foundation::IAsyncAction render();
winrt::Windows::Foundation::IAsyncAction render(double useScale);
unsigned height, width;
unsigned scaledHeight, scaledWidth;
unsigned scaledTopOffset, scaledLeftOffset;
Expand Down Expand Up @@ -96,7 +96,7 @@ namespace winrt::RCTPdf::implementation
void GoToPage(int page);
void Rescale(double newScale, double newMargin, bool goToNewPosition);
void SetOrientation(bool horizontal);
winrt::IAsyncAction RenderVisiblePages(int page);
winrt::Windows::Foundation::IAsyncAction RenderVisiblePages(int page);
void SignalError(const std::string& error);
void SignalLoadComplete(int totalPages, int width, int height);
void SignalPageChange(int page, int totalPages);
Expand Down
10 changes: 6 additions & 4 deletions windows/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -5,12 +5,14 @@ Since the module uses react-native-progress-view, it also needs to be referenced
- Right-click Solution icon in Solution Explorer > Add > Existing Project...
- Add `node_modules\@react-native-community\progress-view\windows\progress-view\progress-view.vcxproj`
- If running RNW 0.62: add `node_modules\react-native-pdf\windows\RCTPdf\RCTPdf.vcxproj`
- If running RNW 0.62: add `node_modules\rn-fetch-blob\windows\RNFetchBlob\RNFetchBlob.vcxproj`
- Right-click main application project > Add > Reference...
- Select `progress-view` and in Solution Projects
- If running 0.62, also select `RCTPdf`
- In app `pch.h` add `#include "winrt/progress-view.h"` and `#include "winrt/RCTPdf.h"`
- In `App.cpp` add `PackageProviders().Append(winrt::progress-view::ReactPackageProvider());` before `InitializeComponent();`
- If running RNW 0.62, also add `PackageProviders().Append(winrt::RCTPdf::ReactPackageProvider());`
- If running 0.62, also select `RCTPdf` and `RNFetchBlob`
- In app `pch.h` add `#include "winrt/progress_view.h"` and `#include "winrt/RCTPdf.h"`
- If running 0.62, also select `#include "winrt/RNFetchBlob.h"`
- In `App.cpp` add `PackageProviders().Append(winrt::progress_view::ReactPackageProvider());` before `InitializeComponent();`
- If running RNW 0.62, also add `PackageProviders().Append(winrt::RCTPdf::ReactPackageProvider());` and `PackageProviders().Append(winrt::RNFetchBlob::ReactPackageProvider());`


## Bundling PDFs with the app
Expand Down