Customizing Your Stamp Display using a Foxit PDF SDK For Web, customization can enhance your user experience. Two aspects that can be tailored to suit user preferences are the format of dynamic stamps and the operations available in the Stamp UI.
Here's a guide on how to modify these settings.
Customizing Time Format for Dynamic Stamps By default, the time format for Dynamic Stamps is set to "yyyy-mm-dd."
However, if you wish to alter this, the PDFViewer::setFormatOfDynamicStamp method allows you to do so. Here's how you can alter the code to change the time format.
var pdfViewer = await pdfui.getPDFViewer();
await pdfViewer.setFormatOfDynamicStamp(',','MM/DD/YYYY');
Once this change is implemented, your dynamic stamps should display the altered format, as shown below:
How to Disable Operations in the Stamp UI
Before version 9.1, you had to override the style to achieve this. Here's an example of how it was done:
<style>…….pdf-page-markup-annot-handler-container .fv__shape-rotate{ display: none;/*Hide the rotate button*/
}.pdf-page-markup-annot-handler-container .fv__shape-controller { display: none;/*Hide zoom control points*/
}.pdf-page-markup-annot-handler-container .fv__shape-control-move-area{ display: none;/*Hide moving area*/
}</style>
Since version 9.1, however, you can easily modify these settings using configuration options. Here's an example:
const pdfui = new PDFUI({
viewerOptions: {
customs: {
getAnnotComponentConfig: function (annotComponent, props) {
let annot = annotComponent.getModel();
if (annot.getType() !== 'stamp') {
return;
}
let config = {};
props.forEach(function (key) {
switch (key) {
case 'resizable'://resize
config[key] = false;
break;
case 'moveable'://move
config[key] = false;
break;
case 'rotatable'://rotate
config[key] = false;
break;
}
})
return config;
}
}
}
})In sum, customization of the stamp display in your PDF viewer interface is a simple process that can significantly enhance your user experience. Whether you wish to change the format of dynamic stamps or disable certain operations, you have the necessary tools to tailor your interface to your liking.
