Gönderen Konu: Asp.net Ajax Toolkits.  (Okunma sayısı 8324 defa)

0 Üye ve 1 Ziyaretçi konuyu incelemekte.

Çevrimdışı Morphosis

  • Üye
  • **
  • İleti: 74
Asp.net Ajax Toolkits.
« : 06 Haziran 2008, 11:40:55 öö »
Kendimce hazırladığım ajaxtoolkit örneklerini ve kısa açıklaması sizlerle paylaşarak projenize dahil edebilecek seviyeye gelmenize yardımcı olmaya çalışacağım inşAllah. Elimden geldiğince belirli periyotlarla ajaxtoolkitlerinin açıklamasını yapacağım. İlk olarak fazla derine inmeden ajaxtoolkitin nasıl kurulduğuyla konuya başlayalım.







Kurulum :

İlk olarak ajax toolkitimizi framework 2.0 içinmi 3.5 içinmi kullanacağımıza göre http://www.codeplex.com/AtlasControlToolkit/Release/ProjectReleases.aspx?ReleaseId=8513

bağlantısından toolkitimizi indiriyoruz.

Framework  2.0 için ise ilk olarak ajax extensions’umuzu kuruyoruz ve ardından toolbox’ımızda yeni bir bölüm oluşturarak (Add Tab) Ajax Toolkit ismini veriyoruz ve o bölümede  ajaxControlToolkit.dll imizi referans ediyoruz  (Choose Items’ten browse diyerek dll i seçiyoruz. ).

 


Framework 3.5 için ise zaten ajax extensionumuz hazır kurulu olarak Visual Studio 2008 ile geliyor ve bizim yapmamız gereken verdiğim linkinten framework 3.5 için ajaxtoolkiti indirmek ve 2.0 için yaptıgımız yeni bölüm ekleyip referans etme işlemlerinin aynısını yapmak. 





Bu bölümü kısa geçiyorum arkadaşlar. Anlamayan olursa bir bir resimle açıklayabilirim....

 

Şimdi araçlarımızın kullanımına yavaş yavaş başlayalım.

 

Accordion Kontrolü:

Bir adet menu uygulamasıdır.Üzerine tıklandıgında ilgili panelin açılmasını sağlar.







<ajaxToolkit:Accordion

ID="MyAccordion"

runat="Server"

SelectedIndex="0"

HeaderCssClass="accordionHeader"

HeaderSelectedCssClass="accordionHeaderSelected"

ContentCssClass="accordionContent"

AutoSize="None"

FadeTransitions="true"

TransitionDuration="250"

FramesPerSecond="40"

RequireOpenedPane="false"

SuppressHeaderPostbacks="true">

<Panes>

<ajaxToolkit:AccordionPane

HeaderCssClass="accordionHeader"

HeaderSelectedCssClass="accordionHeaderSelected"

ContentCssClass="accordionContent">

<Header> . . . </Header>

<Content> . . . </Content>

</ajaxToolkit:AccordionPane>

.

.

.

</Panes>

<HeaderTemplate>...</HeaderTemplate>

<ContentTemplate>...</ContentTemplate>

</ajaxToolkit:Accordion>

AutoSize: Accordion menünün boyutlandırma seçeneklerini içerir. Üç farklı değer alır. Fill, Limit ve None. Fill Accordion menünün yüksekliğini belirlenen height propertisine sabitler. Eğer içerik sığmıyorsa scroll çıkar. Yani yükseklik her zaman sabittir. Limit, Fill ile hemen hemen aynıdır. Farkı limitte eğer içerik az ise Accordion’ un boyutu da küçülür ve sayfanın alt tarafındaki diğer kontroller yukarıya doğru kayar. None ise kontrolün içeriğe göre genişleyip daralmasını sağlar. Alttaki kontroller de ona göre yer değiştirir.

RequireOpenedPane: True ve False değerlerini alır. Accordion kontrolünde açık bir AccordionPane bulunmasının zorunlu olup olmayacağına karar verir. Yani False seçildiğinde bütün AccordionPane leri aynı anda minimize edebiliriz.

SelectedIndex: Kaçıcı Pane’ in açık olduğunu gösterir. Ayıca sayfa ilk yüklendiğinde hangi Pane’ in açık olacağını belilemeye yarar.

SuppressHeaderPostbacks: Sayfa Postback olduğunda enson açık Pane’ in açık mı kalacağına yoksa SelectedIndex’teki değerin mi seçili geleceğine karar verir.

FadeTransitions: Seçili Pane değişirken geçiş efekti yapıp yapayacağına karar verir.

TransitionDuration: Geçiş süresini milisaniye cinsinden belirlemeye yarar.

FramesPerSecond: Geçiş Anında saniyede kaç frame göstereceğine karar verir.

ContentCssClass: İçerik için css belirlemeye yarar.

HeaderCssClass: Başlık için css belirlemeye yarar.

HeaderSelectedCssClass: Seçili başlık için css belirlemeye yarar.

Örnek: Buradan Bakınız...

 

AlwaysVisibleControl:

Atlas ile birlikte gelen AlwaysVisibleControl aracı sayfanın içeriği değiştiğinde, yeniden boyutlanlandığında kaydırma çubukları ile sayfa kaydırıldığında sürekli belirlediğimiz yerde duran bir araçtır. Sayfa yüklenirken flash kontrolüne yakalanmamak için kontrolün pozisyonunu absolutely olarak belirlemeniz gerekir.







<ajaxToolkit:AlwaysVisibleControlExtender ID="ace" runat="server"
    TargetControlID="timer"       
    VerticalSide="Top"
    VerticalOffset="10"
    HorizontalSide="Right"
    HorizontalOffset="10"
    ScrollEffectDuration=".1" />

 

TargetControlID– Sürekli gösterilecek olan kontrolün ID’si
HorizontalOffset– Browserin yatay kenarından pixel olarak uzaklığı. Varsayılan olarak 0’dır.
HorizontalSide – Yatay olarak browser üzerindeki tarayıcının pozisyonunu belirler (Left, Center, yada Right) Varsayılanı Left’dir.
VerticalOffset– Browserin diket kenarından pixel olarak uzaklığı. Varsayılan olarak 0’dır.
VerticalSide– Dikey olarak browser üzerindeki tarayıcının pozisyonunu belirler (Top, Middle, yada Bottom) Varsayılanı Top’dır.
ScrollEffectDuration– Kontrolün pozisyonunun değiştiğinde scroll efektinin süresinin uzunluğu. Varsayılan olarak 1 saniyedir.