Cómo agrandar la imagen al tamaño normal en ASP.NET 2.0

Question

• Mis usuarios cargan una imagen y la imagen se guarda en mi base de datos del servidor SQL
• Mis usuarios ven la imagen en la página en un Image WebControl normal con un tamaño de 150 px por 150 px - se puede encontrar un ejemplo http://www.erate.co.za/CompanyProfile.aspx?ID=112 : la bandera de EE. UU. es la imagen de la que estoy hablando.

Si el usuario sube una imagen de 300px por 200px, la imagen se verá divertida en mi cuadro de imagen estática de 150px por 150px. ¿Alguna idea de cómo puedo mostrar la imagen para que no se vea borrosa?

Además, ¿cómo puede tener alguna forma de ventana emergente que aparecerá en la pantalla, mostrando el tamaño real de la imagen de la base de datos cuando el usuario hace clic en la imagen de 150px por 150px.

Nota: No quiero que el tamaño estático de la imagen aumente, ya que esto arruinará totalmente el diseño y el aspecto de mi página. Debe ser alguna forma de ventana emergente o algo así. Algo que he visto antes, creo que fue realmente genial. El usuario hizo clic en la imagen pequeña y luego apareció una ventana emergente en el medio de la pantalla con el tamaño real de la imagen y todo lo que estaba en la página se deshabilitó hasta que el usuario hizo clic en el botón Cerrar. ¿Se puede hacer esto en ASP.NET 2.0? ¿O algo así?

Saludos Etienne

Answer 1

Use miniaturas de un ancho / alto fijo.

Cambia el tamaño de las imágenes reales (como están almacenadas en la base de datos) sobre la marcha.

Por lo tanto, el tamaño de su miniatura siempre es de 150 px por 150 px. Las imágenes reales (ancho / alto) almacenadas en la base de datos variarían.

Comienza mostrando la lista de miniaturas redimensionadas que muestran la imagen completa en la ventana emergente cuando hace clic en el elemento en miniatura.

Código para 'en miniatura' una imagen:

        byte[] getResizedImage(String path, int width, int height)
        {
            try
            {
                Bitmap imgIn = new Bitmap(path);

                //Scale
                double y = imgIn.Height;
                double x = imgIn.Width;
                double factor = 1;
                if (width > 0)
                {
                    factor = width / x;
                }
                else if (height > 0)
                {
                    factor = height / y;
                }

                System.IO.MemoryStream outStream = new System.IO.MemoryStream();
                Bitmap imgOut = new Bitmap((int)(x * factor), (int)(y * factor));
                Graphics g = Graphics.FromImage(imgOut);
                g.Clear(Color.White);
                g.DrawImage(imgIn, new Rectangle(0, 0, (int)(factor * x), (int)(factor * y)), new Rectangle(0, 0, (int)x, (int)y), GraphicsUnit.Pixel);
                imgOut.Save(outStream, ImageFormat.Jpeg);

                return outStream.ToArray();

            }
            catch (Exception)
            {
...
            }

        }

Este ejemplo usa una imagen .jpg en el sistema de archivos del servidor web, pero se puede ajustar para atender cualquier imagen / tipo almacenado en la base de datos.

Mooi bly.

Editar: ImageFormat fijo

Answer 2

Vea este ejemplo de una ventana emergente modal;

http://www.asp.net/ajax/ajaxcontroltoolkit /samples/modalpopup/modalpopup.aspx