Custom signature appearance using iText

Question

I am trying to create custom digital signatures using iText (sharp, version 5.5.13) where the user is able to set the image location from a set of four positions (top, bottom, left and right), as shown below:

Rigth:

ImgRigth

Left:

ImgLeft

Top:

ImgTop

Bottom:

ImgBottom

So far I tried working on layer 0 of the signature but I think I doing it wrong because signature details are set in layer 2.

Nevertheless, this is just an initial sketch to set position of the images. In the following code I load the image and put it in a chunk (idea taken from this example)

PdfTemplate pdfTemplate = sap.GetLayer(0);
ColumnText c1 = new ColumnText(pdfTemplate);
Image img = Image.GetInstance(signatureImage);
Phrase elements = new Phrase();
elements.Add(new Chunk(img, 0, 0, true));
//c1.SetSimpleColumn(elements, 0, 0, rectangle.Width, rectangle.Height / 4, 0, Element.ALIGN_CENTER); // align bottom
//c1.SetSimpleColumn(elements, 0, rectangle.Height / 2, rectangle.Width, rectangle.Height, 0, Element.ALIGN_CENTER); // align top
c1.SetSimpleColumn(elements, rectangle.Width/2, 0, rectangle.Width, rectangle.Height, 0, Element.ALIGN_CENTER); // align right
//c1.SetSimpleColumn(elements, 0, 0, rectangle.Width/2, rectangle.Height, 0, Element.ALIGN_CENTER); // align left
c1.Go();

The result is more or less the expected, but there are two problems: the signature information takes over the whole rectangle (this is normal since I do not modify layer 2, and the image in layer 0 is not scaled as it should)

right_signed

If I scale the image to fit the column, it goes to the top of rectangle:

img_rigth_scaled

Is there any way to do this "out of the box" or I need to overload the method that builds the signature appearance (like this) and how can I achieve this?

Grazina Grazina · Accepted Answer · 2019-09-10T09:55:25

My initial concert was not to use iText (v7) because we do not have much time to migrate all the projects we have with iText (v5), but I went ahead and tried out with v7. But to be honest is does not seem to be very easy to achieve with v5.

On the other hand, in iText (v7) I was able to do this very quickly with this simple method:

private static void SetCustomSignature(PdfDocument doc, PdfSignatureAppearance sap, SignatureFormat signatureFormat, X509Certificate2 signerCertificate) {
    string signatureFont = signatureFormat.Font;
    float signatureFontSize = float.Parse(signatureFormat.FontSize);
    Rectangle rect = new Rectangle(250, 100, 200, 80);
    sap.SetPageRect(rect).SetPageNumber(1);
    PdfFormXObject layer2 = sap.GetLayer2();
    PdfCanvas canvas = new PdfCanvas(layer2, doc);

    float MARGIN = 2;
    PdfFont font = PdfFontFactory.CreateFont();

    string signingText = GetSignatureInfo(signerCertificate, signatureFormat);

    // Signature at left and image at right
    //Rectangle dataRect = new Rectangle(rect.GetWidth() / 2 + MARGIN / 2, MARGIN, rect.GetWidth() / 2 - MARGIN, rect.GetHeight() - 2 * MARGIN);
    //Rectangle signatureRect = new Rectangle(MARGIN, MARGIN, rect.GetWidth() / 2 - 2 * MARGIN, rect.GetHeight() - 2 * MARGIN);

    // Signature at right and image at left
    //Rectangle dataRect = new Rectangle(MARGIN, MARGIN, rect.GetWidth() / 2 - MARGIN, rect.GetHeight() - 2 * MARGIN);
    //Rectangle signatureRect = new Rectangle(rect.GetWidth() / 2 + MARGIN / 2, MARGIN, rect.GetWidth() / 2 - 2 * MARGIN, rect.GetHeight() - 2 * MARGIN);

    // Signature at top and image at bottom
    //Rectangle dataRect      = new Rectangle(MARGIN, MARGIN, rect.GetWidth() - 2 * MARGIN, rect.GetHeight() / 2 - MARGIN);
    //Rectangle signatureRect = new Rectangle(MARGIN, rect.GetHeight() / 2 + MARGIN, rect.GetWidth() - 2 * MARGIN, rect.GetHeight() / 2 - MARGIN);

    // Signature at bottom and image at top
    Rectangle dataRect = new Rectangle(MARGIN, rect.GetHeight() / 2 + MARGIN, rect.GetWidth() - 2 * MARGIN, rect.GetHeight() / 2 - MARGIN);
    Rectangle signatureRect = new Rectangle(MARGIN, MARGIN, rect.GetWidth() - 2 * MARGIN, rect.GetHeight() / 2 - MARGIN);

    try {
        Canvas signLayoutCanvas = new Canvas(canvas, doc, signatureRect);
        Paragraph paragraph = new Paragraph(signingText).SetFont(font).SetMargin(0).SetMultipliedLeading(0.9f).SetFontSize(10);
        Div div = new Div();
        div.SetHeight(signatureRect.GetHeight());
        div.SetWidth(signatureRect.GetWidth());
        div.SetVerticalAlignment(iText.Layout.Properties.VerticalAlignment.MIDDLE);
        div.SetHorizontalAlignment(iText.Layout.Properties.HorizontalAlignment.CENTER);
        div.Add(paragraph);
        signLayoutCanvas.Add(div);


        Canvas dataLayoutCanvas = new Canvas(canvas, doc, dataRect);
        Image image = new Image(ImageDataFactory.Create(signatureFormat.SignatureImage));
        image.SetAutoScale(true);
        Div dataDiv = new Div();
        dataDiv.SetHeight(dataRect.GetHeight());
        dataDiv.SetWidth(dataRect.GetWidth());
        dataDiv.SetVerticalAlignment(iText.Layout.Properties.VerticalAlignment.MIDDLE);
        dataDiv.SetHorizontalAlignment(iText.Layout.Properties.HorizontalAlignment.CENTER);
        dataDiv.Add(image);
        dataLayoutCanvas.Add(dataDiv);
    }
    catch {
        throw;
    }
}

This will result in the following signatures:

Of course, it still needs some improvements but it may serve as an example for others :-)

Custom signature appearance using iText

1 Answers