Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Styles do not apply for iOS #98

Open
CooperLaredo opened this issue Apr 12, 2019 · 1 comment
Open

Styles do not apply for iOS #98

CooperLaredo opened this issue Apr 12, 2019 · 1 comment

Comments

@CooperLaredo
Copy link

I followed along with the example in the documentation and I can't seem to get the styles to show up in the Print Preview for iOS.

-Since it's iOS, I set cssFile to www/styles.bundle.css
-Content is just the innerHTML of the page I'm trying to make a pdf of.

I'm not sure if cssFile is set to the correct path because the pdf looks completely unformatted
except for a couple colors from inline styles.
Any help would be appreciated!

createPDF(cssFile, content) {
    const opts = {
        documentSize: "A4",
        landscape: "portrait",
        type: "share",
        fileName: 'my-pdf.pdf'
    };

    const payload = _.template('<head><link rel="stylesheet" href="<%=css_file%>"></style></head><body><%=content%></body>');

    cordova.plugins.pdf.fromData(payload({ css_file: cssFile, content: content }),
        opts)
        .then()
        .catch();
}
@cesarvr
Copy link
Owner

cesarvr commented Apr 13, 2019

Assuming that file is in the FileSystem then, in iOS you'll need to use the cordova-plugin-file, example:

if (cordova.platformId === 'ios') {
        
        // this function is from the cordova-plugin-file...
        window.resolveLocalFileSystemURL(cordova.file.applicationDirectory,
            function(url) {
               //url represents the asset folder www/

              // generate your template   
             let tmpl = payload({ css_file: url + '/' +cssFile, content: content })

             // generate PDF
             pdf.fromData(payload, opts).then(/.../)
           },
            function(err) {
                console.log('error', err, '  args ->', arguments)
            }
        );

Working example...

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants