2010-12-26 17 views
6

¿Alguien sabe cómo usar la nueva ASP.Net MVC 3 Html Helper WebImage para recortar un archivo cargado en un cuadrado? Me gustaría tenerlo centrado si es posible. He estado golpeándome la cabeza durante las últimas horas tratando de resolver esto ... cualquier ayuda es apreciada!WebImage Crop To Square

El escenario es bastante simple, el usuario puede cargar una imagen, la imagen se redimensionará a un cuadrado para usarla más tarde como una miniatura en el sitio.

+0

Hay algunos buenos ejemplos aquí - http://weblogs.asp.net/gunnarpeipman/archive/2010/10/15/asp-net-mvc-3-beta-simple-image-manipulations-using- webimage-helper.aspx –

+0

@Dan Atkinson - sí, he visto esos ejemplos, pero mi problema es recortar a un cuadrado (e intentar centrar). –

Respuesta

13

Esto funcionó para mí, espero que ahorre tiempo para otros ...!

private static void CropImage (HttpPostedFileBase sourceImage) { 
    var newImage = new WebImage(sourceImage.InputStream); 

    var width = newImage.Width; 
    var height = newImage.Height; 

    if (width > height) { 
    var leftRightCrop = (width - height)/2; 
    newImage.Crop(0, leftRightCrop, 0, leftRightCrop); 
    } 
    else if (height > width) { 
    var topBottomCrop = (height - width)/2; 
    newImage.Crop(topBottomCrop, 0, topBottomCrop, 0); 
    } 

    //do something with cropped image... 
    //newImage.GetBytes(); 
} 
3

Sugiero usar Jquery image crop plugin. Porque creo que no es bueno recortar cuadrados automáticamente porque puedes quitar la parte principal de la imagen, por ejemplo, si la foto del usuario puedes recortar su cabeza.

Image crop plugin es fácil de usar. El usuario que acaba de seleccionar es el que quiere usar como vista previa. En el lado del servidor, usted recibe las coordenadas del punto de inicio y el ancho/alto. Para redimensionar/recortar imagen en el lado del servidor, uso image magick. Hay wrapper for image magick at .net. También tenga cuidado con el envoltorio porque solo tiene 32 bits. He desarrollado para mis necesidades el envoltorio propio para la imagen mágica. Pero creo que puede ser fácil de hacer con .net.

Si sigues creyendo que el autocultivo es lo que necesitas, te sugiero que recortes el máximo centro de squere de la imagen y que realices el tamaño que desees.

Espero que esta ayuda.

P.S. No lo sé, pero supongo que esa tarea no se puede hacer usando mvc WebImage.

+0

+1 por mencionar a Jcrop. http://code.google.com/p/jcrop/ –

+0

gracias, he investigado jcrop, pero trato de hacer esto de la mejor manera posible. Soy consciente de que cortar puede causar un recorte involuntario pero funcionará la mayoría de las veces si está centrado. –

3

aquí hay una pequeña función que recorta la imagen desde el centro, pero manteniendo la proporción deseada. Lo uso para recortar imágenes para galerías y tal.

public static WebImage BestUsabilityCrop(WebImage image, decimal targetRatio) 
    { 
     decimal currentImageRatio = image.Width/(decimal) image.Height; 
     int difference; 

     //image is wider than targeted 
     if (currentImageRatio > targetRatio) 
     { 
      int targetWidth = Convert.ToInt32(Math.Floor(targetRatio * image.Height)); 
      difference = image.Width - targetWidth; 
      int left = Convert.ToInt32(Math.Floor(difference/(decimal) 2)); 
      int right = Convert.ToInt32(Math.Ceiling(difference/(decimal) 2)); 
      image.Crop(0, left, 0, right); 
     } 
     //image is higher than targeted 
     else if (currentImageRatio < targetRatio) 
     { 
      int targetHeight = Convert.ToInt32(Math.Floor(image.Width/targetRatio)); 
      difference = image.Height - targetHeight; 
      int top = Convert.ToInt32(Math.Floor(difference/(decimal) 2)); 
      int bottom = Convert.ToInt32(Math.Ceiling(difference/(decimal) 2)); 
      image.Crop(top, 0, bottom, 0); 
     } 
     return image; 
    }