Articles in this section
Category / Section

How to generate and display Excel files in thumbnail view

2 mins read


This knowledge base explains how to generate and display excel files in thumbnail view.


We have generated the thumbnail image from excel file by using XlsIO ‘ConvertToImage()’ worksheet method. Please refer this help documentation for more information.


In the below example, we have created 2 views – one for list out the excel files in thumbnail view and another for viewing the excel file in MVC Spreadsheet while clicking the thumbnail.


VIEW (index.cshtml)

    table ul li {
        float: left;
        margin-right: 30px;
        padding: 5px;
        border: 3px solid transparent;
        table ul li:hover {
            border-color: #c8e277;
    table a:hover {
        text-decoration: none;
<h3>Server File Directory:</h3>
<table cellpadding="10">
            Select file to open:
            <ul style="list-style: none;margin: 0; padding: 0;">
                @foreach (var file in (List<string>)@ViewBag.Filenames)
                    var thumbnailImg = "/ExcelFiles/Thumbnails/" + Path.GetFileNameWithoutExtension(file) + ".png";
                        <a href='@Url.Action("ExcelView", "Home", new { fileName = file })'>
                            <div style="width:200px; height: 100px; overflow: hidden;">
                                <img src=@thumbnailImg />
                            <br />


VIEW (ExcelView.cshtml)

<h4>View excel(@ViewBag.fileName) in Spreadsheet</h4>
<div class="control" style="height: 600px;">
        .ImportSettings(import => 



public ActionResult Index()
    ViewBag.Filenames = GetFilenames();
    return View();
public ActionResult ExcelView(string fileName)
    ViewBag.fileName = fileName;
    return View();
private void RefreshThumbnail()
    var destinationPath = Server.MapPath("~/ExcelFiles");
    string[] filePaths = Directory.GetFiles(destinationPath);
    for (int i = 0; i < filePaths.Length; i++)
        var filePath = filePaths[i];
        ExcelEngine excelEngine = new ExcelEngine();                
        IApplication application = excelEngine.Excel;
        IWorkbook workbook = application.Workbooks.Open(filePath);
        IWorksheet worksheet = workbook.Worksheets[0];                
        Image image = worksheet.ConvertToImage(1, 1, worksheet.UsedRange.LastRow + 1, worksheet.UsedRange.LastColumn + 1, ImageType.Bitmap, null);
        image.Save(destinationPath + "\\Thumbnails\\" + Path.GetFileNameWithoutExtension(filePath) + ".png", ImageFormat.Png);
        //Close the workbook.
private List<string> GetFilenames()
    List<string> fileNames = new List<string>();
    var destinationPath = Server.MapPath("~/ExcelFiles");
    string[] filePaths = Directory.GetFiles(destinationPath);
    for (int i = 0; i < filePaths.Length; i++)
    return fileNames;
public ActionResult Import(ImportRequest importRequest)
    if (String.IsNullOrEmpty(importRequest.Url))
        return importRequest.SpreadsheetActions();
        Stream fileStream = System.IO.File.Open(Server.MapPath("~/ExcelFiles/") + importRequest.Url, FileMode.Open, FileAccess.Read);
        importRequest.FileStream = fileStream;
        importRequest.Url = null;
        importRequest.FileStream.Position = 0;
        string spreadsheetData = Spreadsheet.Open(importRequest);
        return Content(spreadsheetData);


The following screenshots represents the output of the above code example.


excel file in thumbnai lview preview sample


excel file in mvc spreadsheet preview

Did you find this information helpful?
Help us improve this page
Please provide feedback or comments
Comments (0)
Please sign in to leave a comment