Spire.PDFViewer for ASP.NET contains two controls: PDFViewer and PDFDocumentViewer. Generally, PDFDocumentViewer is used for loading and viewing PDF files on website. But actually, it can also achieve other features such as zoom, fit and page after a simple design.
We've introduced the usage of PDFViewer in the previous article, so this article will illustrate how to zoom PDF File via PDFDocumentViewer in ASP.NET.
Before start, download Spire.PDFViewer for ASP.NET and install it on your system.
Step 1: Create a new ASP.NET Empty Web Application in Visual Studio. Add a new web Form to the project.
Step 2: Add the .dll files from the bin folder as the references of this project.
Step 3: Add the PDFDocumentViewer control into toolbox and drag it into Deafault.aspx.
(Detail manipulations of step 1, 2, 3 refer to this article: How to use Spire.PDFViewer for ASP.NET)
Step 4: Zoom PDF file via Spire. PDFDocumentViewer. Zoom feature is divided into three types in this article:
- Zoom: choose the zoom percentage manually.
- Zoom in: Increase the display page page zoom factor by ten percent.
- Zoom out: decrease the display page page zoom factor by ten percent.
Main codes
Section 1: Call the LoadFromFile() method of PdfDocumentViewer to load a sample PDF file in Default.aspx.cs. Note that you have to add the following if statement and !IsPostBack property before loading the pdf file.
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
//load the sample PDF file
this.PdfDocumentViewer1.CacheInterval = 1000;
this.PdfDocumentViewer1.CacheTime = 1200;
this.PdfDocumentViewer1.CacheNumberImage = 1000;
this.PdfDocumentViewer1.ScrollInterval = 300;
this.PdfDocumentViewer1.ZoomFactor = 1f;
this.PdfDocumentViewer1.CustomErrorMessages = "";
this.PdfDocumentViewer1.LoadFromFile("files/PDFViewer.pdf");
}
}
Section 2: Design, Drag a DropDownList and two buttons from toolbox into Deafault.aspx, set the properties like "ID", "text" etc. as below.
Generated source code is shown here:
<select id="PdfDocumentViewer1_SelectCurrentZoomLevel" name="PdfDocumentViewer1_SelectCurrentZoomLevel" onchange="pdfdocumentviewer1.SelectDropdownBox(this.value)">
<option value="0.5">50%</option>
<option value="0.75">75%</option>
<option value="1" selected="selected">100%</option>
<option value="1.5">150%</option>
<option value="2">200%</option>
<option value="4">400%</option>
</select>
<input type="button" id="btnZoomIn" value="Zoom In" onclick="pdfdocumentviewer1.ZoomPage()" />
<input type="button" id="btnZoomOut" value="Zoom Out" onclick="pdfdocumentviewer1.NarrowPage()" />
Effect screenshot after designing:
