TCPDF tam sayfa tablosu

11

Tabloyu resimde gösterildiği gibi sayfaya (A4) sığdırmak için birçok yol denedim: resim açıklamasını buraya girin Çok aradım ama web'de yararlı bir şey bulamadım. Dinamik tablo kullanıyorum, tablonun genişliği hariç her şey yolunda. İşte benim kod:

$content = '<table><thead><tr><th class="bg-dark text-white" align="center">#</th><th align="center" class="bg-dark text-white">Code</th><th align="left" class="bg-dark text-white">Description</th><th align="center" class="bg-dark text-white">Item Type</th></tr></thead><tbody><tr style="background-color: #f2f2f2;"><td align="center">1</td><td align="center">1001</td><td align="left">Pofak</td><td align="center">Fixed Price</td></tr><tr ><td align="center">2</td><td align="center">1002</td><td align="left">Ice</td><td align="center">Weight</td></tr><tr style="background-color: #f2f2f2;"><td align="center">3</td><td align="center">1003</td><td align="left">Minoo</td><td align="center">Fixed Price</td></tr><tr ><td align="center">4</td><td align="center">1004</td><td align="left">Bastani</td><td align="center">Fixed Price</td></tr><tr style="background-color: #f2f2f2;"><td align="center">5</td><td align="center">1005</td><td align="left">Chocolate</td><td align="center">Weight</td></tr><tr ><td align="center">6</td><td align="center">1006</td><td align="left">Brush</td><td align="center">Fixed Price</td></tr><tr style="background-color: #f2f2f2;"><td align="center">7</td><td align="center">1007</td><td align="left">Apple</td><td align="center">Weight</td></tr><tr ><td align="center">8</td><td align="center">1008</td><td align="left">Water</td><td align="center">Fixed Price</td></tr><tr style="background-color: #f2f2f2;"><td align="center">9</td><td align="center">1009</td><td align="left">Cleaner</td><td align="center">Fixed Price</td></tr><tr ><td align="center">10</td><td align="center">1001</td><td align="left">Pofak</td><td align="center">Fixed Price</td></tr><tr style="background-color: #f2f2f2;"><td align="center">11</td><td align="center">1002</td><td align="left">Ice</td><td align="center">Weight</td></tr><tr ><td align="center">12</td><td align="center">1003</td><td align="left">Minoo</td><td align="center">Fixed Price</td></tr><tr style="background-color: #f2f2f2;"><td align="center">13</td><td align="center">1004</td><td align="left">Bastani</td><td align="center">Fixed Price</td></tr><tr ><td align="center">14</td><td align="center">1005</td><td align="left">Chocolate</td><td align="center">Weight</td></tr><tr style="background-color: #f2f2f2;"><td align="center">15</td><td align="center">1006</td><td align="left">Brush</td><td align="center">Fixed Price</td></tr></tbody></table>';
$newContent = '
    <style type="text/css">
    table{width:100%;}
    table, table td, table th{
        border-collapse: collapse;
        border: solid 1px #ababab;
    }
    .text-dark, table td{
        color: #343a40;
    }
    .text-white{
        color: #ffffff;
    }
    table td,
    table th {
        font-size: 11px;
        padding: 3px;
        line-height: 1.2;
        font-family:arial;
    }

    .bg-dark {
        background-color: #343a40;
    }
    .bg-secondary {
        background-color: #6c757d;
    }
    .bg-white {
        background-color: #ffffff;
    }
    .text-left {
        text-align: left;
    }
    .text-right {
        text-align: right;
    }
    .text-center {
        text-align: center;
    }
    </style>
    ';
    $newContent .= '<page>'.$content.'</page>';

    try {
        $html2pdf = new Html2Pdf('P', 'A4', 'en', true, 'UTF-8', 5);
        $html2pdf->pdf->SetDisplayMode('real');
        $html2pdf->writeHTML($newContent);
        $PDFName = "ItemLists_".date('Y.m.d_H.i.s').".pdf";
        $html2pdf->output($PDFName, 'I');
    } catch (Html2PdfException $x) {
        $html2pdf->clean();

        $formatter = new ExceptionFormatter($x);
        echo $formatter->getHtmlMessage();
    }

çok teşekkürler

php  html  css  tcpdf 
— Mohsen Newtoa
kaynak
Bu aslında Html2PDF kütüphanesindeki bir hatadır. Potansiyel bir çözümü araştırmak.
— EPB
Html2PDF'nin kendi HTML ayrıştırıcısını kullandığını belirtmek gerekir. style="width: 100%"doğru bir şekilde dönüştürülmüş genişliği MM olarak depolar (width özelliğinin olmamasına rağmen!) Ancak Html2PDF tablo oluşturma sırasında gerçekte kullanmıyormuş gibi görünür.
— EPB

Yanıtlar:

4

Html2PDF, TCPDF'nin HTML ayrıştırıcı / render sistemini kullanmaz. Kendi başına uygular ve uygulaması, alanın% 100'ünü doldurmak için sütunları otomatik olarak büyütmez.

Bu nedenle, Html2PDF'de, yalnızca tablo üzerinde% 100 genişlik ayarlamanız gerekmez, aynı zamanda hücrelerin her biri için yüzde genişliklerini ayarlamanız gerekir. (Ve widthHtml2PDF özelliğindeki bazı garip davranışlar nedeniyle , genişlikleri ayarlamak için CSS kullanın.)

TCPDF'nin writeHTMLözgün özelliği, aksi belirtilmedikçe her sütunu aynı genişliğe ayarlar. (Örneğin, 4 sütunlu bir tabloda tüm hücreler% 25'te bulunur) Ancak, kullandığınız CSS'yi desteklemediğinden, biçimlendirme bu rotaya gitmek için biraz ince ayar gerektirecektir.

Html2PDF'deki bu temel davranışı taklit etmek için, hücrelerinize açıkça eşdeğer genişlikler ekleyebilirsiniz. Örneğin, table td, table thstil kurallarınıza bir genişlik belirtimi eklemek .

Dört sütunlu bir tablo için aşağıdaki CSS kurallarına sahip bir örnek:

table { width: 100%; }
table th, table td { width: 25%; }

Elbette, içeriğinize uygun genişlikleri belirttiğinizde en iyi şekilde görünür.

Eşdeğer sütunlara sahip örnek

GÜNCELLEME

Aşağıda, potansiyel olarak yararlı bir sınıfın yaratılmasına yol açacağı için TCPDF ile ilgili tartışmalardan bazılarını aşağıda bırakacağım Html2pdf. TCPDF, bir dizenin uzunluğunu ölçmek için bazı yararlı yöntemlere sahiptir. Sütunların içindeki dizelerin boyutunu ölçerseniz, kendi otomatik sütun ölçücünüzü oluşturabilirsiniz.

Https://github.com/b65sol/random-classes adresinde github'da bir kavram kanıtı sınıfı oluşturdum

İlk olarak, HTML'nin yapısına aracılık etmek için sınıfı kullanıyoruz. Böylece genişlikleri ayarlamak için sütun sınıfları eklenir ve ölçtüğümüz içeriği ayıklamak için HTML'yi ayrıştırmamız gerekmez.

Ardından sütun genişliklerimizi seçmek için bazı stratejiler seçmeliyiz. Örneğin, aşağıdaki demo sütunları ölçer ve en uzun kelimeye göre her biri için minimum genişlik yüzdelerini bulur. (Wordbreaks'tan kaçınır) Daha sonra, en uzun sözcük ve en uzun tam hücre içeriği arasındaki farka dayalı olarak fazladan boşlukları orantılı olarak dağıtır. Bu prodüksiyonu bir kavram kanıtı olduğu için hazır demem, ama siz (veya diğer araştırmacılar) bunu yararlı bir başlangıç ​​noktası olarak bulmasını umuyorum.

Aşağıda bunun önemli kısmı şudur: $tablebuilder->determine_column_widths_by_minimum_strategy('100%', 'aaa')

İlk parametre bize birlikte çalıştığımız boyut referansını verir (ölçümleri kullanışlı hale getirmek için buna ihtiyaç duyduğumdan sayfanın% 100'ü) ve ikincisi metin stilini ve tabloyu hesaba katmak için ölçümlerimize eklemek için bazı önceden ayarlanmış dolgu karakterleri sağlar dolgu farklılıkları.

İşte bir demo: https://b65sol.com/so/59517311_new.php

Sınıfın kendisi burada bulunabilir: https://github.com/b65sol/random-classes

Bu demonun kodu burada:

<?php
require 'vendor/autoload.php';
include 'random-classes/html2pdf-full-table-optimizer.php';
use Spipu\Html2Pdf\Html2Pdf;

//First let's build a random table!
$wordlist = ['Chocolate', 'Cake', 'Brownies', 'Cupcakes', 'Coreshock', 'Battery', 'Lead', 'Acid', 'Remilia'];
$wordlist2 = ['Reinforcement Learning', 'Initial Latent Vectors', 'Bag-of-Words', 'Multilayer Perceptron Classifier',
  'Deconvolutional Neural Network', 'Convolutional Neural Network'];
$number_of_columns = rand(3,11);
$number_of_rows = rand(8, 15);
$possible_column_names = ['Unit', 'Description', 'Variable', 'Moon', 'Cheese', 'Lollipop', 'Orange', 'Gir', 'Gaz', 'Zim', 'Dib'];
$possible_column_content_generators = [
  function() {return rand(10,100); },
  function() {return rand(1000, 1999); },
  function() use ($wordlist) {return $wordlist[rand(0, count($wordlist)-1)]; },
  function() use ($wordlist) {return $wordlist[rand(0, count($wordlist)-1)] . ' '. $wordlist[rand(0, count($wordlist)-1)];},
  function() use ($wordlist2) {return $wordlist2[rand(0, count($wordlist2)-1)];},
];

shuffle($possible_column_names);
$list_of_generators = [];
$column_classes = [];
$column_names = [];
for($i = 0; $i < $number_of_columns; $i++) {
  $list_of_generators[$i] = $possible_column_content_generators[rand(0, count($possible_column_content_generators)-1)];
  $column_classes[$i] = ['text-left', 'text-right', 'text-center'][rand(0,2)];
  $column_names[$i] = $possible_column_names[$i];
}
//Got our random stuff, onward to generator!

try {
    $html2pdf = new Html2Pdf('P', 'A4', 'en', true, 'UTF-8', 5);
    $html2pdf->pdf->SetDisplayMode('real');
    $tablebuilder = new Html2PdfTableOptimizer($html2pdf->pdf, '11px', 'helvetica');

    //run table builder... using random data for testing.
    for($i = 0; $i < $number_of_columns; $i++) {
      /*Add a header cell, content is the first parameter, CSS class attribute is second.*/
      $tablebuilder->add_header_cell($column_names[$i], $column_classes[$i] . ' bg-dark text-white');
    }

    for($i = 0; $i < $number_of_rows; $i++) {
      //Start a row.
      $tablebuilder->start_data_row();
      for($col = 0; $col < $number_of_columns; $col++) {
        //Add content and our column classes for td elements
        $tablebuilder->add_data_row_cell($list_of_generators[$col](), $column_classes[$col]);
      }
      //End the row.
      $tablebuilder->end_data_row();
    }
    //Get the table HTML.
    $render = $tablebuilder->render_html();

    $newContent = '
      <style type="text/css">
      table{width:100%;}
      table, table td, table th{
          border-collapse: collapse;
          border: solid 1px #ababab;
      }
      .text-dark, table td{
          color: #343a40;
      }
      .text-white{
          color: #ffffff;
      }
      table td,
      table th {
          font-size: 11px;
          padding: 3px;
          line-height: 1.2;
          font-family:arial;
      }

      .bg-dark {
          background-color: #343a40;
      }
      .bg-secondary {
          background-color: #6c757d;
      }
      .bg-white {
          background-color: #ffffff;
      }
      .row-even {
        background-color: #d1d1d1;
      }
      .text-left {
          text-align: left;
      }
      .text-right {
          text-align: right;
      }
      .text-center {
          text-align: center;
      }

      '.$tablebuilder->determine_column_widths_by_minimum_strategy('100%', 'aaa').'

      </style>
      ';
      $newContent .= '<page>'.$render.'</page>';

      if(!empty($_GET['html'])) {
        echo $newContent;
      } else {
        $html2pdf->writeHTML($newContent);
        $PDFName = "ItemLists_".date('Y.m.d_H.i.s').".pdf";
        $html2pdf->output($PDFName, 'I');
      }
} catch (Html2PdfException $x) {
    $html2pdf->clean();

    $formatter = new ExceptionFormatter($x);
    echo $formatter->getHtmlMessage();
}

GÜNCELLEME SONU

Genişlikleri açıkça belirtmemeyi tercih ederseniz writeHTML, Html2PDFkitaplığı kullanmak yerine TCPDF'leri kullanabilirsiniz , ancak tek yapmanız gereken eşit boyutta sütunlar kullanmaktır. Aslında, yalnızca bir veya iki tane belirttiyseniz sütun boyutlarının yeniden hesaplanmasını yapacağını düşündüm, ancak yanılmışım. Ayrıca, TCPDF aynı sınırlamalardan bazılarına sahiptir Html2PDF- bir sütunun boyutunu belirlerseniz, diğer sütunları sığacak şekilde otomatik olarak yeniden boyutlandırmaz.

Ayrıca, tarayıcının yaptığı gibi içeriğin sütunlarını boyutlandırmaz. Bu aslında iyi yapmak oldukça zor, bu yüzden TCPDF denemedi şaşırmadım. Potansiyel olarak düşük çaba gerektiren bir çözüm, sütunlarınızı bir boyut 'oranı' ile etiketlemek ve her orantılı boyuttaki sütunlardan kaçının seçildiğine bağlı olarak her biri için genişlikleri hesaplamak olacaktır. (örneğin, sayısal sütunlar 'küçük' ve bir açıklama sütunu 'büyük' ​​olacaktır ve bu nedenle her biri% 10'da iki küçük ve% 80'de tek bir açıklama yayınlar.% 5'te iki küçük ve% 45'te büyük sütunlar Bazı deneyler yapardı.)

— EPB
kaynak
zaman ayırdığınız için, sorun dinamik tablo kullanıyorum, kullanıcılar tarafından seçilebilecek 10 sütun var, belki 5 cols veya 8 cols veya isteğe bağlı 2 cols, bunu yapabileceğim başka bir yol var ve : table th, table td { <?=floor(100 / count($cols))?>%;}ama daha iyi bir çözüm arıyorum
— Mohsen Newtoa
1
Ne kadar kararlısınız Html2PDF? Tüm kodları ve örnekleri okuduğum tek yolun bu olduğunu gösteriyor. TCPDF bunu biraz daha az yetenekli CSS ayrıştırma ile yapabilir, ancak daha iyi bir düzen sistemine sahiptir. Düz TCPDF için işaretleme önerebilirim.
— EPB
TCPDF'yi denedim ve kullandığım yöntemle aynı yöntemi kullandıklarını fark ettim ama yine de sorunumu çözmüyor, Bir hücreyi değiştirirsem diğer hücreler üzerinde etkili olacak ve tablo genişliği hala sayfaya uymuyor, TCPDF ve HTML2PDF arasındaki fark, TCPDF'nin tıpkı benimki gibi varsayılan tablo boyutunu kullanmasıdırtable th, table td { <?=floor(100 / count($cols))?>%;}
— Mohsen Newtoa
Gerçekten de karşılaştığım sorun da bu. Testimi kurduğumda sadece belirli olanların boyutunu belirlememe ve geri kalanını otomatik olarak ayarlamama izin vereceğini düşündüm (ideal olmasa da az çaba ile makul derecede güzel görünecekti), ama ... . Biraz daha kazma yapacağım ve sütunları otomatik olarak boyutlandırmanın az çaba gerektiren bir yolu olup olmadığını göreceğim. Hiçbir şekilde olsa da bir tür önişleme olması Html2PDFveya TCPDFkutudan çıkmış gibi görünmesi gerekir.
— EPB
Size güncellemeleri bildirip bildirmediğinden emin değilim, ancak içeriklerine göre metin tabanlı tabloları dinamik olarak boyutlandıran bir sınıf ekledim. determine_column_widths_evenlyBilinen birkaç boyutu belirlemenize ve kalan alanı eşit bir şekilde dağıtmasını sağlayan bir strateji de vardır .
— EPB
0

PDF'nin sunucu tarafında çalışmak CSS için mükemmel değildir. Yalnızca HTML kullanmayı denediniz mi?

Örneğin:

<table width="100%">
  <!-- your table code -->
</table>

Alternatif olarak deneyebilirsiniz:

<table style="width: 100%;">
  <!-- your table code -->
</table>

İşte bunun tarayıcıda çalıştığını gösteren bir CodePen. https://codepen.io/tinacious/pen/PowJRbb

— Tina
kaynak
Bunların hepsini denedim: <table width="100%"> <table style="width:100%;"> <table class="w100"> <link rel="stylesheet" href="style.css" />ama sorun şu ki, html'de iyi çalışıyor, ancak PDF olarak kaydetmek istediğimde resim gibi olacak.
— Mohsen Newtoa
0

fotoğraf: resim açıklamasını buraya girin

Bu tür tablolar için en iyi yol bu şekilde kullanmak olduğunu düşünüyorum:

table th, table td { width:<?=floor(100 / count($cols))?>%;}

TCPDF'de özel bir şey yapmadılar, tablo yine de sayfaya sığmıyor.

— Mohsen Newtoa
kaynak
Sitemizi kullandığınızda şunları okuyup anladığınızı kabul etmiş olursunuz: Çerez Politikası ve Gizlilik Politikası.
Licensed under cc by-sa 3.0 with attribution required.