Question

我有一个在我的控制器中打印到PDF的功能。它接收条形码的HTML代码并将其发送到_print-tags文件。

我的控制器文件：

public function actionPrintTags($barcode)
{
    Yii::$app->response->format = 'pdf';

    return $this->renderPartial('_print-tags', [
        'bar' => $barcode,
    ]);
}

我的_print-tags文件：

<body>
    <?= $bar . '<br/>' ?>
</body>

但它显示：

如果我在我的视图中显示它，它看起来很完美：

我使用https://www.yiiframework.com/extension/yii2-barcode-generator-8-types。

更新： $ barcode包含用于创建条形码的HTML代码：

<div style="float: left; font-size: 0px; width:0; border-left: 1px solid #000000; height: 50px;"></div><div style="float: left; font-size: 0px; background-color: #FFFFFF; height: 50px; width: 1px"></div><div style="float: left; font-size: 0px; width:0; border-left: 1px solid #000000; height: 50px;"></div><div style="float: left; font-size: 0px; background-color: #FFFFFF; height: 50px; width: 1px"></div><div style="float: left; font-size: 0px; width:0; border-left: 4px solid #000000; height: 50px;"></div><div style="float: left; font-size: 0px; background-color: #FFFFFF; height: 50px; width: 1px"></div><div style="float: left; font-size: 0px; width:0; border-left: 2px solid #000000; height: 50px;"></div><div style="float: left; font-size: 0px; background-color: #FFFFFF; height: 50px; width: 1px"></div><div style="float: left; font-size: 0px; width:0; border-left: 1px solid #000000; height: 50px;"></div><div style="float: left; font-size: 0px; background-color: #FFFFFF; height: 50px; width: 1px"></div><div style="float: left; font-size: 0px; width:0; border-left: 1px solid #000000; height: 50px;"></div><div style="float: left; font-size: 0px; background-color: #FFFFFF; height: 50px; width: 3px"></div><div style="float: left; font-size: 0px; width:0; border-left: 2px solid #000000; height: 50px;"></div><div style="float: left; font-size: 0px; background-color: #FFFFFF; height: 50px; width: 1px"></div><div style="float: left; font-size: 0px; width:0; border-left: 1px solid #000000; height: 50px;"></div><div style="float: left; font-size: 0px; background-color: #FFFFFF; height: 50px; width: 1px"></div><div style="float: left; font-size: 0px; width:0; border-left: 1px solid #000000; height: 50px;"></div><div style="float: left; font-size: 0px; background-color: #FFFFFF; height: 50px; width: 3px"></div><div style="float: left; font-size: 0px; width:0; border-left: 2px solid #000000; height: 50px;"></div><div style="float: left; font-size: 0px; background-color: #FFFFFF; height: 50px; width: 2px"></div><div style="float: left; font-size: 0px; width:0; border-left: 1px solid #000000; height: 50px;"></div><div style="float: left; font-size: 0px; background-color: #FFFFFF; height: 50px; width: 1px"></div><div style="float: left; font-size: 0px; width:0; border-left: 2px solid #000000; height: 50px;"></div><div style="float: left; font-size: 0px; background-color: #FFFFFF; height: 50px; width: 1px"></div><div style="float: left; font-size: 0px; width:0; border-left: 1px solid #000000; height: 50px;"></div><div style="float: left; font-size: 0px; background-color: #FFFFFF; height: 50px; width: 1px"></div><div style="float: left; font-size: 0px; width:0; border-left: 1px solid #000000; height: 50px;"></div><div style="float: left; font-size: 0px; background-color: #FFFFFF; height: 50px; width: 1px"></div><div style="float: left; font-size: 0px; width:0; border-left: 4px solid #000000; height: 50px;"></div><div style="float: left; font-size: 0px; background-color: #FFFFFF; height: 50px; width: 1px"></div><div style="float: left; font-size: 0px; width:0; border-left: 1px solid #000000; height: 50px;"></div><div style="clear:both; width: 100%; background-color: #FFFFFF; color: #000000; text-align: center; font-size: 10px; margin-top: 5px;">A</div>

Answer 1

这可能是mPDF限制。 mPDF不完全支持HTML和CSS功能，有些东西可能会在浏览器中呈现不同的东西。

CSS属性float在mPDF中支持部分，允许块元素（p，div等）彼此并排放置。它们还可用于创建跨越多个页面的“列”。

限制：


如果为浮动
设置了宽度，则浮动只能正常工作
如果未设置宽度，则将宽度设置为可用的最大值（如果已设置浮动，则为全宽或更小）

浮动旁边的块元素调整了填充，以便内容适合剩余的宽度。

浮动旁边的文字应该正确包裹，但背景和边框会重叠和/或位于花花公子下面一团糟

如果正在使用列，则不起作用。

您无法在使用浮动
的中间更改页边距/方向等
Float只支持块元素（即不是SPAN等）

https://mpdf.github.io/what-else-can-i-do/floating-blocks.html

您可以尝试使用此HTML并使用一些替代品（例如display: inline-block而不是float:left）或为父容器设置一些宽度。但是切换到能够将条形码渲染为图像的库（例如picqer/php-barcode-generator）可能会更简单 - 对于PDF生成器来说，简单的PNG应该不那么成问题。

Yii2：如何显示条形码？

1 个答案: