FontAwesome图标不会使用mPDF在生成的PDF上显示 [英] FontAwesome Icons won't Show on Generated PDF using mPDF

问题描述

我正在使用mPDF来生成工资单。但是，一旦生成，薪资单中的图标就不会显示。它只留下一个空白区域：

I am using mPDF in generating payslips. However, the icons in the payslip aren't showing once it is generated. It only leaves a blank space just like this:

图标应显示在突出显示的位置。
到目前为止，这就是我所做的：

Icons should show on those highlighted spots. So far, here's what I've done:

我使用的是Yii2 PHP框架，这里是我的动作控制器：

I am using Yii2 PHP framework and here's my action controller:

public function actionPdf($id)
{
    $model = $this->findModel($id);
    $earnings = EarningDetails::find()->where(['payslip_id' => $model->_id, 'status' => 1])->all();
    $deductions = DeductionDetails::find()->where(['payslip_id' => $model->_id, 'status' => 1])->all();
    $html = $this->render('view', [
        'model' => $model,
        'earnings' => $earnings,
        'deductions' => $deductions,
    ]);
    $mpdf = new mPDF('c','A5-L','0','',0,4,1,1,0,0);
    $mpdf->allow_charset_conversion = true; 
    $mpdf->charset_in = 'windows-1252';
    $mpdf->SetTopMargin(0);
    $user_password = User::find()->where(['_id' => $model->user_id ])->one(); 
    $password = $user_password->fname.$user_password->lname;
    $mpdf->SetProtection(array(), $password, $password);
    $mpdf->WriteHTML($html);
    $mpdf->Output('Payslip.pdf', 'D');
    exit;        
}

我错过了什么吗？请告诉我。

Am I missing something? Please let me know.

推荐答案

除了编码问题，这可能是一些事情。首先，您需要将FontAwesome与MPDF安装集成。其次，你需要考虑如何用HTML来表示字形。

Encoding issues aside, this could be a couple of things. Firstly, you need to integrate FontAwesome with your MPDF installation. Secondly, you need to consider how you're speficiying the glyph in HTML.

从 https://github.com/FortAwesome/Font-Awesome 下载或克隆FontAwesome并复制 fonts / fontawesome-webfont.ttf 进入你的MPDF ttfonts / 目录。

Download or clone FontAwesome from https://github.com/FortAwesome/Font-Awesome and copy fonts/fontawesome-webfont.ttf into your MPDF ttfonts/ directory.

在你的MDPF config_fonts中。 php 文件，将以下行添加到 $ this-> fontdata ：

In your MDPF config_fonts.php file, add the following lines to $this->fontdata:

 /* FontAwesome */
    "fontawesome" => array(
        'R' => "fontawesome-webfont.ttf"
        ),

在HTML中添加字形

您需要记住CSS ：在之前伪通常用于将FontAwesome字形添加到HTML的选择器在mPDF中不起作用。

Adding the glyph in HTML

You need to keep in mind that the CSS :before pseudo-selector commonly used to add FontAwesome glyphs to HTML doesn't work in mPDF.

错误：

<i class="fa fa-smile-o"></i>

...因为这个FontAwesome CSS规则在mPDF中不起作用：

... because this FontAwesome CSS rule doesn't work in mPDF:

.fa-smile-o:before {
  content: "\f118";
}

好：

<i class="fa">&#xf118;</i>

您可以通过在FontAwesome图标列表上单击来获取每个字形的unicode代码点，但是 Cheatsheet 对此更方便。

You can get the unicode code point for each glyph by clicking on it on the FontAwesome Icon List, but the Cheatsheet is more convenient for this.

这篇关于FontAwesome图标不会使用mPDF在生成的PDF上显示的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！