Bir Combox kontrolü , ListBox kontrolü oluşturmak için kullanılan farklı bir yoldur. ListBox kontrolünden farklı olarak, ComboBox kontrolü açılır şekilde kullanılır ve tek değer seçilmesine izin verir.
Yazım:
|
1 2 3 |
<ComboBox x:Name="nesneAdi"></ComboBox> |
Bir ComboBox kontrolü, bir listeyi yada diziyi kendine kaynak olarak alabileceği gibi en çok kullanılan yöntem olan ComboBoxItem koleksiyonu da kendisine kaynak olarak almaktadır.
Aşağıdaki örnekte XAML kullanarak ComboBox denetimine ComboBoxItem öğleri eklenmiştir.
|
1 2 3 4 5 6 7 8 9 |
<ComboBox x:Name="cbListe"> <ComboBoxItem Content="Hikaye"></ComboBoxItem> <ComboBoxItem Content="Roman"></ComboBoxItem> <ComboBoxItem Content="Deneme"></ComboBoxItem> <ComboBoxItem Content="Macera"></ComboBoxItem> </ComboBox> <!-- www.yazilimbilisim.net--> |
Örnek 1
Çalışma anında ComboBox içine değer ekleme ve ComboBox içinden Değer Silme
Yukarıdaki örnekte ComboBoxItem nesnelerini XAML ekranında eklemiştik. Şimdi aşağıdaki ekrandaki uygulama ile ComboBox içine değer ekleme ve ComboBox içinden değer silme işlemini yapacağız. Uygulamada ComboBox nesnesi cbListe, TextBox nesnesi txtHobi ve Button nesneleri btnEkle, btnSil olarak isimlendirilmiştir.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 |
<Grid Margin="50"> <Grid.RowDefinitions> <RowDefinition></RowDefinition> <RowDefinition></RowDefinition> <RowDefinition></RowDefinition> </Grid.RowDefinitions> <Grid.ColumnDefinitions> <ColumnDefinition></ColumnDefinition> <ColumnDefinition></ColumnDefinition> </Grid.ColumnDefinitions> <!-- www.yazilimbilisim.net--> <ComboBox x:Name="cbListe" Margin="0 20" Grid.Row="0" Grid.Column="0"> <ComboBoxItem Content="Hikaye"></ComboBoxItem> <ComboBoxItem Content="Roman"></ComboBoxItem> <ComboBoxItem Content="Deneme"></ComboBoxItem> <ComboBoxItem Content="Macera"></ComboBoxItem> </ComboBox> <TextBox x:Name="txtHobi" Margin="0 20" Grid.Row="0" Grid.Column="1" ></TextBox> <Button x:Name="btnEkle" Margin="0 20" Grid.Row="1" Grid.Column="0" Grid.ColumnSpan="2" >Hobi Ekle</Button> <Button x:Name="btnSil" Margin="0 20" Grid.Row="2" Grid.Column="0" Grid.ColumnSpan="2" >Hobi Sil</Button> </Grid> |
Ekleme İşlemi: btnEkle butonuna tıklandığında txtHobi içindeki değeri cbListe içine ekleyelim. btnEkle butonunun tıklama olayını aşağıdaki gibi oluşturuyoruz.
|
1 2 3 4 5 6 7 |
private void btnEkle_Click(object sender, RoutedEventArgs e) { //ComboBox.Items.Add metodu ile combobox içine değer eklenir. cbListe.Items.Add(txtHobi.Text); } |
Değer Silme: btnSil nesnesine tıklandığında ComboBox içinde seçili olan nesneyi silmek için btnSil butonunun tıklama olayını aşağıdaki gibi oluşturuyoruz.
★ Silme işlemi gerçekleştirilirken combobox içinde seçim yapılmış olması gerekiyor. Seçim yapılmamış ise -1 değeri dönecektir. Bu kontrol için SelectedIndex değerinin -1 değerinden büyük olup olmadığı kontrol edilmelidir.
|
1 2 3 4 5 6 7 8 9 10 |
/*https://www.yazilibilisim.net*/ private void btnSil_Click(object sender, RoutedEventArgs e) { if(cbListe.SelectedIndex >= 0) { cbListe.Items.RemoveAt(cbListe.SelectedIndex); } } |
Örnek 2
ComboBox Seçim Gerçekleştiğinde Çalışacak Olay
ComboBox içinde bir değer değişikliği olduğunda SelectionChanged olayı ile değişimi kontrol etmek ve çeşitli işlemler yapmak mümkün hale geliyor.
Hobiler(cbListe) ile gösterilen değerler seçme işlemi yapıldığında Secili Hobiler(cbHobi) içine aktarılmaktadır.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 |
<Grid Margin="50"> <Grid.RowDefinitions> <RowDefinition></RowDefinition> <RowDefinition></RowDefinition> </Grid.RowDefinitions> <Grid.ColumnDefinitions> <ColumnDefinition></ColumnDefinition> <ColumnDefinition></ColumnDefinition> </Grid.ColumnDefinitions> <!-- www.yazilimbilisim.net--> <Label Margin="0 40" HorizontalAlignment="Right" Grid.Row="0" Grid.Column="0">Hobiler</Label> <Label Margin="0 40" HorizontalAlignment="Right" Grid.Row="1" Grid.Column="0">Seçili Hobiler</Label> <ComboBox x:Name="cbListe" Margin="0 40" Grid.Row="0" Grid.Column="1"> <ComboBoxItem Content="Hikaye"></ComboBoxItem> <ComboBoxItem Content="Roman"></ComboBoxItem> <ComboBoxItem Content="Deneme"></ComboBoxItem> <ComboBoxItem Content="Macera"></ComboBoxItem> </ComboBox> <ComboBox x:Name="cbSecim" Margin="0 40" Grid.Row="1" Grid.Column="1"></ComboBox> </Grid> |
Uygulamada cbListe içinde seçilen hobiler, cbSecim içine kaydetme işlemi yapılmaktadır. cbListe nesnenin SelectionChanged olayını aşağıdaki gibi oluşturuyoruz.
Aynı şekilde cbSecim içindeki seçimleri de cbListe içine tekrar atmak için cbSecim nesnesinin SelectionChanged olayına gerekli kodları aşağıdaki gibi yazıyoruz.
Not: ComboBoxItem nesneleri bir koleksiyon öğesidir. Bu nedenle öge bir koleksiyona bağlı ise önce bağlı olduğu bağlantı kaldırılmalı sonra da başka bir öge içine aktarılmalıdır. Uygulamayı bu sıra ile yapmak önemlidir. Aksi durumda şu şekilde bir hata ile karşılaşılacaktır. Additional information: Öğenin zaten mantıksal bir öğesi var. Yeni bir üst öğeye bağlanmadan önce eskisinden bağlantısının kesilmesi gerekir.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 |
private void cbListe_SelectionChanged(object sender, SelectionChangedEventArgs e) { //Seçili olan ComboBoxItem nesnesi cbItem olarak alınır. ComboBoxItem cbItem = (ComboBoxItem)cbListe.SelectedItem; cbListe.Items.Remove(cbItem); cbSecim.Items.Add(cbItem); /* Not--> Additional information: Öğenin zaten mantıksal bir öğesi var. Yeni bir üst öğeye bağlanmadan önce eskisinden bağlantısının kesilmesi gerekir. Şeklinde hata almamak için cbSecim içindeki bağlantıyı remove ile kaldırıp, sonra da cbItem bağlantısı add ile cbSecim içine aktarıyoruz. */ } private void cbSecim_SelectionChanged(object sender, SelectionChangedEventArgs e) { ComboBoxItem cbItem = (ComboBoxItem)cbSecim.SelectedItem; cbSecim.Items.Remove(cbItem); cbListe.Items.Add(cbItem); } |
Örnek 3
Örnek 2 ile ComboBoxItem nesnesi olarak eklme yapılabileceği gibi properties paneli içinde Items sekmesi kullanılarak da ComboBox içine component ekleme işlemi gerçekleştirilebilir.
Örnek 4
Adım 1: Mevcut bir listeyi ComboBox için veri kaynağı olarak ayarlayabiliriz. Veri kaynağı (Item Source) olarak ayarlamak için örnek 2 uygulamasında bulunan ComboBoxItem nesnelerini aşağıdaki gibi XAML içinden çıkarıp uygulamaya başlıyoruz.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 |
<Grid Margin="50"> <Grid.RowDefinitions> <RowDefinition></RowDefinition> <RowDefinition></RowDefinition> </Grid.RowDefinitions> <Grid.ColumnDefinitions> <ColumnDefinition></ColumnDefinition> <ColumnDefinition></ColumnDefinition> </Grid.ColumnDefinitions> <!-- www.yazilimbilisim.net--> <Label Margin="0 40" HorizontalAlignment="Right" Grid.Row="0" Grid.Column="0">Hobiler</Label> <Label Margin="0 40" HorizontalAlignment="Right" Grid.Row="1" Grid.Column="0">Seçili Hobiler</Label> <ComboBox x:Name="cbListe" Margin="0 40" Grid.Row="0" Grid.Column="1"></ComboBox> <ComboBox x:Name="cbSecim" Margin="0 40" Grid.Row="1" Grid.Column="1"></ComboBox> </Grid> |
Adım 2: List<string> koleksiyonuna uygulamadaki metotlardan ulaşmak için sınıf içinde oluşturduk.
Oluşturulan liste MainWindow kurucu metodu içinde örneklenip, içerisi değeler ile dolduruldu.
ComboBox(cbListe) nesnesinin ItemSource(veri kaynağı) için mevcut List koleksiyonu kaynak olarak gösterildi.
Burada iki tane liste olması dikkat çekmiş olabilir. listelerden biri cbListe için diğeri ise cbSecim için oluşturmuştur. Listeler içinde veri taşıma işlemi gerçekleştiğinde ComboBox içindeki verilerde güncellenecektir.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 |
public partial class MainWindow : Window { List<string> listHobiler; List<string> listSeciliHobiler; public MainWindow() { InitializeComponent(); listHobiler = new List<string>() { "Voleybol", "Yüzme", "Kitap Okuma", "Kod Yazma" }; listSeciliHobiler = new List<string>(); //Listeleri ComboBox nesnelerine bağlama cbListe.ItemsSource = listHobiler; cbSecim.ItemsSource = listSeciliHobiler; } |
Uygulama bu aşamada test edilirse cbListe içinde veriler duldurulmuş bir şekilde liste içinde gösterilecektir.
Adım 3: Bu aşamada cbListe içinde bir nesne seçildiğinde, aktif olan nesnenin index değeri okunacak ve mevcut sıradaki değer listSeciliHobiler içine aktarılacaktır. Sonrada aktif olan index listHobiler koleksiyonundan çıkarılacak ve ComboBox nesneleri güncellenecektir. Bu işlem cbListe nesnesinin SelectionChanged olayı gerçekleştiğinde yapılacaktır.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 |
private void cbListe_SelectionChanged(object sender, SelectionChangedEventArgs e) { ComboBox cmbx = (ComboBox)sender; int seciliIndex = cmbx.SelectedIndex; if(seciliIndex > -1) { //seçili Listeye ekleme listSeciliHobiler.Add(listHobiler[seciliIndex]); //Listeden değeri silmek için kullanılır listHobiler.RemoveAt(seciliIndex); //Koleksiyonlarda meydana gelen değişikliği ComboBox nesnelerini güncelleyerek görnek için cbListe.Items.Refresh(); cbSecim.Items.Refresh(); } } |
Adım 4: Bu adımda ise seçili hobilere tıkladığımızda cbSecim içnden çıkarıp cbListe içine ekleme işlemini gerçekleştireceğiz. Adım 3 içinde yapılanın tam tersini yapacağız.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 |
private void cbSecim_SelectionChanged(object sender, SelectionChangedEventArgs e) { ComboBox cmbx = (ComboBox)sender; int seciliIndex = cmbx.SelectedIndex; if (seciliIndex > -1) { //seçili Listeye ekleme listHobiler.Add(listSeciliHobiler[seciliIndex]); //Listeden değeri silmek için kullanılır listSeciliHobiler.RemoveAt(seciliIndex); //Koleksiyonlarda meydana gelen değişikliği ComboBox nesnelerini güncelleyerek görnek için cbListe.Items.Refresh(); cbSecim.Items.Refresh(); } } |
Çok güzel olmuş derslerimde çok yardımcı oldu teşekkür ederim.
Çok güzel olmuş derslerimde çok yardımcı oldu teşekkürler.