Kendo.mobile export to PDF

9 posts, 0 answers
  1. David
    David avatar
    8 posts
    Member since:
    Jun 2013

    Posted 02 Jul 2015 Link to this post

    Is export to PDF compatible for mobile?  I have been trying to use kendo.drawing but it is not working.
  2. Tina Stancheva
    Admin
    Tina Stancheva avatar
    3298 posts

    Posted 07 Jul 2015 Link to this post

    Hello David,

    If you are reviewing the Kendo UI Grid/Scheduler/Chart widgets export to PDF, then this functionality will not work out-of-the-box in a hybrid Cordova-based application. However, the Kendo Drawing API should help you capture the content of your view and save it in a pdf document. You can use the Cordova File API to write the data in a file and save it on the device's storage. I attached a sample project that demonstrates how to 'draw' the contents of a Kendo UI view - in this case a Kendo UI Grid widget, in a pdf document. The project demonstrates how to save the pdf document on the device and then open it in InAppBrowser

    Regards,
    Tina Stancheva
    Telerik
     

    Visit the Telerik Verified Plugins Marketplace and get the custom Cordova plugin you need, already tweaked to work seamlessly with AppBuilder.

     
  3. Nicola
    Nicola avatar
    15 posts
    Member since:
    Feb 2014

    Posted 27 Oct 2015 in reply to Tina Stancheva Link to this post

    Hello Tina,

    I tried your solution and it works very well.
    Just one question: how can I use different fonts ?
    I loaded the file .ttf in the folder 'styles/font' of the application. (I need offline behavior, I can't specify online url)
    I placed the call kendo.pdf.defineFont (...) , but I'm not able to specify a valid path. 
    I tried with a relative one, an absolute path with http, an absolute one with 'file:// ' (from view's location.href) . etc .. 
    For each call I always get the error "Can not load font from ...". What is the correct way to specify the font's path ?

  4. Tsvetina
    Admin
    Tsvetina avatar
    1876 posts

    Posted 30 Oct 2015 Link to this post

    Hello Nicola,

    Usually, a relative path, should work when linking the ttf files. If the issue persists, please open a support ticket and send us a project where we can reproduce and debug the problem.

    Regards,
    Tsvetina
    Telerik
     

    Visit the Telerik Verified Plugins Marketplace and get the custom Cordova plugin you need, already tweaked to work seamlessly with AppBuilder.

     
  5. Nicola
    Nicola avatar
    15 posts
    Member since:
    Feb 2014

    Posted 02 Nov 2015 in reply to Tsvetina Link to this post

    Hello Tsvetina,
    you are right. I had an old release of Kendo UI. With the new one is all right.
    Thanks
    Best Regards

    Nicola  

  6. Michele
    Michele avatar
    3 posts
    Member since:
    Feb 2015

    Posted 03 Feb in reply to Tsvetina Link to this post

    Hello Tsvetina,

    I've a problem exporting PDF with custom fonts. I tried using kendo.pdf.defineFont like this:

    kendo.pdf.defineFont({
       "RobotoStamp"     : "kendo/fonts/Roboto/RobotoCondensed-Regular.ttf",
       "RobotoStamp|Bold": "kendo/fonts/Roboto/RobotoCondensed-Bold.ttf"           
    })

    but it gives the following error, on the simulator and on the device: 

    Uncaught Error: Cannot load font from kendo/fonts/Roboto/RobotoCondensed-Regular.ttf" at file: kendo/js/kendo.all.min.

    It doesn't work also if I use the absolute path to the font; it seems that this function tries to find the files without using the base path.

     

    If I don't specify the font-family in the css rule of the page to export, it tries to find automatically the dejavu font but it doesn't find it on the device (on the simulator it works), also if the ttf files are in the correct place:

    "Uncaught Error: Cannot load font from file:///data/....../kendo/styles/fonts/DejaVu/DejaVuSans.ttf?v=1.1"

     

    I tried to define the custom font in the css file using @font-face and then giving the same font-family to the the style of to the div to export, but it can't find it and gives the same error (on the simulator it works correctly) :

    "Uncaught Error: Cannot load font from file:///data/..../styles/fonts/Roboto/RobotoCondensed-Regular.ttf"

     

    Last try: Giving an inexistent font-family to the page to export in the css rule, ( es. font-family:'' ) it works without giving any error and it uses a standard font.

     

    Recap:

    1. The function kendo.pdf.defineFont never works, neither on the device nor on the simulator.
    2. Defining the custom ttf font using @font-face doesn't work on the device, but works on the simulator.
    3. Defining an inexistent font-family on the div style to export, works using a standard serif font.
    4. Not defining any font-family attribute on the div style, doesn't work on the device, because it tries to find the DejaVu Sans font.
    5. The DejaVu Sans font is correctly found on the simulator, but not on the device.

     

    Can you help me?

    Thanks.

    Michele

  7. Tsvetina
    Admin
    Tsvetina avatar
    1876 posts

    Posted 08 Feb Link to this post

    Hello Michele,

    Declaring the custom fonts using @font-face should work if you load your font from a web location:
    @font-face {
      font-family: "RobotoStamp";
      src: url("http://linkToFont") format("truetype");
    }


    Regards,
    Tsvetina
    Telerik
     

    Visit the Telerik Verified Plugins Marketplace and get the custom Cordova plugin you need, already tweaked to work seamlessly with AppBuilder.

     
  8. Michele
    Michele avatar
    3 posts
    Member since:
    Feb 2015

    Posted 09 Feb in reply to Tsvetina Link to this post

    Hello Tsvetina,

    thank you for answering me. The problem is that my app must work offline so I've to put my fonts in the app's folders ( for example in kendo/style/fonts ) or in the device's local storage.

    In this way the export works on the AppBuilder's simulator, but not on my Android devices.

    Infact, if I give to my div style, a font-family that is located in my style folders, it tries not to find that font, but tries to find the Dejavu Sans, without success. The same happens if I not give any font-family attribute to my div style.

    The PDF export works correctly only if I give an inexistent font-family: in this way, I can see on the exported PDF, that it uses a standard serif font.

    That problem occurs only in the exporting of PDF, infact I can see correctly my fonts in the app views; so I think that maybe it can be a kendo bug, or maybe it's managed only for working online, using fonts from web locations.

    Regards,
    Michele

  9. Tsvetina
    Admin
    Tsvetina avatar
    1876 posts

    Posted 12 Feb Link to this post

    Hi Michele,

    I checked again with the Kendo UI team and indeed the font files should be loaded via a web server. In a web site (where the export feature has been designed for), this is usually the same web server where the source code is hosted and this isn't a problem but in a Cordova app this comes as a limitation.

    You can browse around for other PDF export libraries specifically designed for Cordova if working offline is a must. There is a post here that could be useful. 

    Regards,
    Tsvetina
    Telerik
     

    Visit the Telerik Verified Plugins Marketplace and get the custom Cordova plugin you need, already tweaked to work seamlessly with AppBuilder.

     
Back to Top