Incluir campos para preenchimento
Depois de fazer upload de um documento ao envelope, você pode adicionar campos para que os destinatários preencham antes de realizar a assinatura.
É necessário que o destinatário já tenha sido criado pois usaremos o id para informar
durante a criação dos campos, lembrando que somente destinatários do tipo signer podem ter campos associados.
Para adicionar campos ao PDF é necessário que você saiba posicionar coordenadas X e Y às páginas do PDF para que fiquem exatamente na posição que deseja, lembrando que a conversão é de 72DPI, ou seja, PDF por padrão é medido em polegadas, mas precisamos que seja enviado os valores em pixel, para isso é necessário converter a cada 1 polegada para 72 pixels (72DPI).
Outro detalhe sobre as coordenadas é que é considerado x=0 e y=0 começando do canto superior esquerdo do documento.
Campo de assinatura
Para adicionar um campo onde o assinante deve fazer o desenho de assinatura, podemos fazer a seguinte requisição:
{
"recipient": "31d78262-cbd4-4f35-8070-a83c4bfe5327",
"type": "signature",
"name": "signature_1",
"widgets": [
{
"page": 1,
"x_axis": 150,
"y_axis": 50,
"width": 300,
"height": 180
}
]
}
Note que passamos um array de coordenadas dentro de uma propriedade widgets. Em um PDF, campos de formulário são adicionados de forma invisível,
ou seja, para que este campo de formulário apareça em algum lugar visualmente no PDF é necessário incluir um widget com a posição que deseja
que este campo apareça. Isso permite com que seja possível adicionar uma representação visual em multiplos locais do documento apontando para o mesmo campo.
Temos uma resposta como:
{
"id": "497f6eca-6276-4993-bfeb-53cbbbba6f08",
"recipient": "31d78262-cbd4-4f35-8070-a83c4bfe5327",
"is_required": true,
"type": "signature",
"name": "signature_1",
"options": [],
"description": null,
"placeholder": null,
"title": null,
"value": null,
"filled_at": null,
"created_at": "2022-05-24T14:15:22Z",
"updated_at": "2022-05-24T14:15:22Z",
"widgets": [
{
"page": 1,
"x_axis": 150,
"y_axis": 50,
"width": 300,
"height": 180,
"rotation": null,
"background_color": null,
"border_color": null,
"border_width": null,
"text_color": null,
"opacity": null,
"font_size": null,
"font_family": null
}
]
}
Para mais detalhes sobre o endpoint de adicionar campos, confira na referência de APIs clicando aqui.
imagem de assinatura
Campo de rubrica
O campo de rubrica segue a mesma ideia do campo de assinatura, porém o assinante deverá desenhar uma rubrica, exemplo:
{
"recipient": "31d78262-cbd4-4f35-8070-a83c4bfe5327",
"type": "rubric",
"name": "rubric_1",
"widgets": [
{
"page": 1,
"x_axis": 150,
"y_axis": 50,
"width": 300,
"height": 180
}
]
}
imagem de rubrica
Campo de texto
Para campos de texto podemos definir se é obrigatório o preenchimento por parte do destinatário ou não:
{
"recipient": "31d78262-cbd4-4f35-8070-a83c4bfe5327",
"type": "text",
"name": "text_1",
"is_required": true,
"widgets": [
{
"page": 1,
"x_axis": 150,
"y_axis": 50,
"width": 300,
"height": 180
}
]
}
imagem do campo de texto
Caixa de seleção
Caixas de seleção segue o mesmo modelo do campo de texto, exemplo:
{
"recipient": "31d78262-cbd4-4f35-8070-a83c4bfe5327",
"type": "checkbox",
"name": "checkbox_1",
"is_required": true,
"widgets": [
{
"page": 1,
"x_axis": 150,
"y_axis": 50,
"width": 300,
"height": 180
}
]
}
O campo de seleção não terá um label ou algum texto a frente de onde ele será adicionado, você deverá adicionar esta label criando conteúdo de texto ou colocando o checkbox em um local que faça sentido dentro do PDF.
imagem da caixa de seleção
Campo de opções
No campo de opções deve ser informado as options disponíveis para o destinatário selecionar:
{
"recipient": "31d78262-cbd4-4f35-8070-a83c4bfe5327",
"type": "dropdown",
"name": "dropdown_1",
"is_required": true,
"options": [
"Saturn",
"Mercury",
"Earth"
],
"value": "Mercury",
"widgets": [
{
"page": 1,
"x_axis": 150,
"y_axis": 50,
"width": 300,
"height": 180
}
]
}
A propriedade value não é obrigatória ser preenchida, mas ao preenche-la, você define o valor inicial do qual esse campo de opções começará.
imagem da caixa de seleção