React Native Requires Chilkat v11.7.0+
React Native
Alignment of Replaced PDF Text: Right-Aligned Amounts
See more PDF Text Replacement Examples
When the new text is wider or narrower than the text it replaces, the "align" option decides where it sits. The default, "auto", keeps a placeholder in place when it is right-aligned with other text on the page or centered, and otherwise keeps its left edge; a label's value is always left-aligned after its label. The invoice template's amounts are right-aligned, so the new amounts keep their right edge, which the "grid" text layout (characters placed by position) shows.Chilkat React Native Downloads
import { JsonObject, Pdf, StringBuilder } from '@chilkat/react-native'
function chilkatExample() {
let success = false;
// This example requires the Chilkat API to have been previously unlocked.
// See Global Unlock Sample for sample code.
// The PDF used in this example is available at invoice_template.pdf
const pdf = new Pdf();
success = true;
try {
pdf.loadFile('qa_data/pdf/invoice_template.pdf');
} catch {
success = false;
}
if (!success) {
console.log(pdf.lastErrorText);
return;
}
const json = new JsonObject();
json.updateString('placeholders.customer', 'Acme Corp');
json.updateString('placeholders.date', '2026-10-18');
json.updateString('placeholders.po', 'PO-88213');
json.updateString('placeholders.qty1', '12');
json.updateString('placeholders.desc1', 'Cordless drill, 18 V');
json.updateString('placeholders.price1', '$460.00');
json.updateString('placeholders.amount1', '$5,520.00');
json.updateString('placeholders.qty2', '60');
json.updateString('placeholders.desc2', 'Galvanized hinge, 4 inch');
json.updateString('placeholders.price2', '$12.50');
json.updateString('placeholders.amount2', '$750.00');
json.updateString('placeholders.subtotal', '$6,270.00');
json.updateString('placeholders.taxRate', '7.35%');
json.updateString('placeholders.tax', '$460.85');
json.updateString('placeholders.total', '$6,730.85');
// "auto" is the default: a placeholder that is right-aligned with other text keeps its right edge.
// The other choices are "left", "right" and "center".
json.updateString('align', 'auto');
const jsonOut = new JsonObject();
success = true;
try {
pdf.textReplace('apply', json, jsonOut);
} catch {
success = false;
}
if (!success) {
console.log(`Not applied: ${jsonOut.emit()}`);
if (!success) {
console.log(pdf.lastErrorText);
return;
}
}
// A replacement that runs into neighbouring text or off the page is still made, with a warning.
console.log(`warnings: ${jsonOut.sizeOfArray('warnings')}`);
success = true;
try {
pdf.writeFile('qa_output/invoice_aligned.pdf');
} catch {
success = false;
}
if (!success) {
console.log(pdf.lastErrorText);
return;
}
// The "grid" layout places each character by its position on the page, so the right-aligned
// amounts can be seen to line up (the wider amounts grew to the left).
const jsonText = new JsonObject();
jsonText.updateString('layout', 'grid');
const sbText = new StringBuilder();
success = true;
try {
pdf.extractTextSb('text', jsonText, sbText, jsonOut);
} catch {
success = false;
}
if (!success) {
console.log(pdf.lastErrorText);
return;
}
console.log(sbText.getAsString());
// Sample output:
// warnings: 0
// INVOICE
// Chilkat Hardware Supply
// 1200 Harbor Road, Suite 4
// Portside, WA 98000
//
//
// Bill To: Acme Corp
// Invoice #: INV-0000
// Date: 2026-10-18
// PO Number: PO-88213
// Ref: A-1
//
//
//
// Qty Description Unit Price Amount
// 12 Cordless drill, 18 V $460.00 $5,520.00
// 60 Galvanized hinge, 4 inch $12.50 $750.00
//
// Subtotal: $6,270.00
// Tax (7.35%): $460.85
// Total Due: $6,730.85
//
// Ref: A-2
//
// Payment is due within 30 days. Please include the invoice number with your payment.
// Thank you for your business, Acme Corp!
// View this invoice online
}