jsPDF AcroForms 中未选中的复选框

问题描述 投票:0回答:3

jsPDF 文档中的 jsPDF AcroForm 字段示例展示了如何创建 CheckBox 字段,但该字段始终在最初被选中。如何创建一个初始化为未选中状态的复选框?

jspdf
3个回答
3
投票

在深入研究 PDF 规范 (ISO 32000-1:2008) 后,我在第 12.7.4.2.3 节中发现选中和未选中的外观对应于字段外观字典中的条目。我下载了jsPDF生成的PDF:

var doc = new jsPDF();
doc.text('CheckBox:', 10, 125);
var checkBox = new CheckBox();
checkBox.fieldName = "CheckBox1";
checkBox.Rect = [50, 120, 30, 10];
checkBox.value = 'Yes'
doc.addField(checkBox);

我在文本编辑器中打开 PDF,找到了我的字段定义:

<<
/F 4
/Rect [141.73 473.39 226.77 501.73]
/FT /Btn
/T (CheckBox1)
/DA (/F13 0 Tf 0.000 g)
/V /Yes
/Type /Annot
/Subtype /Widget
/Q 1
/MK <<
/CA (3)
>>
/AS /On
/AP <<
/N <</On 7 0 R >>/D <</On 8 0 R /Off 9 0 R >>>>
>>

/N是字典,AS值是CheckBox是否被选中。所以这意味着您可以通过以下方式控制外观:

checkBox.appearanceState = 'Off' //unchecked
checkBox.appearanceState = 'On' //checked

0
投票

这是我使用的两个非常简单的变体:

var doc = new jsPDF('p', 'mm', 'a4');

function checkbox(x, y, length, width) {
doc.rect(x, y, length, width);
doc.line(x, y, x + length, y + width);
doc.line(x, y + length, x + width, y);
}

doc.text(10, 28, 'Checked')
checkbox(10, 30, 2, 2);
checkbox(20, 30, 4, 4);
checkbox(35, 30, 8, 8);
checkbox(55, 30, 12, 12);

doc.text(10, 48, 'Unchecked')
doc.rect(10, 50, 2, 2);
doc.rect(20, 50, 4, 4);
doc.rect(35, 50, 8, 8);
doc.rect(55, 50, 12, 12);

结果: What the checkbox looks like.


0
投票

献给所有来自未来的开发者。

AcroFormCheckBox 在官方存储库中第 2348 行定义。

value
appearanceState
属性的正确值为
On
Off

所提供的解决方案导致复选框相对于内部

value
的可视化不一致,从而导致 PDF 导入端出现错误。

正确解决方案:

var doc = new jsPDF();
var checkBox = new CheckBox();
checkBox.fieldName = "CheckBox1";
checkBox.Rect = [50, 120, 30, 10];
checkBox.value = 'Off'; // or On
checkBox.appearanceState = 'Off'; // or On
doc.addField(checkBox);
© www.soinside.com 2019 - 2024. All rights reserved.