Question

I have a question about how should I handle image files of various sizes (<1 mb upto 15mb) within a mobile application that I am developing? Currently, I am displaying the image full size using a ASHX file inside of an ASP Win Form using the ASP Image Class.

So basically what I would like to know how should I go about dealing with these sometimes vastly different image sizes.

Thanks in advance!

Update

Ok, after the very helpful comments yesterday I did some further research and I think I may have come up with a plan of action but I am still not 100%. Would copying the image to be displayed and then scaling it on the server to whatever dimensions I decide and then displaying it in the browser be a better way of “handling” images especially in an mobile browser?

Thank you all in advance for your CONSTRUCTIVE answers!

Answer 1

Ok, I found a possible solution here

Here is the code on my ASHX file:

Imports System.Drawing
Imports System.Drawing.Drawing2D
Imports System.Drawing.Imaging
Imports System.Web

Namespace WebApplication2
    ''' <summary>
    ''' Summary description for ImageDisplay
    ''' </summary>
    Public Class ImageDisplay
        Implements IHttpHandler

        Public Sub ProcessRequest(context As HttpContext) Implements IHttpHandler.ProcessRequest

            context.Response.ContentType = "image/jpeg"

            Dim bmp As New Bitmap(HttpContext.Current.Server.MapPath("~/Images/DSC_0165.jpg"))

            Dim i As Image = FixedSize(bmp, 300, 300)
            i.Save(HttpContext.Current.Server.MapPath("~/Images/DSC_0165-r.jpg"), ImageFormat.Jpeg)
            i.Dispose()

            context.Response.WriteFile("~/Images/DSC_0165-r.jpg")
        End Sub

        Public ReadOnly Property IsReusable() As Boolean Implements IHttpHandler.IsReusable
            Get
                Return False
            End Get
        End Property

        Private Shared Function FixedSize(imgPhoto As Image, Width As Integer, Height As Integer) As Image
            Dim sourceWidth As Integer = imgPhoto.Width
            Dim sourceHeight As Integer = imgPhoto.Height
            Dim sourceX As Integer = 0
            Dim sourceY As Integer = 0
            Dim destX As Integer = 0
            Dim destY As Integer = 0

            Dim nPercent As Single = 0
            Dim nPercentW As Single = 0
            Dim nPercentH As Single = 0

            nPercentW = (CSng(Width) / CSng(sourceWidth))
            nPercentH = (CSng(Height) / CSng(sourceHeight))
            If nPercentH < nPercentW Then
                nPercent = nPercentH
                destX = System.Convert.ToInt16((Width - (sourceWidth * nPercent)) / 2)
            Else
                nPercent = nPercentW
                destY = System.Convert.ToInt16((Height - (sourceHeight * nPercent)) / 2)
            End If

            Dim destWidth As Integer = CInt(Math.Truncate(sourceWidth * nPercent))
            Dim destHeight As Integer = CInt(Math.Truncate(sourceHeight * nPercent))

            Dim bmPhoto As New Bitmap(Width, Height, PixelFormat.Format24bppRgb)
            bmPhoto.SetResolution(imgPhoto.HorizontalResolution, imgPhoto.VerticalResolution)

            Dim grPhoto As Graphics = Graphics.FromImage(bmPhoto)
            grPhoto.Clear(Color.White)
            grPhoto.InterpolationMode = InterpolationMode.HighQualityBicubic

            grPhoto.DrawImage(imgPhoto, New Rectangle(destX, destY, destWidth, destHeight), New Rectangle(sourceX, sourceY, sourceWidth, sourceHeight), GraphicsUnit.Pixel)

            grPhoto.Dispose()
            Return bmPhoto
        End Function

    End Class
End Namespace

and the code on my Default.aspx form:

<%@ Page Title="Home Page" Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true"
    CodeBehind="Default.aspx.cs" Inherits="WebApplication2._Default" %>

<asp:Content ID="HeaderContent" runat="server" ContentPlaceHolderID="HeadContent">
</asp:Content>
<asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent">
    <h2>
        Welcome to ASP.NET!
    </h2>
    <p>
        To learn more about ASP.NET visit <a href="http://www.asp.net" title="ASP.NET Website">www.asp.net</a>.
    </p>


    <asp:Image ID="MainImage" runat="server" ImageUrl="~/ImageDisplay.ashx" />


    <p>
        You can also find <a href="http://go.microsoft.com/fwlink/?LinkID=152368&amp;clcid=0x409"
            title="MSDN ASP.NET Docs">documentation on ASP.NET at MSDN</a>.
    </p>
</asp:Content>

and here is how a 9mb (2848×4288) picture is displayed: