<Window x:Class="MVVM_ListView.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:MVVM_ListView"
        xmlns:mv ="clr-namespace:MVVM_ListView.ViewModels"
        xmlns:i="http://schemas.microsoft.com/expression/2010/interactivity"
        mc:Ignorable="d"
        Title="MainWindow" Height="350" Width="525">
    <Window.DataContext>
        <mv:PersonViewModel/>
    </Window.DataContext>
    
    <StackPanel Margin="5">
        <TextBox Height="24" Name="txtName" Text="[Your name]" Width="180"/>
        <Grid HorizontalAlignment="Center">
            <Grid.RowDefinitions>
                <RowDefinition/>
                <RowDefinition/>
            </Grid.RowDefinitions>
            <Grid.ColumnDefinitions>
                <ColumnDefinition/>
                <ColumnDefinition/>
            </Grid.ColumnDefinitions>
            <Button Content="Add" Height="30" Width="80" Margin="5" 
                    Name="AddButton"
                    Command="{Binding AddCommand}"
                    CommandParameter="{Binding Text, ElementName=txtName}"/>
            <Button Content="Update" Height="30" Width="80" Margin="5" 
                    Name="UpdateButton"
                    Grid.Column="1"/>
            <Button Content="Replace" Height="30" Width="80" Margin="5" 
                    Name="ReplaceButton"
                    Grid.Row="1"/>
            <Button Content="Clear" Height="30" Width="80" Margin="5" 
                    Name="ClearButton"
                    Grid.Column="1" Grid.Row="1"/>
        </Grid>

        <ListBox Name="ListName" ItemsSource="{Binding Persons}" Height="150" Width="200" Margin="5">
            
            <!-- Sử dụng thư viện Iteractivity Microsoft Expression Blend SDK 
            để tương tác với các event -->
            <!--<i:Interaction.Triggers>
                <i:EventTrigger EventName="MouseDoubleClick">
                    <i:InvokeCommandAction Command="{Binding DeleteCommand}"
                                           CommandParameter="{Binding SelectedItem, ElementName=ListName}">
                    </i:InvokeCommandAction>
                </i:EventTrigger>-->
                <!--<i:EventTrigger EventName="Click">
                    <i:InvokeCommandAction Command="{Binding DeleteCommand}"
                                           CommandParameter="{Binding SelectedItem, ElementName=ListName}">
                        
                    </i:InvokeCommandAction>
                </i:EventTrigger>
            </i:Interaction.Triggers>-->

            <ListBox.ItemTemplate>
                <DataTemplate>
                    <DockPanel>
                        <Button Content="X" Width="20" Height="20"
                                Style="{StaticResource {x:Static ToolBar.ButtonStyleKey}}"
                                Command="{Binding ElementName=ListName, Path=DataContext.DeleteCommand}"
                                CommandParameter="{Binding SelectedItem, ElementName=ListName}">
                        </Button>
                        <TextBlock Text="{Binding Name}" Margin="5, 3, 0, 0"/>
                    </DockPanel>
                </DataTemplate>
            </ListBox.ItemTemplate>
        
        </ListBox>
    </StackPanel>
</Window>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75

using MVVM_ListView.Models;
using System;
using System.Collections.Generic;
using System.Collections.ObjectModel;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Input;

namespace MVVM_ListView.ViewModels
{
    public class PersonViewModel
    {
        public ObservableCollection<Person> Persons { get; set; }
        public ICommand DeleteCommand { get; set; }
        public ICommand AddCommand { get; set; }

        public PersonViewModel()
        {
            Persons = new ObservableCollection<Person>
            {
                new Person{Name = "Nguyen Duc Anh"},
                new Person{Name = "Nguyen Hoang Quynh Anh"},
                new Person{Name = "Nguyen Van An"},
                new Person{Name = "Mai Thanh Binh"},
                new Person{Name = "Silver Ben Spear"},
            };

            AddCommand = new RelayCommand<string>((s) => true, (s) => Persons.Add(new Person { Name = s }));
            DeleteCommand = new RelayCommand<Person>((p) => p != null, (p) => Persons.Remove(p));
        }  
    }
}

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36