در این مقاله کوتاه با ایجاد یک Helper برای سفارشی سازی و نمایش تصاویر در Asp.Net MVC آشنا خواهیم شد و از این طریق می توان کنترل های دیگری را نیز به صورت سفارشی ایجاد کرد.

در این مقاله کوتاه و کاربردی در ابتدا با ایجاد یک Html Helper سفارشی برای نمایش تصاویر استفاده خواهیم کرد و سپس می توانیم از تعمیم آن بر روی سایر کنترل ها و عناصر استفاده کرد و سپس Html Helper های سفارشی و مورد نظر خود را ایجاد و در پروژه های مختلف از آن ها بهره ببرید.

امید است از این مقاله بهره کافی را ببرید.

برای ایجاد یک Html Helper اختصاصی به منظور نمایش تصویر باید از یک کلاس برای مدیریت و نسبت دادن ویژگی های اصلی یک تصویر استفاده کرد ، این ویژگی ها عبارتند از : 

src
alt
class

همچنین می توانیم از یک تصویر پیش فرض در صورتی که آدرس تصویر منطبق نباشد استفاده کنیم.
حال با دستور File.Exists بررسی میکنیم که آیا تصویر وجود دارد یا خیر در صورت وجود تصویر که آن را نمایش و در صورت عدم وجود دستور پیش فرض را نمایش می دهیم.

برای تعریف و استفاده از یک Helper سفارشی شده از یک متد Static استفاده می کنیم.نام متد را برابر با Image و نوع خروجی آن را از نوع MvcHtmlString قرار می دهیم.

کد زیر به ایجاد یک Helper می انجامد : 
 

public static MvcHtmlString Image(this HtmlHelper helper, string src, string alt,string cssclass)
{
  var builder = new TagBuilder("img");
  UrlHelper urlHelper = new UrlHelper(helper.ViewContext.RequestContext);
  if (!File.Exists(helper.ViewContext.HttpContext.Server.MapPath(src)))
    src = urlHelper.Content("~/content/images/none-image.png");
  else
    src = urlHelper.Content(src);

  builder.MergeAttribute("src", src);
  builder.MergeAttribute("alt", alt);
  builder.MergeAttribute("class", cssclass);
  return MvcHtmlString.Create(builder.ToString(TagRenderMode.SelfClosing));
}

برای استفاده از این Helper نیز از دستور زیر که برای فراخوانی یک Helper استفاده می شود استفاده می کنیم.

@Html.Image(Model.Image ,"alt text","img")

دقت داشته باشید در صورتی که بخواهید از تصویر پیش فرض استفاده کنید. باید Image را null قرار داده و سپس از Helper استفاده کنید.

 @Html.Image(Model == null ?"": Model.Image ,"Alt text","img")