You have to create function for it and construct data by pushing in array with html's table tag "tr" and "td" and store it into state variable and then can pass that state into html content..
How did you get the html code of that pdf file? I mean I need to do something similar, but with a different pdf document. The problem is that I dont know how to convert it into html.
I didn't convert pdf into html, I just get that html code from internet and used here, you can also google it and find html code as per your requirement and create pdf 😎.
You can check html design on web, You'll get designs(template) as per your requirement, or HTML is very simple markup language so you can easily customize any design according to your need.
@@vishalpwr I don't think this really answers the question as their is no way to say "I want the same footer on every page". Did anyone find a solution yet ?
@@vishalpwr So it is saving the file in the com folder. from the app which is in android\data\media\com.myapp, I need it to save the file in storage/emulated/0/myapp
Instead of 'Download' you can use other dir like 'Documents' , or try with other dir also like 'pdf'. (this is working in real device) if it is not work then may be you need to do search on the internet/stackoverflow or may be need legacy support in android.
in this video when you export pdf it is stored in/storage/emulated/0/Download/---.pdf and I followed same procedure but the file is storing in root directory of the application i.e. /storage/emulated/0/Android/data/com.mypackage/files/Download/---.pdf Any idea what to do about this?? or plz update all package and check if your app is still working fine
Make sure you have used functional component as shown in tutorial, or you can checkout the repo(link in the description) checkout this if used class component-> stackoverflow.com/questions/38481857/getting-cannot-call-a-class-as-a-function-in-my-react-project
Expo doesn't support linking, so you can't use this package in expo, you can try expo print for this 👇 docs.expo.dev/versions/latest/sdk/print/#printprinttofileasyncoptions
Please check in AndroidManifest.xml permissions, and also allow the permission from app, and let me know specific error you getting, also check the package doc maybe you missed something
i got [TypeError: Cannot read property 'startsWith' of undefined] when opening file path. I'm using TypeScript and paste all your code to my project. let file = await RNHTMLtoPDF.convert(Options) Alert.alert('Thông báo','Xuất file PDF thành công:' + file.filePath,[ {text:'Cancel',style:'cancel'}, {text:'Open',onPress:()=>openFile(file.filepath)} ],{cancelable:true}); } const openFile = (filepath: any) => { const path = filepath; FileViewer.open(path) .then(()=>{ //success console.log(`Successfully export PDF file`);
![ประสบการณ์ จ้าง Developer ที่ผมจะไม่มีวันลืม [ภาค2]](http://i.ytimg.com/vi/pZbsSDRrmXA/mqdefault.jpg)
cool
thanks man! your video helped me alot ❤
Thank you! Your video helped me a lot
Glad it helped!!
congratulations thank you
does anyone has a problem saying possible unhandled promise rejection? please help
How to use state data in this, data being an array iterating over it and making dynamic table ?
You have to create function for it and construct data by pushing in array with html's table tag "tr" and "td" and store it into state variable and then can pass that state into html content..
checkout this th-cam.com/video/fnwiIWUlo8U/w-d-xo.html
I have created dynamic table in html then created pdf, it will help you.
@@vishalpwr thanks 👍
Bro how to add network images and local images?.
When I add network images it doesn't appear.
You have to use HTML tags for that!
@@vishalpwr I already used HTML tags bro. But it didn't show atleast it's space.
But i did with expo. Can I?
iOS how to show header and footer on all the pages
How did you get the html code of that pdf file? I mean I need to do something similar, but with a different pdf document. The problem is that I dont know how to convert it into html.
I didn't convert pdf into html, I just get that html code from internet and used here, you can also google it and find html code as per your requirement and create pdf 😎.
Hi, I'm desperately looking to create Header/Footer in each pages in my pdf. Do you know a solution ? Thanks !
You can check html design on web, You'll get designs(template) as per your requirement, or HTML is very simple markup language so you can easily customize any design according to your need.
@@vishalpwr I don't think this really answers the question as their is no way to say "I want the same footer on every page". Did anyone find a solution yet ?
Could you generate a pdf but with data extracted from the database? I would love for you to show an example greetings from Mexico
Okay, I will try.
Please like share and subscribe.
Checkout Expo Example: th-cam.com/video/fnwiIWUlo8U/w-d-xo.html
Source Code: github.com/vishalpwr/Expo-App
Could I have htmlContent code please?
it's on repo you can download/copy it. or if your requirement is different then you can just search on google for it.
How do I save the file in a specific folder on my device, it is saving in the com. from the app that is there in android\data\media\com.myapp ?
You can set {directory: 'Download',} name
but in some device it may not be work then it is stored in default dir.
@@vishalpwr So it is saving the file in the com folder. from the app which is in android\data\media\com.myapp, I need it to save the file in storage/emulated/0/myapp
Instead of 'Download' you can use other dir like 'Documents' ,
or try with other dir also like 'pdf'. (this is working in real device)
if it is not work then may be you need to do search on the internet/stackoverflow or may be need legacy support in android.
in this video when you export pdf it is stored in/storage/emulated/0/Download/---.pdf and I followed same procedure but the file is storing in root directory of the application i.e. /storage/emulated/0/Android/data/com.mypackage/files/Download/---.pdf
Any idea what to do about this?? or plz update all package and check if your app is still working fine
Hello Sujay,
Did you ever solve this issue and how did you do it please?
@@ikennaudokporo6061 I used react native print and saved it as pdf, this way you can save it in downloads
Please how can create multiple pages inside the pdf library is very adjust.
It's totally depends on your HTML content.
hello, I have followed the same but getting error like ' Cannot call a class as a function' can you please help
Make sure you have used functional component as shown in tutorial, or you can checkout the repo(link in the description)
checkout this if used class component->
stackoverflow.com/questions/38481857/getting-cannot-call-a-class-as-a-function-in-my-react-project
I did same like what you did but for me pdf is not downloading it only showing the file path
It is also depends on OS version and permissions please check and provide necessary permission.
why if I use it in the expo can't ?
Expo doesn't support linking, so you can't use this package in expo,
you can try expo print for this 👇
docs.expo.dev/versions/latest/sdk/print/#printprinttofileasyncoptions
@@vishalpwr u can give me the tutorial for this ?
Okay, I will try 😇.
@@vishalpwr thank you brother , i'll wait
check out this: th-cam.com/video/fnwiIWUlo8U/w-d-xo.html
Create Pdf in expo.
is there's more permission code? coz I just followed your steps but mine don't work in Android..:(
Please check in AndroidManifest.xml permissions, and also allow the permission from app, and let me know specific error you getting, also check the package doc maybe you missed something
i got [TypeError: Cannot read property 'startsWith' of undefined] when opening file path. I'm using TypeScript and paste all your code to my project.
let file = await RNHTMLtoPDF.convert(Options)
Alert.alert('Thông báo','Xuất file PDF thành công:' + file.filePath,[
{text:'Cancel',style:'cancel'},
{text:'Open',onPress:()=>openFile(file.filepath)}
],{cancelable:true});
}
const openFile = (filepath: any) => {
const path = filepath;
FileViewer.open(path)
.then(()=>{
//success
console.log(`Successfully export PDF file`);
})
.catch(error => {
console.log(error);
});
}
What do i do to make this pdf file shareable too?
You can use React Native share module for that and share exported pdf uri(path).
@@vishalpwr thanks ❤️👍
I am getting permission error
What error you getting?
@@vishalpwr like it's not going to create pdf function. Error is please give external write permission. I copied the exact code
have you added permission in android AndroidManifest.xml file?
If not then copy permissions from repo, get link in description.
@@vishalpwr yes I have added the permission
Have you given access from your device to the app to use external storage?
getting error "Possible Unhandled Promise Rejection (id: 6):
ReferenceError: Can't find variable: RNHTMLtoPDF
_callee$" help any solution?
Please check that dependency installed successfully or not.
also check you imported RNHTMLtoPDF with the same name in your component.