Collapse

Form içeriğini açılıp kapanabilen başlıklı bölümlere ayıran bir düzen nesnesidir. Her bölüm bir başlık taşır; kullanıcı başlığa tıklayınca o bölümün içeriği açılır veya kapanır. Uzun formları derli toplu göstermek için kullanılır.

Bu nesnenin bir değeri yoktur. Collapse bir kapsayıcı (container) nesnedir; içine başka nesneler yerleştirirsiniz, kendisi veri tutmaz.

Ne zaman kullanılır?

Çok sayıda alanı olan formlarda alanları konularına göre gruplayıp ekranı sadeleştirmek için idealdir. Örneğin "Kişisel Bilgiler", "İletişim", "Adres" gibi bölümleri ayrı ayrı katlayabilirsiniz. Sadece sekmeli geçiş istiyorsanız Tabs, basit bir çerçeve istiyorsanız Panel daha uygundur.

Tasarımcı özellikleri

Bir Collapse seçildiğinde Özellik Görüntüleyici sekmelere ayrılır.

General

Özellik	Açıklama
Name	Nesnenin koddaki adı (ör. Collapse1). Koddan bu adla erişirsiniz.

Data Source

Collapse'in içindeki bölümler Items listesiyle yönetilir.

Özellik	Açıklama
Items	Bölümlerin (her biri bir TabItem) listesi. Tasarımcıda bölüm ekleyip çıkardıkça bu liste güncellenir.

Behavior

Özellik	Açıklama
Accordion	Akordeon modunu açar. Açıkken aynı anda yalnızca tek bir bölüm açık kalır; yeni bölüm açılınca diğeri kapanır.
HasScrollbar	İçerik taştığında kaydırma çubuğu gösterir.
ReadOnly	İçindeki nesneleri salt okunur yapar.
SelectedIndex	Açık olan bölümün sıra numarası (0'dan başlar).
SelectedItem	O an seçili (açık) bölümü temsil eden TabItem.
TabPosition	Bölüm başlıklarının yeri (üst / sol vb.).
ToolboxItems	Tasarım sırasında nesnelerin yerleştirilebileceği iç bölmeler.

Appearance

Özellik	Açıklama
Visible / Client Visible	Nesnenin görünürlüğü.
Enabled / Client Enabled	Nesnenin aktif olup olmadığı.
Title	Nesnenin başlığı (çok dilli olabilir).

Olaylar

Collapse bir kapsayıcı nesne olduğu için kendine ait değer/seçim olayı sunmaz. Yalnızca her nesnede bulunan yaşam döngüsü olayları çalışır. Bu olayları nesne açılırken bölümleri programlı olarak açıp kapatmak veya görünürlüğü ayarlamak için kullanırsınız.

Açılış sırası: OnInit → OnLoad → OnRender

Olaylar iki tarafta çalışabilir: sunucu olayları C# kodunda, istemci olayları tarayıcıdaki TypeScript kodunda.

Sunucu olayları (Server)

Olay	Ne zaman çalışır
OnInit	Form açılırken nesne oluşturulduğunda, en başta.
OnLoad	OnInit'in hemen ardından, nesne yüklenince.
OnRender	Nesne ekrana çizilirken.

İstemci olayları (Client)

Sunucudaki olaylara ek olarak tarayıcı tarafında şunlar da vardır:

Olay	Ne zaman çalışır
OnDataLoad	Nesnenin verisi yüklendiğinde.
OnPreRender	Nesne ekrana çizilmeden hemen önce.
OnClick / OnDoubleClick	Nesneye tıklanınca / çift tıklanınca.
OnPropertyChanging / OnPropertyChanged	Bir özellik kodla değiştirilmeden önce / sonra.

Kod örnekleri

Collapse'in bir değeri olmadığı için Value / Text kullanılmaz. Bunun yerine hangi bölümün açık olacağını ve nesnenin görünürlüğünü kontrol edersiniz. Sunucu örnekleri turuncu, istemci örnekleri kırmızı çerçevelidir.

Form kodu (C#, sunucu)

Form kodunda nesneye doğrudan adıyla erişirsiniz:

// İkinci bölümü aç (sıra numarası 0'dan başlar)
Collapse1.SelectedIndex = 1;

// Akordeon modunu aç
Collapse1.Accordion = true;

// Nesneyi gizle
Collapse1.Visible = false;

Akış (Flow) kodu (C#, sunucu)

Akış kodunda nesneye Document1.Controls üzerinden erişirsiniz:

// İkinci bölümü aç
Document1.Controls["Collapse1"].SelectedIndex = 1;

// Nesneyi gizle
Document1.Controls["Collapse1"].Visible = false;

İstemci kodu (TypeScript, tarayıcı)

İstemci tarafında nesnelere this. ile erişilir ve özellik adları küçük harfle yazılır:

// İkinci bölümü aç
this.Collapse1.selectedIndex = 1;

// Nesneyi gizle
this.Collapse1.visible = false;

Accordion modu ne zaman açılır?

Bölümlerin çoğu uzunsa ve aynı anda hepsinin açık kalması ekranı yoruyorsa Accordion özelliğini açın. Böylece kullanıcı bir bölümü açtığında diğeri otomatik kapanır, ekran her zaman derli toplu kalır.

İpuçları

• Collapse bir kapsayıcıdır; içine TextBox, ComboBox gibi nesneleri sürükleyip bölümlere göre gruplayın.
• Form ilk açıldığında belirli bir bölümün açık gelmesini istiyorsanız OnLoad olayında SelectedIndex ayarlayın.
• Sadece sekme görünümü istiyorsanız Tabs, tek bir çerçeve yeterliyse Panel kullanın.

Tüm tasarımcı özellikleri (tam liste)

General: Name

Data Source: Items

Behavior: Accordion, HasScrollbar, ReadOnly, SelectedIndex, SelectedItem, TabPosition, ToolboxItems

Appearance: Client Enabled, Client Visible, Enabled, Title, Visible

Olaylar (Server): OnInit, OnLoad, OnRender

Olaylar (Client): OnInit, OnLoad, OnPreRender, OnRender, OnDataLoad, OnClick, OnDoubleClick, OnPropertyChanging, OnPropertyChanged