2012-05-28 8 views
1

По умолчанию значения в ячейках ячеек (внутри таблиц, генерируемых TCPDF) выравниваются по вертикали в верхней части ячейки.PHP TCPDF - Как вертикально выравнивать текст в ячейке таблицы?

Кто-нибудь нашел простой метод вертикального выравнивания текста до середины ячейки?

Я нашел пару предлагаемых решений онлайн, но это не кажется мне идеальным.

Например, одно предложение (http://sourceforge.net/projects/tcpdf/forums/forum/435311/topic/4385696) заключается в установке содержимого каждой ячейки с использованием метода MultiCell() TCPDF, но это боль, когда вы просто хотите выписать свой HTML-код, а затем сгенерировать PDF-файл.

Другое предложение (http://bytethinker.com/blog/tcpdf-and-vertical-alignment-of-table-cells) состоит в том, чтобы размещать промежутки в каждой ячейке и создавать пустые строки с разрывами строк в этих промежутках в порядке чтобы заставить ваш текст вниз (и, следовательно, к вертикальному центру), но это немного взломать.

Кто-нибудь нашел лучший/чистый способ достичь этого? Разумеется, библиотека, популярная, будет отвечать за такое общее требование?

+1

Вы пробовали с помощью 'valign' atribute или CSS на клетках – Musa

+0

Хэя. Я должен был упомянуть об этом в тексте выше, но да, я пробовал стандартный подход HTML/CSS. –

+0

Есть много способов добиться этого в css. Вы пробовали их все? –

ответ

2

Помните, что TCPDF не может обрабатывать полномасштабные HTML и CSS так, как это может сделать браузер. Nicolas проделал хорошую работу по предоставлению наиболее часто используемых кодов HTML. CSS не может быть размещен в верхней части документа, он должен быть вставлен в строку.

Таблицы должны быть отформатированы полностью вручную - ячейки не устанавливают автоматическую настройку, как в браузере. Точно так же вы должны выяснить, насколько высок что-то, и добавить <BR> s или размер невидимого изображения, чтобы нажать его, если хотите.

Возможно, однажды он добавит больше этой функции. Как бы то ни было, я считаю класс замечательным.

5

Следующие способы работы для меня. 1. Введите приведенный ниже код непосредственно над табличным тегом.

<style> td{height: 20px;line-height:10px;}</style> 

Примечание: Высота должна быть двойной длины линии.

  1. Использовать атрибут cellpadding на уровне таблицы. Для например,

    CELLPADDING = "5"

В обоих случаях вам нужно отрегулировать высоту.

+0

cellpadding = "5" работает, line-высота css на моем примере нет ... – Silvan

0

Может быть, с меньшей высоты линии это обходной путь:

<table width="100%" cellpadding="5" cellspacing="0">

значение CELLPADDING высота ячейки/2. Не выглядит красивым, если вам нужно больше пространства/высоты , в противном случае это будет лучшее решение: http://bytethinker.com/blog/tcpdf-and-vertical-alignment-of-table-cells

0

Я хотел бы выровнять несколько, но не все, ячейки. Я обнаружил, что просто заполнение с <br> не сработало.

Вместо этого вам необходимо использовать &nbsp;<br> - это затем сдвинуло текст вниз.

-1

его работы (CELLPADDING) ...

<table border="1" cellpadding="5" style="font-size:10px;"> 

$html .= '<table border="1" cellpadding="5" style="font-size:10px;">'; 
 
$html .= '<tr style="font-weight:bold;text-align:center;line-height:11px;" >'; 
 
$html .= '<th>School/College Name</th>'; 
 
$html .= '<th>Board</th>'; 
 
$html .= '<th>Language</th>'; 
 
$html .= '<th>Percentage</th>'; 
 
$html .= '<th>Place</th>'; 
 
$html .= '</tr>'; 
 
$html .= '<tr style="text-align:center;line-height:11px;font-weight:bold;font-size:8px;" >'; 
 
$html .= '<td style="vertical-align: middle;font-weight:bold;">' . $tenInfo[0]['school_college_name'] . '</td>'; 
 
$html .= '<td style="vertical-align: middle">' . $tenInfo[0]['board']. '</td>'; 
 
$html .= '<td style="vertical-align: middle">' . $tenInfo[0]['main_lang']. '</td>'; 
 
$html .= '<td style="vertical-align: middle">' . $tenInfo[0]['percentage']. '</td>'; 
 
$html .= '<td style="vertical-align: middle">' . $tenInfo[0]['school_college_place']. '</td>'; 
 
$html .= '</tr>'; 
 

 
$html .= '<tr style="text-align:center;line-height:11px;font-weight:bold;font-size:8px;" >'; 
 
$html .= '<td style="vertical-align: middle">' . $plusInfo[0]['school_college_name'] . '</td>'; 
 
$html .= '<td style="vertical-align: middle">' . $plusInfo[0]['board']. '</td>'; 
 
$html .= '<td style="vertical-align: middle">' . $plusInfo[0]['main_lang']. '</td>'; 
 
$html .= '<td style="vertical-align: middle">' . $plusInfo[0]['percentage']. '</td>'; 
 
$html .= '<td style="vertical-align: middle">' . $plusInfo[0]['school_college_place']. '</td>'; 
 
$html .= '</tr>'; 
 

 
$html .= '<tr style="text-align:center;line-height:11px;font-weight:bold;font-size:8px;" >'; 
 
$html .= '<td style="vertical-align: middle">' . $ugInfo[0]['school_college_name'] . '</td>'; 
 
$html .= '<td style="vertical-align: middle">' . $ugInfo[0]['board']. '</td>'; 
 
$html .= '<td style="vertical-align: middle">' . $ugInfo[0]['main_lang']. '</td>'; 
 
$html .= '<td style="vertical-align: middle">' . $ugInfo[0]['percentage']. '</td>'; 
 
$html .= '<td style="vertical-align: middle">' . $ugInfo[0]['school_college_place']. '</td>'; 
 
$html .= '</tr>'; 
 

 

 
$html .= '<tr style="text-align:center;line-height:11px;font-weight:bold;font-size:8px;" >'; 
 
$html .= '<td>' . $pgInfo[0]['school_college_name'] . '</td>'; 
 
$html .= '<td>' . $pgInfo[0]['board']. '</td>'; 
 
$html .= '<td>' . $pgInfo[0]['main_lang']. '</td>'; 
 
$html .= '<td>' . $pgInfo[0]['percentage']. '</td>'; 
 
$html .= '<td>' . $pgInfo[0]['school_college_place']. '</td>'; 
 
$html .= '</tr>'; 
 
$html .= '</table>';

+0

нет работа! ...... –

1

У меня есть таблица с один столбец, имеющий разный размер шрифта (вызвать номера большие и не будет оставаться на одной линии, если не делать меньше), и клиент хочет, чтобы они были вертикально центрированы в ячейках.

После попытки всех хаков, которые я узнал в своей истории HTML и CSS и TCPDF каждый раз, когда насмехался над мной, я, наконец, решил такое умное решение, которого он не ожидал, и, наконец, я получил вертикальное выравнивание ячеек более или менее в место, то есть в середине клетки.

Я узнал, что если есть изображение в одной и той же ячейке, TCPDF выравнивает текст в нижней строке изображения. Поэтому я сделал скрипт утилиты, чтобы служить мне с белым изображением параметризованной ширины и высоты и поставить это перед текстом. Можно также просто сделать белое изображение желаемых размеров и использовать его, но мне было легче поэкспериментировать со сценарием и различными параметрами. В моем случае wwidth составляет всего 1px, но теоретически можно также направить текст вправо с изображением.

Конечно, есть некоторые проблемы с этим подходом, но в моем случае все цифры довольно хорошо ведут себя. Если высота централизованного текста или других столбцов сильно различается, очень сложно найти хорошее значение (хотя с параметризацией можно попытаться вычислить высоту, необходимую для длин каждой ячейки в строке).

я бы все равно предпочел, если там может быть по крайней мере верхнего набивка или сверху запас, который можно установить в ячейку (рабочее вертикальное выравнивание было бы еще более желательным, но даже имея какой-либо инструмент сделает жизнь проще)

Надеется, что это помогает даже некоторых других бедным кодер

моток

3

Если его статическая таблица ... вы можете добавить невидимый текст над содержимым, чтобы подтолкнуть текст вниз:

<td width="12%" style="text-align:center"> 
    <div style="font-size:10pt">&nbsp;</div> 
    <b>The contents of my cell...</b> 
</td> 

Отрегулируйте размер шрифта & nbsp; поднять или опустить текст ... Его взломать, но он действительно работает. < br /> тоже ... но они будут менее точными ...

0

Гнездо другое ТАБЛИЦА и добавьте еще одну ROW. Добавьте пустой TD перед содержимым, которое вы хотите выровнять по вертикали, и добавьте к нему атрибут высоты. Это должно дать вам гранулированный контроль на вертикальном расстоянии.

Вот пример:

'<table cellpadding="0" border="0" style="border-collapse: collapse;">' . 
    '<tr>' . 
    '<td width="148" height="80">' . 
    '<img width="128" src="' . "images/gcs_logo.svg" . '"/>' . 
    '</td>' . 
    '<td style="line-height:14px; font-size:11px;">' . 
     '<table cellpadding="0" border="0" style="border-collapse: collapse;">' . 
     '<tr style="color:#000000;">' . 
     '<td height="23" style="text-decoration:underline;padding:0;"></td>' . 
     '</tr>' . 
     '<tr style="color:#000000;">' . 
     '<td style="padding:0;">18191 Von Karman Avenue<br/>Suite 300<br/>Irvine, California 92612</td>' . 
     '</tr>' . 
     '</table>' . 
    '</td>' . 
    '</tr>' . 
    '</table>'; 
0

Используйте встроенный стиль для <td> тега, а затем изменять процент, чтобы установить текст в подходящем месте вы хотите на дисплее PDF. e.г

<td style="line-height: 250%;">'. $variable .'</td> 
0

Вы можете добавить пространство для вашего <td> таблицы с помощью &nbsp;<br/>

я нашел, что это может быть, link может помочь вам

0

Добавление стиль = "высота строки: 50%;" в теге изображений работает для меня. Пожалуйста, попробуйте. В моем случае, я хотел вертикальное выравнивание изображения в ячейке таблицы. Вы можете добавить div в ячейку таблицы и добавить в него изображение или текст. Ниже работает для меня.

<div align="center"><img src="images/logo_example.png" border="0" height="30" width="30" style="line-height:50%;"/></div>

Смежные вопросы