Kullanıcı Kontrollerine Giriş
Kullanıcı kontrolleri, bize bir ASP.NET sayfasını, diğer bir sayfada tek satır kodla kullanma imkanı tanıyor. Ama onları bu sözle geçiştirmek, haksızlık olur. Detaylar, yazımızda.
07.07.2002
Bir web sitesini oluşturan sayfalar arasında, ortak kullanılan
kodların, arabirim parçalarının olması kaçınılmazdır. Mesela, site
içinde dolaşımı sağlayan bir menü,
yaygın olarak tüm sayfalarda aynı şekilde görüntülenir. Veya, siteyi
kimliklendiren bir logo da aynı şekilde tüm sayfalarda kullanılmak
istenebilir. Bu gibi durumlarda, her sayfaya tek tek bu kod parçalarını
eklemek en ilkel yol olacaktır. Çünkü bu kısımlarda yapılacak herhangi
bir değişiklik için, sitedeki tüm sayfaların değişmesi gibi zahmetli
bir zorunluluk doğacaktır.
HTML kodlarının arasında SSI (Server Side Includes)
yönergeleri kullanılarak sunucu üzerinde farklı dosyaların kapsanması
sağlanmıştı. Bu yönergeleri içeren dosyalar, statik HTML dosyalarından
farklı olarak
.shtml uzantısıyla saklanıyor. Bu SSI yönergelerinden en çok bilinen ve bizim de konumuz olan yönerge Include. Include yönergesinin yazım şekli şöyle:
| Include Yönergesi Kullanım Şekli | |
<!--#INCLUDE FILE="../common/sabitler.inc"--> <!--#INCLUDE VIRTUAL="/mySite/common/sabitler.inc"--> | |
Include yönergesinin kullanımını ASP ve ASP.NET de destekliyor. Rahatlıkla kullanabilirsiniz. Ama bu yöntemin bizi kısıtladığı noktalar var:
Include direktifinin, sayfada diğer sunucu taraflı komutlardan önce çalışması. Programatik olarak bi dosyayı Include yönergesiyle içermenin münkün olmayışı. Kapsanmak istenen dosyaya parametre göndermenin zor oluşu. Kapsanan dosyalara erişimin dosya yolunu yazarak mümkün oluşu. (.asp uzantısı kullanılmadığı zaman, kaynak kodun görüntülenme riski)
ASP.NET'in getirdiği tüm yenilikler gibi Kullanıcı Kontrolleri de, Microsoft'un yaşanan sorunlara iyi odaklandığını gösteriyor. Bahsettiğimiz tüm kısıtlamalar, Kullanıcı Kontrollerinin esnek mekanizması ile ortadan kalkıyor.
Ve İşte Kullanıcı Kontrolleri
Kullanıcı Kontrolleri (User Controls) .aspx sayfalarında deklare edilip kullanılmak üzere oluşturulan özel ASP.NET sayfalarıdır. Bir ASP.NET sayfası kolaylıkla bir kullanıcı kontrolüne dönüştürülebilir. Çünkü tek fark uzantıları ve varsayılan ön-işlemci yönergesidir.- Bir web formu sayfası .aspx uzantısıyla, bir kullanıcı kontrolü .ascx uzantısıyla saklanır.
- Bir web formundaki Page ön-işlemci yönergesi, kullanıcı kontollerinde Control olarak kullanılır.
Şimdi basit bir örnekle kullanıcı kontrolleri dünyasına girelim. Diğer sayfalarda kullanacağımızı varsaydığımız bir menu kontrolü yapacağız. Kontrolü menu.ascx adında bir dosya olarak kaydediyoruz.
| menu.ascx | |
<a href="sayfa1.aspx">Sayfa1</a> | <a href="sayfa2.aspx">Sayfa2</a> | <a href="sayfa3.aspx">Sayfa3</a> | |
Evet, bu kadar basit. Bu kontrolümüzde basitlik için sadece statik HTML içeriği kullandık. Şimdi bunu bir .aspx sayfasına nasıl katacağımızı görelim:
| sayfa.aspx | |
<%@ Register TagPrefix="Sitemiz" TagName="IlkKontrolumuz" Src="menu.ascx" %> <html> <body> <Sitemiz:IlkKontrolumuz ID="ilkKontrol" Runat="Server"/> </body> </html> | |
Kullanıcı kontrolünü sayfamızda kullanabilmek için ilk satırda, Register ön-işlemci yönergesiyle kontrolün yolunu ve sayfada diğer etiketlerden ayrılmasını sağlayan TagPrefix ve TagName özelliklerini belirtiyoruz.
- Src özelliğinde .ascx uzantılı kullanıcı kontrol dosyasının bağıl veya kesin yolunu yazıyoruz.
- TagPrefix ve TagName özelliği kontrolümüz için ayırıcı bir etiket tanımlamamızı sağlıyor. Kontrolümüz sayfa içerisinde deklare ederken etiket isminde bu iki özelliği ( TagPrefix:TagName ) kullanıyoruz. TagPrefix kontrol için bir ad uzayı (namespace) oluşturmamızı sağlıyor. Bu önek, farklı kontrolleri farklı uzaylar içerisinde aynı TagName özelliği ile tanımlamamızı mümkün kılıyor. Unutmamak gerek ki, TagPrefix:TagName ikilisi, bir sayfada sadece bir kontrol için kayıt edilebilir. İkinci bir kontrol için aynı ikiliyi kayıt etmeye çalışırsanız, Parser Error alırsınız.
Kontrolümüzü kayıt etmek, ilk adımdı. Kayıt edilmiş kontrolümüzden bir örneği sayfa içerisine yerleştirmek için aşağıdaki bildirimi kullandık:
<Sitemiz:IlkKontrolumuz ID="ilkKontrol" Runat="Server"/> |
- Etiket tanımında, yukarıda kayıt ederken belirttiğimiz TagPrefix:TagName ikilisini kullandığımıza dikkat edin.
- ID niteliğini kullanmayabilirsiniz. Ancak programatik olarak erişebilmek için belirtmelisiniz.
- Runat="Server" ise sihirli bir ifade. Tüm sunu taraflı kontrollerde olmak zorunda. Bu özelliği belirtmezseniz, ASP.NET, bu etikete statik HTML muamelesi yapacaktır.
sayfa.aspx
Yukarıda ilk kullanıcı kontrolümüzü oluşturduk. Ama farkındaysanız, aynı işi Include yönergesi ile yapabilirdik. Çünkü hiç bir parametreye göre şekillenmeyen, sadece statik HTML metni içeren bir kontrol yazdık. Ancak şimdi dışarıdan özelliklerine erişebileceğimiz bir kontrol yazacağız. Herşeyden önce, bir kullanıcı kontrolünün de özel bir ASP.NET sayfası olduğunu unutmamalıyız. Aynı şekilde sunucu taraflı kod bloğu oluşturup, aynı şekilde fonksiyonlar, özellikler ve sınıflar tanımlayabiliriz.
| kontrol2.ascx | |
<%@ Control Language="VB" %> <Script Runat="Server"> Public Metin As String = "Varsayılan Metin" Public ArkaPlanRengi As String = "#33CCFF" Public FontBoyutu As String = "15" </Script> <div Style="Background-Color: <%= ArkaPlanRengi %>; Font-Size: <%= FontBoyutu %>px"><%= Metin %></div> | |
kontrol2.ascx, üç tane Public alan tanımlıyoruz. Kontrolü içereceğimiz sayfadan bu özelliklere erişebilmemiz için onları Public erişimli kılmalıyız. Bu özellikleri kullanarak aşağıda deklare ettiğimiz Div etiketinin style özelliğini ve göstereceği metni belirleyeceğiz. Ayrıca değişkenlere ilk değerler verildiğine de dikkat edin.
Şimdi bu kontrolü kullanan bir istemci sayfa yazalım. Kontrolümüzü sayfa içerisinde iki kere kullanacağız. İlkinde hiç değer atamadan, ikincisinde ise üç özelliğe de değer atayarak...
| sayfa2.aspx | |
<%@ Register TagPrefix="Sitemiz" TagName="Kontrol2" Src="kontrol2.ascx" %> <html> <title>.</title> <body> <Sitemiz:Kontrol2 ID="kontrol1" Runat="Server"/> <br> <Sitemiz:Kontrol2 ArkaPlanRengi="yellow" FontBoyutu="19" Metin="Yeni Metin" ID="kontrol2" Runat="Server"/> </body> </html> | |
sayfa2.aspx'in çalışır hali
Kullanıcı kontrolünün özelliklerine, onları tanımladığımız etiketin nitelikleriymiş gibi ulaşabildiğimizi görüyorsunuz. Ancak bir alternatif yol daha var: Programatik olarak ulaşmak. Yukarıdaki sayfayı yeniden yazalım:
| sayfa2.aspx | |
<%@ Register TagPrefix="Sitemiz" TagName="Kontrol2" Src="kontrol2.ascx" %> <Script Runat="Server"> Sub Page_Load (s As Object, E As EventArgs) kontrol2.ArkaPlanRengi = "yellow" kontrol2.FontBoyutu = "19" kontrol2.Metin = "Yeni Metin" End Sub </Script> <html> <title>.</title> <body> <Sitemiz:Kontrol2 ID="kontrol1" Runat="Server"/> <br> <Sitemiz:Kontrol2 ID="kontrol2" Runat="Server"/> </body> </html> | |
Yukarıdaki kodla da aynı sonucu elde edeceğiz. Burdaki fark, kontrole özelliklerinin deklaratif olarak bildirilmesi yerine, sayfanın kod bloğunda programatik olarak belirlenmesi. Kontrolü deklare ederken verdiğimiz ID özelliğini, ona kod bloğundan ulaşmak için nesne adı olarak kullandığımıza da dikkat edin.
Son olarak da bir kullanıcı kontrolünü çalışma zamanında (runtime) nasıl ekleyebileceğimizi görelim. Aşağıdaki sayfamız, yine kontrol2.ascx i kullanacak. Ama kontrolün sayfaya dahil edilmesi kod bloğunda, LoadControl() metodu ile gerçekleşiyor. Parametre olarak .ascx dosyanın yolunu veriyoruz. Kontrolü sayfada istediğimiz noktaya yerleştirebilmek için bir yer tutucu kontrol kullanıyoruz.
| sayfa3.aspx | |
<Script Runat="Server"> Sub Page_Load (s As Object, E As EventArgs) Dim uCtrl As UserControl uCtrl= LoadControl( "kontrol2.ascx" ) YerTutucu.Controls.Add( uCtrl ) End Sub </Script> <html> <title>.</title> <body> <asp:PlaceHolder ID="YerTutucu" Runat="Server" /> </body> </html> | |
Ve görüntü:
