Tek yaz çok kullan mantığını benimseyen ve bunu bize OOP kavramı ile aşılayan Microsoft firmasının ASP.NET içinde barındırdığı MasterPage yapısı şüphesiz birçok projemizde bizlere çok yardımcı olmuştur.
Elbette bizlere aynı kodu yeniden yazma zahmetinden kurtaran bu can simidinden ASP.NET MVC projelerinde de yararlanmaya devam edeceğiz. Ancak madem teknoloji değişti diyen Microsoft Firması MasterPage yapısını ve kullanımını da biraz değiştirmiş.
Öncelikle ASP.NET MVC projelerimizin görünüm yüzlerinin bulunduğu klasörümüzün View klasörü olduğunu yeniden hatırlayalım. Bu durumda MasterPage de bir görünüm yüzü olduğuna göre demek ki eklenecek klasör View klasörü olacaktır.
Projemize bir MasterPage ekleyebilmek için View Klasörüne sağ tuşla tıklayarak açılan menüden Add menüsününe ait alt menüden New Item seçeneğini seçtiğimizde karşımıza View Klasörümüze ekleyebileceğimiz dosya tiplerini barındıran Add New Item penceresi gelecektir.
Resim-1
Bu pencere içeriğinde MasterPage ismini barındıran MVC 4 View Master Page (ASPX) adında bir dosya tipi bulunmaktadır. İşte seni buldum diyerek eklemeyi düşünüyorsanız yanılıyorsunuz çünkü bu dosya tipi bizim MVC projelerimizde kullanacağımız dosya tipi değildir.
Nasıl değildir işte adı üstünde MasterPage yazıyor ya dediğinizi duyar gibiyim. Hemen açıklamaya geçelim.
- Bizler ASP.NET MVC projelerimizde hangi teknolojiyi kullanıyorduk?
Elbette Razor.
- Peki Razor teknolojisini kullandığımız projelerimizdeki görünüm dosyalarının uzantıları neydi?
ASPX yerine yeni teknolojiyi barındıran CSHTML
Bu durumda açılan penceredeki MasterPage dosyası parantez içine yazılmış olan ASPX açıklamasına göre eski teknolojiyi barındırmakta. Nostalji yapmayı düşünmediğimizden dolayı da şu anlık bizim işimize yaramamakta.
Peki işimize yarayan dosya tipi hangisidir?
Microsoft Firması ASP.NET MVC teknolojisine getirdiği Razor yapısı ile kullanılan MasterPage dosyasına ait yapıyı da değiştirdiğini yukarıda belirtmiştim. Yapı değişti kullanım değişti e tabi ismi de değişti ve ASP.NET projelerimizde Razor teknolojisi bünyesinde kullanılan MasterPage lerin yeni ismi Layout oldu.
Not: Layout tipindeki dosyalarımızın içeriği standart View dosyalarına ve bir sonraki makale konumuz olan Partial View dosyalarına benzediğinden dolayı isimlendirme işleminde standartlar gereği alt çizgi ile başlaması projenin farklı yazılımcılar tarafından kolay anlaşılabilmesini sağlamaktadır.
Add New Item penceresinden MVC 4 Layout Page (Razor) dosya tipini seçtikten sonra Add butonuna basarak View klasörümüze Layout dosyasını eklediğimizde karşımıza Layout dosyasına ait içerik gelmektedir.
Resim-2
Bu içerikte yeni karşılaştığımız RenderBody() komutu dikkatimizi çekmektedir. Peki ne işe yarar bu RenderBody() komutu?
RenderBody() komutu eski tip MasterPage yapısında bulunan ContentPlaceHolder kontrolünün Razor teknolojisi bünyesinde ki kullanımıdır. Yani MasterPage sayfamızı referans olarak alan View sayfalarına ait içeriğin gösterim anında basılacağı yerdir.
Şimdi projemize HomeController adında bir Controller ekledikten sonra Controller’imize ait Index adlı ActionResult tipindeki metodumuzun üzerinde sağ click yaparak açılan Add View seçeneğini seçelim.
Resim-3
Add View seçeneğini seçtiğimizde karşımıza Controllerimize ait View eklememizi sağlayan Add View penceresi gelecektir.
Resim-4
Bu pencere üzerinde bulunan “Use a layout or master page:” e ait checkboxı işaretleyerek View’ımızın bir MasterPage’i referans aldığını belirtiyoruz. Ardından aç butonuna (üçnokta) tıklayarak View’ımızın referans alacağı Layout sayfamızı seçiyoruz.
Resim-5
Layout sayfamızı seçtikten sonra OK butonuna tıklayarak yeniden karşımıza gelen Add View penceresinden Add butonuna tıkladığımızda artık layout sayfasından referans almış olan View sayfamız oluşturulmuş oluyor.
Resim-6
Artık View sayfamıza ait tasarım layout sayfamızdaki tasarımın RenderBody() metodunun bulunduğu yere eklenecek ve iki sayfanın tasarımı aynı anda görüntülenecektir.
Hemen test edebilmek için layout sayfamıza ait kodlarımızı
Resim-7
şeklinde değiştirdikten sonra View’imize ait kodlarımızı da
Resim-8
Şeklinde değiştirerek projemizi çalıştıralım.
Projemizi çalıştırdığımızda karşımıza aşağıdaki ekran görüntüsü gelecektir.
Resim-9
Bu makalemizde klasik ASP.NET Web projelerinde kullandığımız MasterPage yapısının ASP.NET MVC mimarisi içindeki karşılığı olan layout sayfa yapısını ve Razor teknolojisi içerisinde nasıl kullanıldığını inceledik.
Bir sonraki makalemizde ASP.NET MVC Framework projelerinde User Control kullanımını inceleyeceğiz.
Bu konuyla ilgili sorularınızı alt kısımda bulunan yorumlar alanını kullanarak sorabilirsiniz.
Referanslar
Çok başarılı bir makale hocam.. devamını bekliyoruz.
Verdiğiniz bilgiler için çok teşekkürler bi sorum varda bir Razor master page’inde(layout) birden fazla düzenlenebilir alan oluşturmak istersek ne yapmalıyız? Birden fazla @RederBody() yazarsak “@RederBody() zaten tanımlanmış” hatası alıyoruz.