Question

I seem to be doing something wrong here.

All I want to do is show a thumbnail image within gridview.

The ASPX page has a gridview and an asp:image control. The imageurl for the asp:image control comes from an website.

Once I get the imageUrl, I want to render the image as thumbnail using below ResizeImage function. Finally I would like to assign thumbnail to the gridview column that shows thumbnail image as shown in below code

protected void SearchResults_RowDataBound(object sender, GridViewRowEventArgs e)
{
    if (e.Row.RowType.Equals(DataControlRowType.DataRow))
    {
        System.Web.UI.WebControls.Image imgNew = (System.Web.UI.WebControls.Image)e.Row.FindControl("ProductThumbField");
        imgNew.Source = Utils.ResizeImage(imgNew.ImageUrl.ToString(),60,60);
    }
}

Here is the code that resizes the image. (taken from an example from stackoverflow questions & answers).

    private static Bitmap ResizeImage(String filename, int maxWidth, int maxHeight)
{
    using (System.Drawing.Image originalImage = System.Drawing.Image.FromFile(filename))
    {
        //Caluate new Size
        int newWidth = originalImage.Width;
        int newHeight = originalImage.Height;
        double aspectRatio = (double)originalImage.Width / (double)originalImage.Height;
        if (aspectRatio <= 1 && originalImage.Width > maxWidth)
        {
            newWidth = maxWidth;
            newHeight = (int)Math.Round(newWidth / aspectRatio);
        }
        else if (aspectRatio > 1 && originalImage.Height > maxHeight)
        {
            newHeight = maxHeight;
            newWidth = (int)Math.Round(newHeight * aspectRatio);
        }
        Bitmap newImage = new Bitmap(newWidth, newHeight);
        using (Graphics g = Graphics.FromImage(newImage))
        {
            //--Quality Settings Adjust to fit your application
            g.InterpolationMode = System.Drawing.Drawing2D.InterpolationMode.HighQualityBilinear;
            g.SmoothingMode = System.Drawing.Drawing2D.SmoothingMode.HighQuality;
            g.PixelOffsetMode = System.Drawing.Drawing2D.PixelOffsetMode.HighQuality;
            g.CompositingQuality = System.Drawing.Drawing2D.CompositingQuality.HighQuality;
            g.DrawImage(originalImage, 0, 0, newImage.Width, newImage.Height);

            return newImage;
        }
    }

Here is the code snippet of the ASPX page.

<asp:GridView ID="SearchResults" runat="Server" AutoGenerateColumns="false" EnableViewState="false"
AllowPaging="true" PageSize="10" ondatabound="SearchResults_DataBound" >
<RowStyle CssClass="EvenRow" />
<AlternatingRowStyle CssClass="OddRow" />
<Columns>
    <asp:TemplateField meta:resourceKey="ProductThumbField">
        <ItemStyle CssClass="ProductNameColumn" />
        <HeaderStyle CssClass="ProductNameColumn" />
        <ItemTemplate>
            <asp:image id="ProductThumbImg" runat="server"  imageurl='<%# GetProductThumb(Container.DataItem) %>' Width ="60px" Height = "60px" />
        </ItemTemplate>
    </asp:TemplateField>
Was it helpful?

Solution

I found the reason I can't assign the bitmap is because the bitmap is created from system.drawing whereas asp:image is from system.web...

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top