WPF Listview Kontrolü

Listview kontrolü listeleme yapmak için kullanabileceğimiz bir kontroldür. WPF Formda Listview kontrolünü XAML tarafında oluşturmak için


<ListView></ListView>

etiketleri kullanılabilir. Listview içine XAML içinde eleman eklemek için;

ListViewItem etiketinden faydalanılır.


<ListView Margin="10,10,0,13" Name="ListView1" HorizontalAlignment="Left"
VerticalAlignment="Top" Width="194" Height="200">
<ListViewItem Content="Coffie"></ListViewItem>
<ListViewItem Content="Tea"></ListViewItem>
<ListViewItem Content="Orange Juice"></ListViewItem>
<ListViewItem Content="Milk"></ListViewItem>
<ListViewItem Content="Iced Tea"></ListViewItem>
<ListViewItem Content="Mango Shake"></ListViewItem>
</ListView>

<ListView Margin="10,10,0,13" Name="ListView1" HorizontalAlignment="Left"

VerticalAlignment="Top" Width="194" Height="200">

</ListView>

ListView kontrolüne kod tarafında textbox’ a girilen metni eleman eklemek için ise şu yöntemi kullanabilirsiniz.

XAML için;

[css] <TextBox Height="23" HorizontalAlignment="Left" Margin="8,14,0,0"
Name="textBox1" VerticalAlignment="Top" Width="127" />
<Button Height="23" Margin="140,14,0,0" Name="button1" VerticalAlignment="Top"
HorizontalAlignment="Left" Width="76" Click="button1_Click">
Add Item
</Button>
[/css]

Buton Click olayı için;


private void button1_Click(object sender, RoutedEventArgs e)
{
    ListView1.Items.Add(textBox1.Text);
}

private void button1_Click(object sender, RoutedEventArgs e)

{

ListView1.Items.Add(textBox1.Text);

}

Listview’de seçili elemanı silmek için;


private void DeleteButton_Click(object sender, RoutedEventArgs e)
{
   ListView1.Items.RemoveAt
       (ListView1.Items.IndexOf(ListView1.SelectedItem));                 
}

private void DeleteButton_Click(object sender, RoutedEventArgs e)

{

ListView1.Items.RemoveAt

(ListView1.Items.IndexOf(ListView1.SelectedItem));

}

kodları çalıştırılabilir.

Listview’ e eklemiş olduğumuz elemanları dilersek biçimlendirebiliriz. Örnek olarak Font değişikliği,renk değişikliği,vb.

[css] <ListViewItem Background="LightCoral" Foreground="Red" Content="Coffie"
FontFamily="Verdana" FontSize="12" FontWeight="Bold"></ListViewItem>
<ListViewItem Background="LightGray" Foreground="Black" Content="Tea"
FontFamily="Georgia" FontSize="14" FontWeight="Bold"></ListViewItem>
<ListViewItem Background="LightBlue" Foreground="Purple" Content="Orange Juice"
FontFamily="Verdana" FontSize="12" FontWeight="Bold"></ListViewItem>
<ListViewItem Background="LightGreen" Foreground="Green" Content="Milk"
FontFamily="Georgia" FontSize="14" FontWeight="Bold"></ListViewItem>
<ListViewItem Background="LightBlue" Foreground="Blue" Content="Iced Tea"
FontFamily="Verdana" FontSize="12" FontWeight="Bold"></ListViewItem>
<ListViewItem Background="LightSlateGray" Foreground="Orange" Content="Mango Shake"
FontFamily="Georgia" FontSize="14" FontWeight="Bold"></ListViewItem>
[/css]

Şimdi de listview‘ de resim eklemesi ve seçim yapabileceğimiz checkbox eklemesi yapacak şekilde düzenleyelim.

[css] <ListViewItem Background="LightCoral" Foreground="Red"
FontFamily="Verdana" FontSize="12" FontWeight="Bold">
<CheckBox Name="CoffieCheckBox">
<StackPanel Orientation="Horizontal">
<Image Source="coffie.jpg" Height="30"></Image>
<TextBlock Text="Coffie"></TextBlock>
</StackPanel>
</CheckBox>
</ListViewItem>
<ListViewItem Background="LightGray" Foreground="Black"
FontFamily="Georgia" FontSize="14" FontWeight="Bold">
<CheckBox Name="TeaCheckBox">
<StackPanel Orientation="Horizontal">
<Image Source="tea.jpg" Height="30"></Image>
<TextBlock Text="Tea"></TextBlock>
</StackPanel>
</CheckBox>
</ListViewItem>
<ListViewItem Background="LightBlue" Foreground="Purple"
FontFamily="Verdana" FontSize="12" FontWeight="Bold">
<CheckBox Name="OrangeJuiceCheckBox">
<StackPanel Orientation="Horizontal">
<Image Source="OrangeJuice.jpg" Height="40"></Image>
<TextBlock Text="OrangeJuice"></TextBlock>
</StackPanel>
</CheckBox>
</ListViewItem>
<ListViewItem Background="LightGreen" Foreground="Green"
FontFamily="Georgia" FontSize="14" FontWeight="Bold">
<CheckBox Name="MilkCheckBox">
<StackPanel Orientation="Horizontal">
<Image Source="Milk.jpg" Height="30"></Image>
<TextBlock Text="Milk"></TextBlock>
</StackPanel>
</CheckBox>
</ListViewItem>
<ListViewItem Background="LightBlue" Foreground="Blue"
FontFamily="Verdana" FontSize="12" FontWeight="Bold">
<CheckBox Name="IcedTeaCheckBox">
<StackPanel Orientation="Horizontal">
<Image Source="IcedTea.jpg" Height="30"></Image>
<TextBlock Text="Iced Tea"></TextBlock>
</StackPanel>
</CheckBox>
</ListViewItem>
<ListViewItem Background="LightSlateGray" Foreground="Orange"
FontFamily="Georgia" FontSize="14" FontWeight="Bold">
<CheckBox Name="MangoShakeCheckBox">
<StackPanel Orientation="Horizontal">
<Image Source="MangoShake.jpg" Height="30"></Image>
<TextBlock Text="Mango Shake"></TextBlock>
</StackPanel>
</CheckBox>
</ListViewItem>
[/css]

Şimdi de birden fazla sütuna sahip bir listview’ de eleman ekleme işlemine bakalım. Örneğimizde Id ve Ad sütunlarından oluşan ListView’ e Class kullanarak eleman ekleme işlemini gerçekleştiriyor olacağız.

XAML kodları;


<Grid>
        <ListView Name="lst1" HorizontalAlignment="Left" Height="261" Margin="39,22,0,0" 
                  VerticalAlignment="Top" Width="196" >
            <ListView.View>
                <GridView>
                    <GridViewColumn Header="Id" Width="50" DisplayMemberBinding="{Binding Id}"/>
                    <GridViewColumn Header="Name" Width="150" DisplayMemberBinding="{Binding Ad}"/>
                </GridView>
            </ListView.View>
        </ListView>
        <Button Content="EKLE" HorizontalAlignment="Left" Margin="309,106,0,0" VerticalAlignment="Top" Width="75" RenderTransformOrigin="0.882,3.8" Click="Button_Click"/>
        <TextBox Name="txt1" HorizontalAlignment="Left" Height="23" Margin="309,35,0,0" TextWrapping="Wrap" Text="" VerticalAlignment="Top" Width="120"/>
        <TextBox Name="txt2" HorizontalAlignment="Left" Height="23" Margin="309,63,0,0" TextWrapping="Wrap" Text="" VerticalAlignment="Top" Width="120"/>

    </Grid>

<Grid>

<ListView Name="lst1" HorizontalAlignment="Left" Height="261" Margin="39,22,0,0"

VerticalAlignment="Top" Width="196" >

<ListView.View>

</GridView>

</ListView.View>

</ListView>

</Grid>

C# kodları ;


    public partial class MainWindow : Window
    {
        public class MyItem
        {
            public int Id { get; set; }

            public string Ad { get; set; }
        }

        public MainWindow()
        {
            InitializeComponent();
            

            this.lst1.Items.Add(new MyItem { Id = 1, Ad = "Ali" });
            this.lst1.Items.Add(new MyItem { Id = 2, Ad = "Veli" });
            this.lst1.Items.Add(new MyItem { Id = 3, Ad = "Ahmet" });

        }

        private void Button_Click(object sender, RoutedEventArgs e)
        {
            MyItem itm=new MyItem();
            itm.Id=Convert.ToInt32(txt1.Text);
            itm.Ad=txt2.Text;
            lst1.Items.Add(itm);
        }
         
    }