Aumenta le dimensioni dell'intestazione pdfMake

Question

Sto cercando di aumentare le dimensioni dell'intestazione su un pdf utilizzando pdfmake.

Attualmente sono in grado di ottenere un'intestazione sia a sinistra che a destra della pagina, che è quello che voglio, ma quando l'altezza passa 26, l'immagine scompare perché c'è una quantità limitata di spazio per l'intestazione.

• Il margine può essere diminuito per aumentare la dimensione ma voglio rimanere il margine .
• Ho cercato pdfMake github per problemi simili senza successo.

Se hai bisogno di testare qualsiasi cosa, provare il codice che ho finora su pdfmake playground

Tenete a mente è necessario copiare e incollare tutto questo codice sul "parco giochi" per farlo funzionare.

var dd = { 
    pageSize: 'LEGAL', 
    pageOrientation: 'landscape', 
    header: { 
    margin: 8, 
    columns: [{ 
     table: { 
     widths: ['50%', '50%'], 
     body: [ 
      [{ 
      image: 'sampleImage.jpg', 
      width: 80, 
      height: 26, 
      }, { 
      image: 'sampleImage.jpg', 
      width: 80, 
      height: 26, 
      alignment: 'right' 
      }] 
     ] 
     }, 
     layout: 'noBorders' 
    }] 
    }, 
    content: [ 
    'First paragraph', 
    'Another paragraph, this time a little bit longer to make sure, this line will be divided into at least two lines' 
    ] 
} 

Answer 1

È necessario aggiungere una paginaMargins e regolare il secondo parametro (margine superiore) sulla dimensione totale dell'intestazione. Puoi provare i valori finché non viene visualizzato tutto il contenuto dell'intestazione.

Ad esempio:

In questo caso, io uso 80 (pageMargin: [40, 80 , 40,60]) per ottenere l'immagine con altezza 60

var dd = { 

    pageSize: 'LEGAL', 
    pageOrientation: 'landscape', 
    pageMargins: [40, 80, 40, 60], 

    header: { 
     margin: 8, 
     columns: [ 
      { 
       table: { 
        widths: [ '50%','50%'], 

        body: [ 
         [ 
          { image: 'sampleImage.jpg', 

           width: 80, height: 60, 

          }, 

          { image: 'sampleImage.jpg', 

           width: 80, height: 60, 
           alignment:'right'} 
         ] 
        ] 
       }, 
       layout: 'noBorders' 
      } 

     ] 
    }, 

    content: [ 
     'First paragraph', 
     'Another paragraph, this time a little bit longer to make sure, this line will be divided into at least two lines' 
    ] 
} 

Answer 2

La risposta accettata per questo è buono, ma ho pensato che da quando ho trovato uno credo che potrebbe funzionare meglio per gli altri, soprattutto se la lunghezza del contenuto dell'intestazione può variare, vorrei condividere.

Le tabelle in pdfmake hanno una funzionalità elegante in cui le righe di intestazione vengono ripetute su ciascuna pagina della tabella. Quindi, puoi creare una tabella che avvolge l'intero documento e aggiungere tutte le righe di intestazione che desideri e saranno appiccicose in tutte le pagine. Ecco un esempio doc def.

var docDefinition = { 

    pageSize : 'LETTER', 
    pageMargins : [25, 25, 25, 35], 

    defaultStyle : { 
    fontSize : 12, 
    columnGap : 20 
    }, 

    // Page Layout 

    content : { 

    // This table will contain ALL content 
    table : { 
     // Defining the top 2 rows as the "sticky" header rows 
     headerRows: 2, 
     // One column, full width 
     widths: ['*'], 
     body: [ 


     // Header Row One 
     // An array with just one "cell" 
     [ 
      // Just because I only have one cell, doesn't mean I can't have 
      // multiple columns! 
      { 
      columns : [ 
       { 
       width : '*', 
       text  : 'Delivery Company, Inc.', 
       fontSize : 12, 
       bold  : true 
       }, 
       { 
       width  : '*', 
       text  : [ 
        { text: 'Delivery Slip\n', fontSize: 12 }, 
        { text: 'Date ', bold: true }, 
        '2/16/2015 ', 
        { text: 'Arrived ', bold: true }, 
        '11:05 AM ', 
        { text: 'Left ', bold: true }, 
        '11:21 AM' 
       ], 
       fontSize : 10, 
       alignment : 'right' 
       } 
      ] 
      } 
     ], 


     // Second Header Row 

     [ 
      { 
      columns: [ 
       { 
       width: 'auto', 
       margin: [0,0,10,0], 
       text: [ 
        { text: 'CUSTOMER\n', fontSize: 8, bold: true, color: '#bbbbbb' }, 
        { text: 'John Doe', fontSize: 12 } 
       ] 
       }, 
       { 
       width: 'auto', 
       margin: [0,0,10,0], 
       text: [ 
        { text: 'INVOICE #\n', fontSize: 8, bold: true, color: '#bbbbbb' }, 
        { text: '123456', fontSize: 12 } 
       ] 
       } 
      ] 
      } 
     ], 

     // Now you can break your content out into the remaining rows. 
     // Or you could have one row with one cell that contains 
     // all of your content 

     // Content Row(s) 

     [{ 
      fontSize: 10, 
      stack: [ 

      // Content 

      { text:'this is content', pageBreak: 'after' }, 
      { text:'this is more content', pageBreak: 'after' }, 
      { text:'this is third page content' } 
      ] 
     }], 

     [{ 
      fontSize: 10, 
      stack: [ 

      // Content 

      { text:'this is content', pageBreak: 'after' }, 
      { text:'this is more content', pageBreak: 'after' }, 
      { text:'this is third page content' } 
      ] 
     }] 


     ] 
    }, 


    // Table Styles 

    layout: { 
     hLineWidth: function(i, node) { return (i === 1 || i === 2) ? 1 : 0; }, 
     vLineWidth: function(i, node) { return 0; }, 
     hLineColor: function(i, node) { return (i === 1 || i === 2) ? '#eeeeee' : 'white'; }, 
     vLineColor: function(i, node) { return 'white' }, 
     paddingBottom: function(i, node) { 
     switch (i) { 
      case 0: 
      return 5; 
      case 1: 
      return 2; 
      default: 
      return 0; 
     } 
     }, 
     paddingTop: function(i, node) { 
     switch (i) { 
      case 0: 
      return 0; 
      case 1: 
      return 2; 
      default: 
      return 10; 
     } 
     } 
    } 
    }, 


    // Page Footer 

    footer : function(currentPage, pageCount) { 
    return { 
     alignment : 'center', 
     text  : currentPage.toString() + ' of ' + pageCount, 
     fontSize : 8 
    } 
    }, 

};