2013-04-01 123 views
12

我正在使用PHP,Smarty和TCPDF庫來生成文檔的PDF副本。 該文檔包含來自WIRIS編輯器的數學表達圖像以及文本內容。如何在PDF中正確放置圖像旁邊的文本?

我有一個問題,正確地將文本放在表達式圖像旁邊。

我嘗試了CSS float屬性中的所有東西,但沒有發生任何事情。我附上了這封郵件所需的屏幕截圖。

這是Smarty模板代碼打印的問題及其選項:

{foreach from=$question_data item=qstn_ans key=key} 
    <table border="0" width="100%" cellpadding="2" cellspacing="0"> 
     <tr> 
      <td valign="top" >{if $qstn_ans.question_directions}{$qstn_ans.question_directions}<br /><b>Question {$que_seq_no} : </b>{/if}{$qstn_ans.question_text}</td> 
     </tr> 
     {if $qstn_ans.question_file} 
     <tr> 
      <td><img src="{$ques_thum_image_path}{$qstn_ans.question_id}_{$qstn_ans.question_file}" /></td> 
     </tr> 
     {/if} 
     {if $qstn_ans.question_has_sub_ques==0} 
      {if $qstn_ans.answer} 
       {foreach from=$qstn_ans.answer item=ans key=ans_no} 
        <td valign="top" > 
         {if $ans.answer_is_right==1}{assign var='correct_ans' value=$ans_no+1}{/if} 
          <b>{$ans_no+1}.</b>&nbsp;&nbsp;{if $ans.answer_text!=''}{$ans.answer_text}{/if} 
          {if $ans.answer_file!=''}<img src="{$ans_thumb_img_path}{$ans.answer_id}_{$ans.answer_file}" />{/if} 
        </td> 
       </tr> 
       {/foreach} 
     <tr> 
      <td></td> 
     </tr> 
    </table> 
{/foreach} 

這段代碼可能包含一些錯誤,因爲我粘貼它隨機不檢查迴路和括號完成,但是這不是問題在這裏。

該代碼中唯一重要的部分是打印問題文本和問題圖像(如果存在)的行。

我研究了正確的解決方案,但無法獲得理想的解決方案。誰能幫我嗎。

Screenshot

回答

1

查找這個代碼工作正常

$html = <<<EOD 
<h1><img src="http://www.google.com/logos/2013/wangari_maathai_73rd_birthday-1400005-hp.jpg" height="50px" width="150px"> Welcome to <a href="http://www.tcpdf.org" style="text-decoration:none;background-color:#CC0000;color:black;">&nbsp;<span style="color:black;">TC</span><span style="color:white;">PDF</span>&nbsp;</a>!</h1> 
<i>This is the first example of TCPDF library.</i> 
<p>This text <img src="http://www.google.com/logos/2013/wangari_maathai_73rd_birthday-1400005-hp.jpg" height="50px" width="150px"> <br>is printed using the <i>writeHTMLCell()</i> method but you can also use: <i>Multicell(), writeHTML(), Write(), Cell() and Text()</i>.</p> 
<p>Please check the source code documentation and other examples for further information.</p> 
<p style="color:#CC0000;">TO IMPROVE AND EXPAND TCPDF I NEED YOUR SUPPORT, PLEASE <a href="http://sourceforge.net/donate/index.php?group_id=128076">MAKE A DONATION!</a></p> 
EOD; 

// Print text using writeHTMLCell() 
$pdf->writeHTMLCell($w=0, $h=0, $x='', $y='', $html, $border=0, $ln=1, $fill=0, $reseth=true, $align='', $autopadding=true); 
0

嘗試使用<br>代碼應解決您的問題

1

好像所有的信息是不對齊從$qstn_ans.question_text到來,所以上面的代碼沒有真正的問題。

我建議將每個「聲明」保存在該問題的文本中單獨的段落中。例如。

<p>Statement I: The variance of first n even natural numbers is <img src="?" /></p> 
<p>Statement II: The sum of first n natural numbers is <img src="?" /></p> 
<p>and the sum of squares of first n natural numbers is <img src="?" /></p> 

這應該會導致問題文本的每個「行」分開顯示而不會互相碰撞。

1

我同意Nerdwood這看起來不像Smarty的問題;我認爲這只是一個CSS問題。 img向下延伸得足夠遠以捕獲下一行文本的左邊緣。您需要將文本向下移動以便它可以移動到左側。你可以把一個CSS屬性的imgclear: right;

我認爲應該這樣做。

+0

如果不工作,你可以嘗試clearfix黑客 - 'IMG:後{... '等等。 –

1

TCPDF的HTML是不完美的,所以你應該在每個<td>使用width屬性:

... 
<tr> 
    <td valign="top" width="250" > 
     {if $qstn_ans.question_directions}{$qstn_ans.question_directions}<br /><b>Question {$que_seq_no} : </b>{/if}{$qstn_ans.question_text} 
    </td> 
</tr> 
    {if $qstn_ans.question_file} 
<tr> 
    <td width="100"> 
     <img src="{$ques_thum_image_path}{$qstn_ans.question_id}_{$qstn_ans.question_file}" /> 
    </td> 
</tr> 
    {/if} 
...