Makale Özeti

Makalenin birinci bölümünde bir sunucu kontrolünü veya kullanıcı kontrolü kullanarak web part oluşturmayı gördük. Bu bölümde ise farklı bir web part oluşturma yöntemi göreceğiz.

Makale

.NET 2.0 ile birlikte uygulama geliştiricilerin kullanımına sunulan Web part Framework’u yakından incelemeye devam ediyoruz.

Özelleştirilebilir bir Web Part Oluşturmak

Makalenin birinci bölümünde bir sunucu kontrolünü veya kullanıcı kontrolü kullanarak web part oluşturmayı gördük. Bu bölümde ise farklı bir web part oluşturma yöntemi göreceğiz. Bir custom control kullanarak.. Custom control kullanarak web part için istediğimiz görsel tasarımı kullanma esnekliğine sahip olabiliriz ancak daha önemlisi, webPart sınıfını inherit ederek, webpart’ın bir dosyaya export edilebilmesi gibi normalde mümkün olmayan bazı işlemleri gerçekleştirebiliyor olmamız. Aynı zamanda her bir kullanıcı için ayrı ayrı özelleştirilebilen bir web part oluşturma konusunu ele almış olacağız.

Bu bölümde, bir önceki bölümde hazırlamaya başladığımız projeyi kullanarak çalışmaya devam edeceğiz. Web Control Library proje şablonu custom web control oluşturmamızı sağlar. Bu bölümde, bir custom web controlü, webpart’a dönüştürerek, oluşturduğumuz webpart üzerinde çalışacağız. Custom controlümüz bir çeviri web servisini kullanarak İngilizce kelimeleri Fransızca’ya çevirecek. Kontrol aynı zamanda çevrilen son kelimeyi kaydedecek, böylece kullanıcı sayfaya bir daha girdiğinde son kelime yeniden görüntülenecek.

  1. İlk olarak solution’a bir Web Control Library ekliyoruz. (File à Add à New Project à Web Control Library)
  2. Oluşan Web Control Library projesine bir web referansı (http://www.webservicex.com/TranslateService.asmx?WSDL) ekliyoruz.
  3. Oluşan WebCustomControl1.vb dosyasını TranslationWebPart.vb şeklinde yeniden isimlendiriyoruz.
  4. TranslationWebPart.vb dosyasında gelen standart kodları, aşağıdaki kodlarla değiştiriyoruz..

Imports System.ComponentModel

Imports System.Web.UI

Imports System.Web.UI.WebControls

Imports System.Web.UI.WebControls.WebParts

 

Public Class TranslationWebPart

    Inherits WebPart

 

    Private pStrText As String = Nothing

    Private txtStringToTranslate As TextBox

 

    Private lblTranslatedString As Label

 

    Public Sub New()

        Me.AllowClose = True

    End Sub

 

    <Personalizable(), WebBrowsable()> _

    Public Property strToTranslate() As String

        Get

            Return pStrText

        End Get

        Set(ByVal value As String)

            pStrText = value

        End Set

    End Property

 

    Protected Overrides Sub CreateChildControls()

        Controls.Clear()

 

        ' textbox görüntüle

        txtStringToTranslate = New TextBox()

        txtStringToTranslate.Text = Me.strToTranslate

        Me.Controls.Add(txtStringToTranslate)

 

        ' button görüntüle

        Dim btnTranslate As New Button()

        btnTranslate.Text = "Translate"

        AddHandler btnTranslate.Click, AddressOf Me.btnTranslate_Click

        Me.Controls.Add(btnTranslate)

 

        ' label görüntüle

        lblTranslatedString = New Label()

        lblTranslatedString.BackColor = _

          System.Drawing.Color.Yellow

        Me.Controls.Add(lblTranslatedString)

        ChildControlsCreated = True

    End Sub

 

    Private Sub btnTranslate_Click(ByVal sender As Object, _

                             ByVal e As EventArgs)

        ' çevrilmiş kelimeyi görüntüle

        If txtStringToTranslate.Text <> String.Empty Then

            Me.strToTranslate = txtStringToTranslate.Text

            txtStringToTranslate.Text = String.Empty

 

            ' web servisi erişimi

            Dim ws As New Tws.TranslateService

        lblTranslatedString.Text = "<br/>" & Me.strToTranslate & "-->" & _

        ws.Translate(Tws.Language.EnglishTOFrench, _

        Me.strToTranslate)

        End If

    End Sub

End Class

  1. Oluşturduğumuz webPart kullanıcıların İngilizce kelimeleri Fransızca’ya çevirmelerini sağlayacaktır.
  2. Custom Control’ü kullanmak için custom controlü DLL olarak compile etmemiz gerekmektedir. Bunu yapmak için Solution içindeki TranslationWebPart projesini sağ tıklayarak menüden Build komutunu veriyoruz.
  3. Artık oluşturduğumuz yeni kontrolü kullanmaya başlayabiliriz. Şimdi bir önceki bölümde oluşturduğumuz Default.aspx dosyasına geri dönüyoruz.
  4. Kontrolü kullanabilmek için ilk olarak toolbox’a eklememiz gerekiyor. Bunu yapmak için Toolbox’ın Standart sekmesini sağ tuşla tıklayarak Choose Items komutunu tıklıyoruz.
  5. Açılan diyalogda Browse komutunu tıklayarak oluşturduğumuz TranslationWebpart.dll dosyasını seçerek diyaloğu kapatıyoruz. Artık TranslationWebPart kontrolü toolbox’taki yerini alıyor.
  6. Kontrolü sayfaya ekleyeceğimiz üçüncü WebPartZone’a sürükleyerek bırakıyoruz.
  7. Hemen Source View ekranına geçerek aşağıdaki kodu
    <cc1:TranslationWebPart ID="TranslationWebPart1" runat="server" />
    aşağıdaki şekilde değiştiriyoruz..
    <cc1:TranslationWebPart ID="TranslationWebPart1" title="En-Fr Çeviri" runat="server" />
  8. Şu anda Default.aspx sayfasının tasarım aşaması görünümü aşağıdaki gibidir..
  9. Artık yapmamız gereken tek şey F5 tuşuna basmak..
  10. İşte sonuç..

Adım adım..

Aslında yaptığımız sadece yeni bir custom web part kontrolü geliştirmekten başka bir şey değildi.. strToTranslate özelliğini inceleyecek olursak iki özniteliğe sahip olduğunu görürüz.

    <Personalizable(), WebBrowsable()> _

    Public Property strToTranslate() As String

        Get

            Return pStrText

        End Get

        Set(ByVal value As String)

            pStrText = value

        End Set

    End Property

Personalizable özniteliği web part içindeki bilgilerin kullanıcı bazında özelleştirilebilmesini sağlar. Personalizable özniteliği için iki scope vardır: User (varsayılan seçenek) ve Shared. Bu örnekte kişiselleştirme için varsayılan scope olan user’ı kullandık. Örneğimizde kullanıcının yaptığı her arama kaydediliyor ve kullanıcı sayfaya yeniden geldiğinde kelimeyi hatırlıyor.

Diğer scope olan Shared ise yine bilgileri kaydeder ancak kullanıcı bazlı olarak değil, tüm kullanıcılara açık olarak görüntüler. Shared Personalization kullanmak için Personalizable özniteliğinde PersonalizationScope.Shared enumeratörünü kullanmamız gerekir.

    <Personalizable(PersonalizationScope.Shared), WebBrowsable()> _

    Public Property strToTranslate() As String

        Get

            Return pStrText

        End Get

        Set(ByVal value As String)

            pStrText = value

        End Set

    End Property

Böylece tüm kullanıcılar, (son kullanıcı tarafından) en son yapılan tercümeyi göreceklerdir. <WebBrowsable> özniteliğini ise makalenin ilerleyen bölümlerinde ele alıyor olacağız.

WebPart kontrolünün Export Edilmesi
WebPart kontrollerini kullanıcılar arasında paylaşmak v.b. amaçlar için export edebiliriz. Bir WebPart kontrolünü export etmek için aşağıdaki adımları izlememiz gerekmektedir. 

  1. Default.aspx sayfasına giderek Source View ekranına geçiyoruz. TranslationWebPart’ın olduğu bölüme giderek aşağıdaki kodda olduğu gibi ExportMode özniteliğini ekliyoruz.
    <cc1:TranslationWebPart ID="TranslationWebPart1" title="En-Fr Çeviri" ExportMode=All runat="server" />
  2. İkinci adımda web.config dosyasının <webParts> bloğuna aşağıdaki eklemeyi yapmamız gerekmektedir.
    <webParts enableExport="true" />
  3. F5’e bastığımızda TranslationService webpart’ına Export özelliği gelmiş olacaktır..

 

WebPart’ı export etmek istediğimiz zaman, web partın gizli bilgiler içerebileceğine dair bir uyarı görüntülenecektir.

 

  1. Bu diyaloğu OK butonuna basarak geçiyoruz ve karşımıza gelen dosya kaydetme ekranında ise Save butonunu tıklıyoruz.
  2. Dosya TranslationService.WebPart uzantısı ile kaydedilecektir. Dosyayı notepad ile açtığımızda aşağıdaki satırları göreceğiz.

 

<?xml version="1.0" encoding="utf-8"?>
<webParts>
  <webPart>
    <metaData>
      <type name="TranslationWebPart.TranslationWebPart, TranslationWebPart, Version=1.0.2059.38518, Culture=neutral, PublicKeyToken=null" />
      <importErrorMessage>Cannot import this Web Part.</importErrorMessage>
    </metaData>
    <data>
      <properties
        <property name="AllowClose" type="bool">True</property>
        <property name="Width" type="unit" />
        <property name="strToTranslate" type="string">translation</property>
        <property name="AllowMinimize" type="bool">True</property>
        <property name="AllowConnect" type="bool">True</property>
        <property name="ChromeType" type="chrometype">Default</property>
        <property name="TitleIconImageUrl" type="string" />
        <property name="Description" type="string" />
        <property name="Hidden" type="bool">False</property>
        <property name="TitleUrl" type="string" />
        <property name="AllowEdit" type="bool">True</property>
        <property name="Height" type="unit" />
        <property name="HelpUrl" type="string" />
        <property name="Title" type="string">En-Fr Çeviri</property>
        <property name="CatalogIconImageUrl" type="string" />
        <property name="Direction" type="direction">NotSet</property>
        <property name="ChromeState" type="chromestate">Normal</property>
        <property name="AllowZoneChange" type="bool">True</property>
        <property name="AllowHide" type="bool">True</property>
        <property name="HelpMode" type="helpmode">Navigate</property>
        <property name="ExportMode" type="exportmode">All</property>
      </properties>
    </data>
  </webPart>
</webParts>

  1. .webpart dosyasında son yaptığımız çeviri olan “translation” kelimesini görebilirsiniz.

Hassas Verilerin Kontrolü

ExportMode özniteliği All, None ve NonSensitiveData değerlerinden birini alabilir. Varsayılan değeri None’dır. NonSensitiveData modu (<Personalizable> özniteliğinin isSensitive parametresi ile) sensitive olarak işaretlenmemiş  verilerin export edilmesine izin vermektedir.

WebPart içindeki veriyi sensitive olarak işaretlemek için aşağıdaki yapıyı kullanabiliriz.

<Personalizable(PersonalizationScope.User, True), _
                WebBrowsable( )> _
 Public Property strToTranslate( ) As String
 ...
 

Yazı dizisinin üçüncü bölümünde kullanıcıların webpart’ları bir webparzone’dan başka bir webpartzone’a taşımalarını nasıl sağlayabileceğimizi ele alıyor olacağız..

Kadir Sümerkent
kadir@sumerkent.com