SQL Server ASP.NET C# Kitabı

Önceki bölümde özel web kontrol geliştirmeyle ilgili giriş yapmıştık. Bu bölümle birlikte kontrol geliştirme örneklerine geçeceğiz. İlk örnek olarak Inherited Control türündeki kontrolleri işleyeceğiz.

Inherited Control
.NET Framework ile birlikte gelen ve System.Web.UI.WebControls altında bulunan bir kontrolü taban alarak geliÅŸtirilen kontrollerdir. Bunu yapmamızın nedeni var olan kontrolü özelleÅŸtirmek veya ona yeni özellikler kazandırmaktır. Bu yönteme örnek olarak web sayfalarında kullanılan “hover button” kontrolünü hazırlayacağız.

Visual Studio içinde ismi OrnekWebKontrol olacak ÅŸekilde yeni bir Class Library projesi oluÅŸturalım. Kendisinin oluÅŸturduÄŸu Class1 (Modul1 VB.NET) dosyasını silip yerine projeyi saÄŸ tıklayıp “Add » New Item” bölümünden ismi HoverButton olan bir Class dosyası ekleyelim. Bu classı ImageButton’dan inherit edilecek ÅŸekilde düzenleyelim. HoverButton, mouse üzerine gelince zemin resmi veya rengi deÄŸiÅŸen butondur. Dolayısıyla burada kontrole ait tagın içeriÄŸini oluÅŸturmaktan ziyade (ki bu içerik, ImageButton’dan gelecek) oluÅŸan elemente nitelik ekleyeceÄŸiz. Bunun için override edilecek en uygun metod, AddAttributesToRender() metodudur. System.Web.UI.WebControls.WebControl üyesi olan bu metod, render edilmiÅŸ HTML elementine attribute ekleme aÅŸamasını temsil eder. AddAttributesToRender() metodu, parametre olarak System.Web.UI.HtmlTextWriter türünde nesne alır. Bu bölümde yoÄŸun kullanacağımız HtmlTextWriter nesnesi, ASP.NET server kontrollerinin istemciye gönderilecek içeriÄŸine markup karakteri(</,/>,<,> vb.) veya herhangi bir metin eklemek için kullanılır. Bu amaçla çoÄŸu overload edilmiÅŸ geniÅŸ bir metod listesine sahiptir. ÖrneÄŸin kontrole attribute eklemek için, AddAttribute() metodu kullanılır veya doÄŸrudan stream üzerine bir metin eklemek için nesnenin yapıcı yordamları kullanılır. Bu metodları daha sonra ele alacağız.

Projeye, “System.Web” kütüphanesini referans olarak eklemeyi unutmayalım. Özel bileÅŸen geliÅŸtirirken çoÄŸu System.ComponentModel kütüphanesinde bulunan tasarıma dayalı attributeler kullanılır. Bunları detaylı göreceÄŸiz ama bu örnekte editörün “Properties” penceresinde bölümlendirme yapmak için Category isimli niteliÄŸi kullanacağız.

[HoverButton.vb]

[HoverButton.vb]
Imports System.Web.UI 'HtmlTextWriter
Imports System.Web.UI.WebControls 'ImageButton
Imports System.ComponentModel 'Category niteliÄŸi

Namespace OrnekWebKontrol

'ImageButton'dan türetilsin
Public Class HoverButton : Inherits ImageButton
    'Butonun üzerine gelince çıkacak resim için değişken tanımlıyoruz.
    Private _hoverResim As String = ""

    'Bu yerel değişkenlerin Properties penceresinden ayarlanması için property tanımlayalım. Propertynin başında kullanılan Category niteliği bu propertynin görüneceği grubu tanımlar.
    <Category("Hover Resmi")> _
    Public Property HoverResim() As String
        Get
            Return Me._hoverResim
        End Get
        Set(ByVal value As String)
            Me._hoverResim = value
        End Set
    End Property

    Protected Overrides Sub AddAttributesToRender(ByVal writer As HtmlTextWriter)
        'Eğer kullanıcı HoverResim propertysine değer girmişse.
        If _hoverResim <> "" Then
            'JavaScript ile butonun üzerine gelindiğinde(onMouseOver) veya geri çekildiğinde(onMouseOut) butonun resmini değiştireceğiz.
            Me.Attributes.Add("onMouseOver", "this.src='" & _hoverResim & "'")
            Me.Attributes.Add("onMouseOut", "this.src='" & MyBase.ImageUrl & "'")
        End If
        MyBase.AddAttributesToRender(writer)
    End Sub
End Class

End Namespace

[HoverButton.cs]

using System.Web.UI; //HtmlTextWriter
using System.Web.UI.WebControls; //ImageButton
using System.ComponentModel; //Category niteliÄŸi

namespace OrnekWebKontrol
{
//ImageButton'dan türetilsin
public class HoverButton : ImageButton
{
    //Butonun üzerine gelince çıkacak resim için değişken tanımlıyoruz.
    private string _hoverResim = "";

    /*
     Bu yerel değişkenlerin Properties penceresinden ayarlanması için property tanımlayalım. Propertynin başında kullanılan Category niteliği bu propertynin görüneceği grubu tanımlar.
     */
    [Category("Hover Resmi")]
    public string HoverResim
    {
        get
        {
            return this._hoverResim;
        }
        set
        {
            this._hoverResim = value;
        }
    }

    protected override void AddAttributesToRender(HtmlTextWriter writer)
    {
        //Eğer kullanıcı HoverResim property'sine değer girmişse.
        if (_hoverResim != "")
        {
            //JavaScript ile butonun üzerine gelindiğinde(onMouseOver) veya geri çekildiğinde(onMouseOut) butonun resmini değiştireceğiz.
            writer.AddAttribute("onMouseOver", "this.src='" + _hoverResim + "'");
            writer.AddAttribute("onMouseOut", "this.src='" + base.ImageUrl + "'");
        }
        base.AddAttributesToRender(writer);
    }//AddAttributesToRender

}//HoverButton

}//OrnekWebKontrol

Böylece basit kişisel bir kontrol geliştirmiş olduk. Konuya detaylı devam etmeden önce kontrolleri, uygulamalarda nasıl kullanacağımızı öğrenmek için deployment konusundan bahsetmek faydalı olacaktır.

Custom Kontrol’ün deploy edilmesi

GeliÅŸtirdiÄŸimiz custom kontrolleri web uygulamalarında kullanmak için kontrolü, uygulamaya referans olarak eklememiz gerekir. EÄŸer web projesi, custom kontrol projesiyle aynı solution içerisinde bulunuyorsa VS.NET 2005, custom kontrolü, otomatik olarak Toolbox’a ekler. Bu yöntem özellikle ayrıntılı kontrollerde bazen sorunlar çıkarsa da custom kontrolümüzü test etmek için en pratik yöntemdir. Bir custom kontrolü, deploy etmek için .dll dosyasının uygulamanın BIN klasörüne veya sunucunun GAC klasörüne kopyalayıp. Kontrolün Assembly’sini kullanılacak uygulamaya register etmeliyiz.

VS.NET 2005′te eÄŸer aynı Solution içinde bir web projesi oluÅŸturursak, projenin Toolbox’ında otomatik olarak HoverButton görünecektir. BaÅŸka bir Solution içindeki web projesinde bu kontrolü kullanmak için Toolbox’ı saÄŸ tıklayıp “Choose Items” menüsünü kullanarak açılan pencerede “.NET Framework Components” sekmesinde “Browse” butonu kullanılır.

Kontrolü, aspx sayfasında kullanılmak üzere sayfanın üzerine taşıdığımızda kontrolün .dll dosyası, uygulamanın BIN klasörüne kopyalanır ve HTML tarafında aşağıdaki gibi tag tanımlama satırları eklenir.

<%@ Register Assembly="OrnekWebKontrol" Namespace="OrnekWebKontrol" TagPrefix="cc1" %>
. . . . .

    

VB.NET’te aÅŸağıdaki gibi olur.

<%@ Register Assembly="OrnekWebKontrol"
Namespace="OrnekWebKontrol.OrnekWebKontrol" TagPrefix="cc1" %>
. . . . .

    

VB.NET’e özel olarak;
Namespace deÄŸerinde geçen OrnekWebKontrol ifadesinden birinci Assembly adı(Root Namespace) diÄŸeri de içinde classı yazdığımız namespace’dir. Sadece birini yazmak için ya classı namespace’siz yazarız ya da projenin property’sinden Application sekmesinde “Root namespace” alanını boÅŸ geçeriz. Fakat “bir kontrolün namespace alanı boÅŸ olmamalı” kuralından dolayı custom kontrol uygulamalarında iki seçeneÄŸi de uygulayamayız.

Sayfaya eklenmiÅŸ ilk satır, kontrolün register iÅŸlemiyle ilgilidir. Bir kontrolü, sayfamızda kullanmak için o kontrolü öncelikle projeye register etmeliyiz. Yani projeyi, bu kontrol hakkında bilgilendirmemiz gerekir. Görüldüğü gibi @ Register belirtecinde kullanılacak kontrolün register edilmesi saÄŸlanmıştır. Bu satırda kontrolün assembly bilgileri ve TagPrefix’i belirtilmiÅŸtir. Kontrolleri, kullanılacak her sayfada @ Register belirtecinde kayıt ettirmek zorundayız. Bu da zahmetli bir iÅŸ olduÄŸu için buna alternatif olarak Web.Config kullanılabilir. Bir custom kontrolü, aÅŸağıdaki yazımda gösterildiÄŸi gibi Web.Config dosyasında register edebiliriz.

[Web.Config]

Custom kontrole ait Assembly, kullanıldığı projenin BIN klasöründe bulunmalıdır. EÄŸer custom kontrol, web server üzerinde bulunan tüm web uygulamaları tarafından eriÅŸilecekse, GAC’a eklememiz daha mantıklı olur.

EÄŸer custom kontrol, web uygulamasıyla aynı solution içerisinde deÄŸilse, kontrolün .dll dosyasını sürükle-bırak iÅŸlemiyle VS.NET’in Toolbox bölümüne taşıyarak ta kontrolü kullanabiliriz.

Kontrolün ImageUrl property’sine örnek bir resim yolu girip sayfayı kaydedelim. Sayfayı bu ÅŸekilde çağırdığımızda istemci tarafında generate edilecek HTML elementi aÅŸağıdaki gibi olur.

Görüldüğü gibi sadece ImageUrl property’sini set ettiÄŸimiz için onMouseOver ve onMouseOut nitelikleri boÅŸ tanımlandı. Dolayısıyla HoverButton kontrolü, kullanıcı HoverResim propertysine deÄŸer girildiÄŸi zaman anlamlı olacaktır yoksa normal bir ImageButton’dan bir farkı olmayacaktır. EÄŸer HoverResim property’sini set edersek çıktığı aÅŸağıdaki gibi oluÅŸur.

Aynı işlemi PreRender() veya Render() metodlarında da yapabilirdik. Render() metodu, Web controlün, asıl render edildiği metoddur. Genellikle türetilmiş kontrollerde kontrol öncesi veya sonrası özel bir metin eklemek için kullanılır. Örneğin HoverButton kontrolünün bizim tarafımızdan yazıldığını HTML comment olarak istemci tarafında gönderelim. Class içinde Render() metodunu da override ederek aşağıdaki ifadeleri ekleyelim.

Public Class HoverButton : Inherits ImageButton
    . . .
    Protected Overrides Sub Render(ByVal writer As System.Web.UI.HtmlTextWriter)
        writer.Write("")
        MyBase.Render(writer)
        writer.Write("")
    End Sub
End Class

public class HoverButton : ImageButton
{
    . . .
    protected override void Render(HtmlTextWriter writer)
    {
        writer.Write("");
        base.Render(writer);
        writer.Write("");
    }
}

Bu eklemeden sonra, HoverButton, istemci tarafında aşağıdaki gibi görünecektir.