MVC3/Hình thu nhỏ dao cạo/thay đổi kích thước ý tưởng hình ảnh?

Question

Có cách nào dễ dàng và năng động để tạo hình thu nhỏ và thay đổi kích thước hình ảnh trong MVC3/Dao cạo không? Một người trợ giúp, tự do, bất cứ điều gì?

Sẽ tốt hơn nếu tôi bằng cách nào đó có thể quản lý kích thước của hình ảnh từ bộ điều khiển. Hoặc thậm chí trong razorview. Ví dụ: Trong chế độ xem chỉ mục, tôi muốn hình ảnh có kích thước nhất định nhưng trong chế độ xem chi tiết, tôi muốn hình ảnh có kích thước đầy đủ.

Tôi biết câu hỏi này là mơ hồ, nhưng tôi thực sự không thể tìm thấy bất cứ điều gì trên google/stackoverflow khác với thingos mvc1 cũ.

Các bạn thường xử lý vấn đề này như thế nào?

Answer 1

Ngoài ra hãy xem gói gói Simple.ImageResizer.MvcExtensions của tôi.

Demo trang web ở đây: http://imageresizer.apphb.com/

Thêm một lớp ImageResult mà bạn có thể sử dụng trong các hoạt động điều khiển của bạn mà phải mất một chiều cao và chiều rộng đầu vào làm cho nó khá dễ dàng để thêm hình ảnh thay đổi kích thước vào trang web MVC của bạn. Rất muốn nghe suy nghĩ của bạn

Answer 2

Có cách nào dễ dàng và năng động để tạo hình thu nhỏ và đổi kích thước hình ảnh trong MVC3/Dao cạo không? Một người trợ giúp, tự do, bất cứ điều gì?

Bạn có thể sử dụng lắp ráp System.Drawing tích hợp và lớp Hình ảnh để đạt được điều này. Bạn có thể viết một hành động điều khiển mà sẽ được thông qua như là đối số tên hình ảnh và kích thước mới mong muốn và hành động điều khiển này sẽ thực hiện thay đổi kích thước và trả về hình ảnh mới.

Ví dụ:

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"); 
    } 
} 

Bây giờ đi trước và bao gồm hành động này theo quan điểm của bạn:

<img src="@Url.Action("Thumbnail", "SomeController", new { width = 100, height = 50 })" alt="thumb" /> 

Answer 3

Có một thư viện cho nó - đó là MVC3 tương thích, và nó thực hiện như một HttpModule, vì vậy nó có hiệu suất tuyệt vời.

Nó cũng miễn phí (mặc dù một số plugin yêu cầu nhà phát triển hoặc giấy phép kinh doanh 1 lần).

Bạn có thể tải nó tại http://imageresizing.net

Mặc dù nó hấp dẫn để chỉ cần viết một hành động cho nó, có rất nhiều lỗi GDI mà bạn sẽ phải đối phó với, một, một, trong những năm qua. Sử dụng thư viện sẽ giải phóng bạn khỏi theo dõi và tránh chúng. Google "Hình ảnh thay đổi kích thước cạm bẫy", kết quả đầu tiên là một bài viết sẽ giúp đỡ nếu bạn viết riêng của bạn giải mã/thay đổi kích thước/mã hóa hệ thống.

Answer 4

Sử dụng WebImage lớp có trong số System.Web.Helpers.WebImage bạn có thể đạt được điều này.

Bạn có thể sử dụng đứa trẻ tuyệt vời này để tạo hình ảnh đã được chỉnh kích cỡ khi đang di chuyển.

Mẫu mã:

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(); 
} 

Trong một cái nhìn bạn muốn có một cái gì đó như thế này:

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

Thông tin thêm về nó ở đây: Resize image on the fly with ASP.NET MVC

---

Tôi chỉ tìm thấy này đẹp hướng dẫn về WebImage tại trang ASP.NET:

Working with Images in an ASP.NET Web Pages (Razor) Site.