Liquid UI - Documentation - 19.17 Printing a formatted receipt

19.17 Printing a formatted receipt


Prerequisites


Purpose

To show a real time scenario demonstrating how to print a formatted receipt using WS scripts. The WS platform extends the functionality of WS by providing the ability to use printers through Webscript.


Prerequisites

To use wsprint, you must first load the necessary files using the load command. These files are as follows.

  • wsprint.dll
  • wsprint.js


User Interface

In this example, we will use all of the functions we discussed in the earlier examples to print out a formatted receipt. Although in this case we used hard-coded values, you can also use variables to pass in the actual product names and price values. This operation requires that we use both wsprint.dll and wsprint.js functions. The process is as follows.

  1. Create a new function to contain the operation. In this example we will name our function 'printReceipt()'.
  2. Define the printer that we will use. In this case, we will use the built-in XPS document Writer.
  3. Once the printer is defined, we will specify the margins and place them into an array.
  4. Specify the font colors using the RGB values and place these values into an array.
  5. Specify the output font and size. In this example, we chose Times New Roman and set the size to 15. The color is defined using the array we previously created.
  6. Call the print function, passing the font and margin values as arguments.
  7. Add a heading. Here we are using the 'printCenterAlign()' function to define the heading 'WALMART', followed by a return.
  8. Define a table. This is explained in more detail in the Printing Tables example above.
  9. Define a separator line using the 'lineStyle' option.
  10. Add some additional text. In our example, we added the return policy.
  11. Run the function to print the receipt.


Script Details

System.LoadFile('wsprint.js');


function printReceipt() {
    var a, b;
    try {
	    a = new Printer('Microsoft XPS Document Writer'); 

		var iTOP = 20;
		var iBOTTOM = 20;
	    var iLEFT = 20;
		var iRIGHT =  20;

		var pMargin = [iTOP, iBOTTOM, iLEFT, iRIGHT];
		var iRcolor=200;
		var iGcolor=210;
		var iBcolor=100;
		
		var zColor=[iRcolor,iGcolor,iBcolor];
		var aFont={type:"Times New Roman", size:20, color:zColor,italic:true};
		a.print({font:aFont, margin:pMargin });	
		a.printCenterAlign('WALMART\n');
		
		var row1=['Item','Quantity','Price'];
		table1=[row1];
		a.tablePrint(table1);
		a.print({lineStyle:"DASH"});
		
		aFont={size:20,italic:false};
		a.print({font:aFont});
		
		row2=['Lays Chips','3','5.00'];
		row3=['Apple','4 LB','10.00'];
		
		table2=[row2,row3];
		a.tablePrint(table2);
		a.print({lineStyle:"DASH"});
			  
		row4=['TOTAL','','15.00'];
		table3=[row4];
		a.tablePrint(table3);
		
		a.print({lineStyle:"DASH"});
		a.print('Items can only be returned within 30 days of purchase. You must have your orginal receipt');
	}
	catch(err) {
      System.TraceOutput(err);
    }
}
printReceipt();

Can't find the answers you're looking for?