UWP TextBlock Текст не изменяется
Моей целью было составить список доступных для выбора шоу, где пользователь может выбрать один, а затем отредактировать данные о нем в правой панели.
у меня есть ObservableCollection
это связано с ListView
, Тест Show
S отображаются правильно. у меня тоже есть Show SelectedShow
это связано с использованием Mode.TwoWay
, Когда я выбираю другой Show
в ListView
, Я получаю соответствующее утверждение отладки.
TextBlock
"s Text
не меняется, когда я нажимаю разные Show
в ListView
,
Есть идеи?
MainPage.xaml:
<Page
x:Class="PlexHelper.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:PlexHelper"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="2*"></ColumnDefinition>
<ColumnDefinition Width="6*"></ColumnDefinition>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="*"></RowDefinition>
</Grid.RowDefinitions>
<StackPanel Orientation="Vertical">
<TextBox HorizontalAlignment="Stretch" Text="" PlaceholderText="Search shows..."/>
<ListView ItemsSource="{x:Bind Shows}" SelectedItem="{x:Bind SelectedShow, Mode=TwoWay}" SelectionChanged="OnSelectionChanged">
<ListView.ItemTemplate>
<DataTemplate x:DataType="local:Show">
<TextBlock Text="{x:Bind Name, Mode=OneWay}"/>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
</StackPanel>
<TextBlock Grid.Column="1" FontSize="50" HorizontalAlignment="Center" VerticalAlignment="Center" Text="{x:Bind SelectedShow.Name, Mode=OneWay}"></TextBlock>
</Grid>
</Page>
MainPage.xaml.cs:
using System.Collections.ObjectModel;
using System.Diagnostics;
using Windows.UI.Xaml.Controls;
namespace PlexHelper
{
public sealed partial class MainPage : Page
{
public ObservableCollection<Show> Shows { get; } = new ObservableCollection<Show>();
public Show SelectedShow { get; set; }
public MainPage()
{
this.InitializeComponent();
Shows.Add(new Show("Show 1"));
Shows.Add(new Show("Show 2"));
Shows.Add(new Show("Show 3"));
SelectedShow = Shows[0];
}
private void OnSelectionChanged(object sender, SelectionChangedEventArgs e)
{
Debug.WriteLine("now selected: " + SelectedShow.Name);
}
}
}
Show.cs:
using System.ComponentModel;
using System.Runtime.CompilerServices;
namespace PlexHelper
{
public class Show : INotifyPropertyChanged
{
private string _name;
public string Name
{
get => _name;
set
{
if (_name != value)
{
_name = value;
OnPropertyChanged();
}
}
}
public event PropertyChangedEventHandler PropertyChanged;
public Show(string name = "Default Show Name")
{
Name = name;
}
public void OnPropertyChanged([CallerMemberName] string propertyName = null) =>
PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
}
}
1 ответ
Вам также необходимо вызвать событие PropteryChanged для SelectedShow, чтобы отразить его в пользовательском интерфейсе.
Ваш MainPlage
должен выглядеть так:
public sealed partial class MainPage : Page, INotifyPropertyChanged
{
public ObservableCollection<Show> Shows { get; } = new ObservableCollection<Show>();
private Show _selectedShow;
public Show SelectedShow
{
get => _selectedShow;
set
{
if (_selectedShow != value)
{
_selectedShow = value;
OnPropertyChanged();
}
}
}
public MainPage()
{
this.InitializeComponent();
Shows.Add(new Show("Show 1"));
Shows.Add(new Show("Show 2"));
Shows.Add(new Show("Show 3"));
SelectedShow = Shows[0];
}
private void OnSelectionChanged(object sender, SelectionChangedEventArgs e)
{
Debug.WriteLine("now selected: " + SelectedShow.Name);
}
public event PropertyChangedEventHandler PropertyChanged;
public void OnPropertyChanged([CallerMemberName] string propertyName = null) =>
PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
}
Я бы лучше порекомендовал создать ViewModel, который содержит список Shows вместе с SelectedShow и Implement INotifyPropertyChanged в этой виртуальной машине.