I am having problem triggering button which place inside a Datatemplate which is designed for render listboxitems.
listboxitem has a data source as shown
public class WordListItem : INotifyPropertyChanged
{
public event PropertyChangedEventHandler PropertyChanged;
protected void NotifyPropertyChanged(string info)
{
if (this.PropertyChanged != null)
{
this.PropertyChanged(this, new PropertyChangedEventArgs(info));
}
}
private string word;
private int count;
public string Word
{
get { return word; }
set
{
if(value != word)
word = value;
NotifyPropertyChanged("Word");
}
}
public int Count
{
get { return count; }
set
{
if (value != count)
count = value;
NotifyPropertyChanged("Count");
}
}
}
and I have a datatemplate to render above data as listboxitem :
<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:M="clr-namespace:DictUI.Model"
xmlns:VM="clr-namespace:DictUI.ViewModel"
xmlns:V="clr-namespace:DictUI.Views"
>
<DataTemplate x:Key="ListItemStyle" DataType="{x:Type M:WordListItem}" >
<Border BorderThickness="1" BorderBrush="Gray"
Padding="7" Name="border" Margin="3">
<Grid >
<Grid.RowDefinitions>
<RowDefinition/>
<RowDefinition/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="30"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<!--star mark-->
<Polygon Grid.Row="0" Grid.Column="0" Grid.RowSpan="2"
Fill="Yellow" Stroke="Black" StrokeThickness="1"
StrokeLineJoin="Round" Width="20" Height="20"
Stretch="Fill"
Points="9,2 11,7 17,7 12,10 14,15 9,12 4,15 6,10 1,7 7,7"
Visibility="Hidden" Name="star"/>
<!-- word-->
<TextBlock Grid.Row="0" Grid.Column="1" Margin="0,0,8,0"
Name="Result_word"
Text="{Binding Path=Word}"
/>
<!--infor abour that word, display below word-->
<StackPanel Grid.Row="1" Grid.Column="1" Orientation="Horizontal">
<TextBlock Text="Times" />
<TextBlock Text="{Binding Path=Count}" Name="TotalChecking"/>
<Button Command="{Binding Path= ButtonClick}">
</Button>
<CheckBox Content="TestCH" removed="AliceBlue"/>
</StackPanel>
</Grid>
</Border>
</DataTemplate>
</ResourceDictionary>
as show in code, the datatemplate bound to attributes of WordListItem to render items in listbox. but I want to bind the command of Button ( which place in datatemplate ) to Viewmodel, its code is below:
public class WordListItemViewModel : ViewModelBase
{
private ObservableCollection<WordListItem> _WordItems;
public WordListItemViewModel()
{
if (_WordItems == null)
_WordItems = new ObservableCollection<WordListItem>();
}
public WordListItemViewModel(ObservableCollection<WordListItem> _wordItem)
{
if (_wordItem == null)
throw new Exception("word item is Null");
if (_WordItems == null)
_WordItems = new ObservableCollection<WordListItem>();
_WordItems = _wordItem;
_ButtonClick = new RelayCommand(param =>this.BtClick());
}
public ObservableCollection<WordListItem> WordItmes
{
get { return _WordItems; }
set
{
if (value != _WordItems)
_WordItems = value;
NotifyPropertyChanged("WordItmes");
}
}
private static RelayCommand _ButtonClick;
public ICommand ButtonClick
{
get
{
if (_ButtonClick == null)
_ButtonClick = new RelayCommand(param => this.BtClick(),param=>this.CanClick);
return _ButtonClick;
}
}
private void BtClick()
{
MessageBox.Show("button inside ListItem is clicked!");
}
private bool CanClick
{
get { return true; }
}
}
untill now DataTemplate render items well, but I am having problem to binding ButtonClick (which inside ViewModel) to button (which inside datatemplate).I think it is not good approach to binding button to command inside WordListItem, I should bind it to command inside ViewModel.
is that so difficult?
could anyone help me with this? I am a beginner in VMMV, so please help me with detailed answer or articles.
thanks in advance.