使用mPDF生成的PDF上不会显示FontAwesome图标

Question

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

图标应显示在突出显示的位置上。到目前为止，这是我已经完成的工作：

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

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;        
}

我想念什么吗？请告诉我。

Answer 1

除了编码问题，这可能是两件事。首先，您需要将FontAwesome与MPDF安装集成在一起。其次，您需要考虑如何在HTML中使用字形。

在mPDF中安装FontAwesome

从https://github.com/FortAwesome/Font-Awesome下载或克隆FontAwesome，然后将fonts / fontawesome-webfont.ttf复制到MPDF ttfonts /目录中。

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

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

在HTML中添加字形

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

坏：

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

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

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

好：

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

您可以通过点击它的FontAwesome图标列表获取每个字形的Unicode代码点，但的cheatsheet是这个更方便。