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;


&lt;TextBox Height=&quot;23&quot; HorizontalAlignment=&quot;Left&quot; Margin=&quot;8,14,0,0&quot;
                 Name=&quot;textBox1&quot; VerticalAlignment=&quot;Top&quot; Width=&quot;127&quot; /&gt;
&lt;Button Height=&quot;23&quot; Margin=&quot;140,14,0,0&quot; Name=&quot;button1&quot; VerticalAlignment=&quot;Top&quot;
                HorizontalAlignment=&quot;Left&quot; Width=&quot;76&quot; Click=&quot;button1_Click&quot;&gt;
            Add Item
&lt;/Button&gt;

<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>

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.


&lt;ListViewItem Background=&quot;LightCoral&quot; Foreground=&quot;Red&quot; Content=&quot;Coffie&quot;
                         FontFamily=&quot;Verdana&quot; FontSize=&quot;12&quot; FontWeight=&quot;Bold&quot;&gt;&lt;/ListViewItem&gt;
            &lt;ListViewItem Background=&quot;LightGray&quot; Foreground=&quot;Black&quot; Content=&quot;Tea&quot;
                         FontFamily=&quot;Georgia&quot; FontSize=&quot;14&quot; FontWeight=&quot;Bold&quot;&gt;&lt;/ListViewItem&gt;
            &lt;ListViewItem Background=&quot;LightBlue&quot; Foreground=&quot;Purple&quot; Content=&quot;Orange Juice&quot;
                         FontFamily=&quot;Verdana&quot; FontSize=&quot;12&quot; FontWeight=&quot;Bold&quot;&gt;&lt;/ListViewItem&gt;
            &lt;ListViewItem Background=&quot;LightGreen&quot; Foreground=&quot;Green&quot; Content=&quot;Milk&quot;
                         FontFamily=&quot;Georgia&quot; FontSize=&quot;14&quot; FontWeight=&quot;Bold&quot;&gt;&lt;/ListViewItem&gt;
            &lt;ListViewItem Background=&quot;LightBlue&quot; Foreground=&quot;Blue&quot; Content=&quot;Iced Tea&quot;
                         FontFamily=&quot;Verdana&quot; FontSize=&quot;12&quot; FontWeight=&quot;Bold&quot;&gt;&lt;/ListViewItem&gt;
            &lt;ListViewItem Background=&quot;LightSlateGray&quot; Foreground=&quot;Orange&quot; Content=&quot;Mango Shake&quot;
                         FontFamily=&quot;Georgia&quot; FontSize=&quot;14&quot; FontWeight=&quot;Bold&quot;&gt;&lt;/ListViewItem&gt;

<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>

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


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

<ListViewItem Background="LightCoral" Foreground="Red"

FontFamily="Verdana" FontSize="12" FontWeight="Bold">

</StackPanel>

</CheckBox>

</ListViewItem>

<ListViewItem Background="LightGray" Foreground="Black"

FontFamily="Georgia" FontSize="14" FontWeight="Bold">

</StackPanel>

</CheckBox>

</ListViewItem>

<ListViewItem Background="LightBlue" Foreground="Purple"

FontFamily="Verdana" FontSize="12" FontWeight="Bold">

</StackPanel>

</CheckBox>

</ListViewItem>

<ListViewItem Background="LightGreen" Foreground="Green"

FontFamily="Georgia" FontSize="14" FontWeight="Bold">

</StackPanel>

</CheckBox>

</ListViewItem>

<ListViewItem Background="LightBlue" Foreground="Blue"

FontFamily="Verdana" FontSize="12" FontWeight="Bold">

</StackPanel>

</CheckBox>

</ListViewItem>

<ListViewItem Background="LightSlateGray" Foreground="Orange"

FontFamily="Georgia" FontSize="14" FontWeight="Bold">

</StackPanel>

</CheckBox>

</ListViewItem>

Ş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);
        }
         
    }

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);

}

Bunu paylaş:

Şunlar da Hoşunuza Gidebilir

Yorum yap X