Height of PDF seems to now be required in 2.0 version

[pursuitofepic]

I'm upgrading my project to nativescript 3.0 and this to 2.0 and now my PDFView requires a height. So if I include in my CSS:

PDFView{
height: 600;
}

Then I see 600 pixels of the PDF viewer. If I leave that out, I see nothing. The on load function still fires, but it's not visible with no height. In the previous version, if I didn't set a height, it took the maximum space it could take, filling the screen. Is there any way to get it to fill the page again (regardless of screen size)?

Note that it technically will work if I just put in a very large height value, but that seems like a hack.

[Merott]

What layout system are you using? Could you share your template please?

Also, is this for iOS or Android, or both?

[pursuitofepic]

It's for ios. I'm using Angular. Here is my whole component file:

import { Component, ElementRef, ViewChild, OnInit } from "@angular/core";
import { Router } from "@angular/router";
import * as SocialShare from "nativescript-social-share";
import * as appSettings from "application-settings";

import { PDFView } from 'nativescript-pdf-view';
import { registerElement } from 'nativescript-angular';
registerElement('PDFView', () => PDFView);

@Component({
  selector: "pdf",
  template: `
  <StackLayout>
  <ActionBar title="View PDF">
    <ActionItem  text="Share" (tap)="share()" android.systemIcon="ic_menu_share_holo_dark" ios.systemIcon="9" ios.position="right"></ActionItem>
  </ActionBar>
    <Label textWrap="true" class="pdf-header" text="{{title}}" col="0"></Label>
    <ActivityIndicator [busy]="isLoading" [visibility]="isLoading ? 'visible' : 'collapse'" row="1" horizontalAlignment="center" verticalAlignment="center"></ActivityIndicator>
    <PDFView src="{{src}}" (load)="onLoad()" ></PDFView>
  </StackLayout>
  `,
  styles: [`
    .pdf-header{
      font-size:18;
      text-align:center;
    }
    PDFView{
      height: 10000;
    }
    `],
  providers: []
})
export class PDFComponent implements OnInit{
  isLoading = true;
  src = '';
  title = '';

  ngOnInit(){
    let token = appSettings.getString("userToken");
    if (!token || token == ''){
      this.router.navigate(["/login"]);
    }
    this.src = appSettings.getString("pdfSource", "");
    this.title = appSettings.getString("pdfTitle", "");
    console.log(this.src);
    console.log(this.title);
  }

  constructor(private router: Router) {
  }

  onLoad(){
    console.log("loaded!");
    this.isLoading = false;
  }

  share() {
    SocialShare.shareText(this.src);
  }

}

I have set the height to 10000 to get it to work, but if I remove that, it doesn't show up. I'm using the 2.0.1 version of the plugin.

[wiedikerli]

would i be possible to return the pdf height in the onLoad event? So after the pdf is loaded we can set the height.

@pursuitofepic have you found a solution without adding random height? For me 10000 is way to much... alot of white...

[nitish1986]

@ninjaonsafari Did you get any solution to PDF height? I am facing the same problem.

[wiedikerli]

@nitish1986 nope, we didnt use this plugin further.

[nitish1986]

@ninjaonsafari Any other plugin, if you can suggest.

[alex-bradley-vqd]

@pursuitofepic I've been banging my head against my desk for weeks trying to get this plugin working. Thank you so much for raising this ticket, you've saved me a trip to the insane asylum.