0.5.6 • Published 6 years ago
react-native-html-to-pdf-custom v0.5.6
react-native-html-to-pdf-custom
Convert html strings to PDF documents using React Native
Installation
- Run
npm install react-native-html-to-pdf-custom --save
Option 1: Automatic
- Run
react-native link
Option 2: Manual
iOS
- Open your project in XCode, right click on Libraries and select Add Files to "Your Project Name.
- Add
libRNHTMLtoPDF.a
toBuild Phases -> Link Binary With Libraries
(Screenshot).
Android
The android module pulls in iText to convert html to pdf. A license is required for commercial use.
- Edit
android/settings.gradle
to included
include ':react-native-html-to-pdf-custom'
project(':react-native-html-to-pdf-custom').projectDir = new File(rootProject.projectDir,'../node_modules/react-native-html-to-pdf-custom/android')
- Edit
android/app/build.gradle
file to include
dependencies {
....
compile project(':react-native-html-to-pdf-custom')
}
- Edit
MainApplication.java
to include
// import the package
import com.christopherdro.htmltopdf.RNHTMLtoPDFPackage;
// include package
new MainReactPackage(),
new RNHTMLtoPDFPackage()
Usage
import React, { Component } from 'react';
import {
Text,
TouchableHighlight,
View,
} = from 'react-native';
import {RNHTMLtoPDF} from 'react-native-html-to-pdf-custom';
class Example extends Component {
async createPDF() {
let options = {
html: '<h1>PDF TEST</h1>',
fileName: 'test',
directory: 'docs',
page: {
size: page.size.UsLetter,
orientation: page.orientation.Landscape,
},
};
let file = await RNHTMLtoPDF.convert(options)
console.log(file.filePath);
},
render() {
<View>
<TouchableHighlight onPress={this.createPDF}>
<Text>Create PDF</Text>
</TouchableHighlight>
</View>
}
}
Options
Param | Type | Default | Note |
---|---|---|---|
html | string | HTML string to be converted | |
fileName | string | Random | Custom Filename excluding .pdf extension |
base64 | boolean | false | return base64 string of pdf file (not recommended) |
iOS Only
Param | Type | Default | Note |
---|---|---|---|
height | number | 612 | Set document height points to US Letter, Landscape |
width | number | 792 | Set document width points to US Letter, Landscape |
padding | number | 10 | Outer padding (points) |
Android Only
Param | Type | Default | Note |
---|---|---|---|
fonts | Array | Allow custom fonts ['/fonts/TimesNewRoman.ttf', '/fonts/Verdana.ttf'] |
Options: page
Param | Type | Default | Note |
---|---|---|---|
orientation | string | Portrait | Landscape, Portrait |
size | string | UsLetter | A0 - A8, UsGovernmentLetter, UsLetter, UsLegal |
Images
<img src="https://www.pexels.com/photo/cat-animal-pet-9673/" />
Android Assets
<img src="file:///android_asset/images/clientLogo.png" />