MVC3 / Razor thumbnail / изменить размер изображения идеи? - PullRequest
15 голосов
/ 06 сентября 2011

Существует ли простой и динамичный способ создания миниатюр и изменения размера изображений в MVC3 / Razor? Помощник, библиотека, что-нибудь?

Было бы неплохо, если бы я как-то смог управлять размером изображений с контроллера. Или даже в бритве. Пример: в индексном представлении я хочу, чтобы изображения были определенного размера, но в подробном представлении я хочу, чтобы они были в полном размере.

Я знаю, что этот вопрос неопределенный, но я действительно не смог найти в google / stackoverflow ничего, кроме старого mvc1 thingos.

Как вы, ребята, обычно справляетесь с этим?

Ответы [ 4 ]

25 голосов
/ 06 сентября 2011

Существует ли простой и динамичный способ создания миниатюр и изменения размера изображения в MVC3 / Razor? Помощник, библиотека, что-нибудь?

Для этого можно использовать встроенную сборку System.Drawing и класс Image. Вы можете написать действие контроллера, которое будет передаваться в качестве аргументов имени изображения и желаемого нового размера, и это действие контроллера будет выполнять изменение размера и возвращать новый образ.

Например:

public ActionResult Thumbnail(int width, int height)
{
    // TODO: the filename could be passed as argument of course
    var imageFile = Path.Combine(Server.MapPath("~/app_data"), "test.png");
    using (var srcImage = Image.FromFile(imageFile))
    using (var newImage = new Bitmap(width, height))
    using (var graphics = Graphics.FromImage(newImage))
    using (var stream = new MemoryStream())
    {
        graphics.SmoothingMode = SmoothingMode.AntiAlias;
        graphics.InterpolationMode = InterpolationMode.HighQualityBicubic;
        graphics.PixelOffsetMode = PixelOffsetMode.HighQuality;
        graphics.DrawImage(srcImage, new Rectangle(0, 0, width, height));
        newImage.Save(stream, ImageFormat.Png);
        return File(stream.ToArray(), "image/png");
    }
}

А теперь включите это действие в вашем представлении:

<img src="@Url.Action("Thumbnail", "SomeController", new { width = 100, height = 50 })" alt="thumb" />
19 голосов
/ 26 апреля 2012

Используя WebImage класс, который входит в System.Web.Helpers.WebImage, вы можете добиться этого.

Вы можете использовать этого замечательного ребенка для вывода измененных изображений на лету.

Пример кода:

public void GetPhotoThumbnail(int realtyId, int width, int height)
{
    // Loading photos’ info from database for specific Realty...
    var photos = DocumentSession.Query<File>().Where(f => f.RealtyId == realtyId);

    if (photos.Any())
    {
        var photo = photos.First();

        new WebImage(photo.Path)
            .Resize(width, height, false, true) // Resizing the image to 100x100 px on the fly...
            .Crop(1, 1) // Cropping it to remove 1px border at top and left sides (bug in WebImage)
            .Write();
    }

    // Loading a default photo for realties that don't have a Photo
        new WebImage(HostingEnvironment.MapPath(@"~/Content/images/no-photo100x100.png")).Write();
}

В представлении у вас будет что-то вроде этого:

<img src="@Url.Action("GetPhotoThumbnail",
     new { realtyId = item.Id, width = 100, height = 100 })" />

Подробнее об этом здесь: Изменение размера изображения на лету с ASP.NETMVC


Я только что нашел этот хороший учебник о WebImage на сайте ASP.NET:

Работа с изображениями на веб-страницах ASP.NET (Бритва) Сайт .

10 голосов
/ 06 февраля 2013

Также взгляните на мой пакет nuget Simple.ImageResizer.MvcExtensions.

Демонстрационный сайт здесь: http://imageresizer.apphb.com/

Добавляет класс ImageResult, который вы можете использовать в своем действии контроллера, которое принимаетВвод высоты и ширины позволяет легко добавить изменение размера изображения на ваш сайт MVC.Хотелось бы услышать, что вы думаете

4 голосов
/ 21 сентября 2011

Для него есть библиотека - она ​​совместима с MVC3 и реализована в виде HttpModule, поэтому она имеет отличную производительность.

Это также бесплатно (хотя для некоторых плагинов требуется одноразовая лицензия разработчика или бизнеса).

Вы можете скачать его по адресу http://imageresizing.net

Хотя соблазнительно просто написать действие для него, есть много ошибок GDI, с которыми вам придется иметь дело, один, путемодин, на протяжении многих лет.Использование библиотеки освобождает вас от отслеживания и избегания их.Google "Подводные камни изменения размера изображения", первым результатом является статья, которая поможет вам написать собственную систему декодирования / изменения размера / кодирования.

...