在TextBlocks中显示模型数据
本文关键字:模型 数据 显示 TextBlocks | 更新日期: 2023-09-27 18:07:14
我需要显示数据从ViewModel在简单的网格,其中包含标签和textBlock的数据。我试图将数据绑定到网格,并使用ElementName将网格的DataContext与textBlocks绑定。
书ViewModel:
namespace Books.ViewModels
{
public class BookViewModel : IViewModel, INotifyPropertyChanged
{
private Book book = new Book();
private ICommand AddCommand;
private ICommand RemoveCommand;
private ICommand ChangeCommand;
public event PropertyChangedEventHandler PropertyChanged;
public BookViewModel()
{
//initialize commands;
}
public string Name
{
get { return book.Name; }
set { book.Name = value; }
}
public string Authors
{
get
{
return string.Join(", ", book.Authors.Select(x => x.Name));
}
set
{
//need to implemented
}
}
public string ISBN
{
get { return book.ISBN; }
set { book.ISBN = value; }
}
public int Pages
{
get { return book.Pages; }
set { book.Pages = value; }
}
public string Tags
{
get
{
return string.Join(", ", book.Tags);
}
set
{
//not implemented
}
}
public int PublicationYear
{
get { return book.PublicationYear; }
set { book.PublicationYear = value; }
}
public string House
{
get
{
return book.House.Name;
}
set
{
//not implemented
}
}
public ICommand AddClick
{
get
{
PropertyChanged?.Invoke(this, new PropertyChangedEventArgs("Add"));
return AddCommand;
}
}
public ICommand RemoveClick
{
get
{
PropertyChanged?.Invoke(this, new PropertyChangedEventArgs("Remove"));
return RemoveCommand;
}
}
public ICommand ChangeClick
{
get
{
PropertyChanged?.Invoke(this, new PropertyChangedEventArgs("Change"));
return ChangeCommand;
}
}
}
}
grid:
<Grid x:Name="bookGrid"
Grid.Column="1">
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Label Grid.Row="0" Grid.Column="0" Content="Title:"/>
<Label Grid.Row="1" Grid.Column="0" Content="Author(s):"/>
<Label Grid.Row="2" Grid.Column="0" Content="ISBN:"/>
<Label Grid.Row="3" Grid.Column="0" Content="Pages:"/>
<Label Grid.Row="4" Grid.Column="0" Content="Tags:"/>
<Label Grid.Row="5" Grid.Column="0" Content="Publication Year:"/>
<Label Grid.Row="6" Grid.Column="0" Content="Publication House:"/>
<TextBlock Grid.Column="1" Grid.Row="0" Margin="3" Text="{Binding ElementName=bookGrid, Path=Name}"/>
<TextBlock Grid.Column="1" Grid.Row="1" Margin="3" Text="{Binding ElementName=bookGrid, Path=Authors}"/>
<TextBlock Grid.Column="1" Grid.Row="2" Margin="3" Text="{Binding ElementName=bookGrid, Path=ISBN}"/>
<TextBlock Grid.Column="1" Grid.Row="3" Margin="3" Text="{Binding ElementName=bookGrid, Path=Pages}"/>
<TextBlock Grid.Column="1" Grid.Row="4" Margin="3" Text="{Binding ElementName=bookGrid, Path=Tags}"/>
<TextBlock Grid.Column="1" Grid.Row="5" Margin="3" Text="{Binding ElementName=bookGrid, Path=PublicationYear}"/>
<TextBlock Grid.Column="1" Grid.Row="6" Margin="3" Text="{Binding ElementName=bookGrid, Path=House}"/>
</Grid>
背后的代码:
bookGrid.DataContext = Manager.books.First();
只需将TextBlock绑定更改为:
<TextBlock Grid.Column="1" Grid.Row="0" Margin="3" Text="{Binding Name}"/>
在视图模型中添加一个通知器方法:
public void NotifyPropertyChanged([CallerMemberName] string propertyName = null)
{
if (this.PropertyChanged != null)
{
this.PropertyChanged(this, new PropertyChangedEventArgs(propertyName));
}
}
并在每次属性更改后调用此方法,如:
public string Name
{
get { return book.Name; }
set
{
book.Name = value;
this.NotifyPropertyChanged();
}
}