Custom Stamps

API Reference

Annotation stamps are predefined or can be completely customized. A list of stamps can be set by specifying the text, color, font, and font size. This demo shows how to add your own stamp list to the Document Viewer.

This demo uses the MVC version of TXTextControl.Web.MVC.DocumentViewer included in TX Text Control .NET Server for ASP.NET. The functionality is compatible across all supported platforms.

Version 33.0

Stamp Text The text will be rendered as a stamp.

Font

Color

Scroll down to find the form that allows you to add a new custom stamp. Add some text, choose a font and click "Add custom stamp" to insert the stamp to the list of available stamps.

Sample Source Code

	<div class="tx-container">
	@Html.TXTextControl().DocumentViewer(settings => {
	settings.DocumentPath = Server.MapPath("~/App_Data/Documents/invoice_results.docx");
	settings.Dock = DocumentViewerSettings.DockStyle.Fill;
	settings.IsSelectionActivated = true;
	settings.ShowThumbnailPane = false;
	settings.UserNames = new string[] { "Tim Typer" };
	}).Render()
	</div>

	@* <!---Buttons ---> *@

	<div class="form-group mt-5">
	<label for="stampText">Stamp Text</label>
	<input type="text" class="form-control" id="stampText" aria-describedby="stampTextHelp" placeholder="Enter stamp text">
	<small id="stampText" class="form-text text-muted">The text will be rendered as a stamp.</small>
	</div>
	<div class="form-group">
	<label for="stampFont">Font</label>
	<select class="form-control" id="stampFont">
	<option>Arial</option>
	<option>Arial Black</option>
	<option>Bookman</option>
	<option>Comic Sans MS</option>
	<option>Courier</option>
	<option>Courier New</option>
	<option>Garamond</option>
	<option>Georgia</option>
	<option>Impact</option>
	<option>Palatino</option>
	<option>Tahoma</option>
	<option>Times New Roman</option>
	<option>Times</option>
	<option>Trebuchet MS</option>
	<option>Verdana</option>
	</select>
	</div>
	<div class="form-group">
	<label for="stampColor">Color</label>
	<select class="form-control" id="stampColor">
	<option value="rgba(255, 0, 0, 1)" style="color: white; background-color: rgba(255, 0, 0, 1);">Red</option>
	<option value="rgba(0, 255, 0, 1)" style="color: white; background-color: rgba(0, 255, 0, 1);">Green</option>
	<option value="rgba(0, 0, 255, 1)" style="color: white; background-color: rgba(0, 0, 255, 1);">Blue</option>
	</select>
	</div>

	<button onclick="addStamp()" class="btn btn-success">Add custom stamp</button>

view raw test.cshtml hosted with ❤ by GitHub

No code required.

	function addStamp() {

	var stampText = (document.getElementById("stampText").value == "") ? "Custom Stamp" : document.getElementById("stampText").value;
	var stampFont = document.getElementById("stampFont").options[document.getElementById("stampFont").selectedIndex].text;
	var stampColor = document.getElementById("stampColor").options[document.getElementById("stampColor").selectedIndex].value;

	var customStamp = {
	text: stampText,
	color: stampColor,
	font: stampFont,
	size: "38",
	weight: "bold",
	style: "normal"
	};

	var currentStampList = TXDocumentViewer.annotations.getStampList();
	currentStampList.unshift(customStamp);

	TXDocumentViewer.annotations.setStampList(currentStampList);
	}

view raw addstamp.js hosted with ❤ by GitHub

No code required.

Next Sample