14 Mart 2014 Cuma

Web User Control Nedir?


Asp.Net ile yerleşik (built in) şekilde gelen web kontrolleri bazı durumlarda sizin için yetersiz kalabilir.Böyle durumlarda kendi kontrolünüzü oluşturma ihtiyacı duyarsınız.Bunun için  Web User Control'ler kullanılır.
Web User Control'lerin bir diğer kullanılma amacı ise uygulamanızdaki sürekli tekrar eden işlemlerin tek bir defa tanımlanıp istediğimiz yerde kullanabilmenizi sağlamasıdır.Bu da tekrar kullanabilirlik sağlamaktadır.

Web User Control Özellikleri 

  • User Control'lerin dosya uzantıları  ".ascx "'tir.
  • Çalışabilmeleri için mutlaka bir web form'da bulunması gerekmektedir.Kendi başlarına çalıştırılamazlar.
  • Page Directive'i yerine Control isimli Directive kullanılır.
  • User Control'lere ait yeni Property ve Event'lar tanımlanabilir.

Web User Control Oluşturulması

  1.  Öncelikle bir web projesi açtık.
  2. Projenin üstüne sağ tıklayarak Add >New Item >Web > Web User Control seçip controlümüzün ismini yazıyoruz ve Add butonuna tıklıyoruz.
          Bu Web User Controlü bir örnekte uygulayalım.Örnek bir site üzerinden anlatmaya çalışacağım.



Şekilde gördüğümüz Categories kısmı hemen hemen her sayfada sağda olmaktadır.Tekrar tekrar her sayfaya Categories özelliklerini eklemek yerine sadece web user control sayfamızda tanımlıyoruz.Böylece tekrar kullanabilirlik sağlıyoruz.

Eklemiş olduğumuz web user control'e Categories'in tüm özellklerini aktardım.

Bu ekran çıktısı yukarıda yaratmış olduğumuz WebUCCategories.ascx dosyasının içeriğidir.

Şimdi de ilgili sayfalarımıza bu özelliği atayalım.Mesela ben bu özelliği anasayfa ve iletişim sayfalarımda kullanmak istiyorum.Ben önceden Masterpage oluşturup default.aspx ve iletisim.aspx adında iki sayfa oluşturmuştum.


İletişim.aspx sayfamda ilgili div in içerisine WebUCCategories.ascx dosyasına sol ile basılı tutup sürüklüyoruz. Sürüklediğimizde  <uc1:WebUCCategories runat="server" ID="WebUCCategories" /> gibi bir yazı çıkması lazım.Ekran çıktımızda da görüyoruz.

Böylece küçük örneğimizi uygulamış olduk.Tavsiyem konuyu pekiştirmek adına örnek yapmanızdır.Diğer yazılarda görüşmek üzere..




Master Page Nedir?

Master Page web formlara benzer ve ayrıca çok önemli bir özelliktir.Öncelikle neden Master page 'e ihtiyaç duyulmuştur.Bir web sitesi genel olarak header, content, menu ve footer'dan oluşur.Genel olarak fark ettiyseniz sadece sitelerin content (içerik) kısmı değişmektedir.Eğer daha önce html ve css ile uğraştıysanız her bir html sayfasına sabit olan kısımların (header, menu ve footer gibi) özelliklerini kopyalamak zorunda kalıyorduk.
Master page mantığında ise sadece bu web forma bu özellikleri atıyoruz daha sonra yaratacağımız bütün sayfalarda kullanıyoruz.Böylece istediğim web forma kullanarak daha dinamik, daha hızlı ve daha performanslı web formlar oluşturabiliyoruz.  



Genel olarak bir sitenin görünümü


Master Page Kullanarak Bir Site Oluşturmak 

Visual Studio 2012 kullanarak Master page ile basit bir web sitesi oluşturalım.Böylece Master page kullanımını öğrenmiş olacaksınız.Size önerim öncelikle Master page'i tasarlayıp daha sonra kodlamaya geçmenizdir.
Aşağıdaki adımları uygulayalım.

1-Visual Studio 2012'yi açıyoruz.

2-New Project > Asp.Net Empty Web Application seçiyoruz.Projemizi bir isim veriyoruz.

3- Projemizin üstüne gelerek sağa tıklıyoruz ordan Add > New Item > Web > MasterPage seçip masterpagemize bir isim veriyoruz.


3.İşlemin Görünümü
4-Varsayılan kodlarıyla beraber Masterpagemiz oluştu.Bu kodlarda iki şey dikkatimizi çekiyor.Birincisi dosyamızın uzantısı master türündedir.İkincisi ise ContentPlaceHolder adındaki ASP.NET kontrolleri sayfaya eklenmiştir.

Buradaki ContenPlaceHolder kontrolü bizim içerik sayfalarımızın yer alacağı kısımdır.ContenPlaceHolder dışındakiler ise tüm sayfalarda ortak olacaktır.Bizimde amacımız header,footerın ortak olması peki nereye kodlarımızı yazmalıyız.Tabi ki ContenPlaceHolder dışına yazılmalıdır.




Fark ettiyseniz head bölümünde ve body bölümünde ContentPlaceHolderlar var ve head etiketindekini bu örnekte kullanmayacağım.Body kısmına bakacak olursak header ve footerın sabit kalmasını istediğim için ContentPlaceHolder dışına yazdım.En basit haliyle master pagemiz oluştu sıra geldi, master sayfamıza içeriklerini gömmeye.

5- Pojemize sağ tıklayarak Add>New Item>ContentPage seçip sayfanın ismini default.aspx yapıyoruz.


5.İşlemin Görünümü

6- ContentPage seçip add butonuna tıkladığımızda yarattığımız master pagemizi seçip Ok tuşuna basıyoruz.
                                                

6.İşlemin Görünümü

7- default.aspx sayfamızın görünümü aşağıdaki gibidir.



Dikkatinizi çektiyse ContentPlaceHolder içerisine içeriğimizi yazıyoruz.Çünkü artık master pagemizde header ve footer sabit olup anasayfamızda veya başka isimde sayfa açarsak  fark etmez sadece içerik kısmımız değişeceği için ContentPlaceHolder içerisine yazıyoruz.

Son olarak iletisim.aspx adında bir sayfa oluşturdum.En basit şekliyle görünümünü paylaşıyorum.

Sitemizde bundan sonra ekleyeceğimiz bütün sayfalarda yukarıdaki ekran çıktısında da gördüğümüz üzere sadece sayfalarımızın içeriği değişecektir.Aynı şekilde birçok sayfa ekleyebilirsiniz.