用ObservableCollection填充ListBox并在StackPanel中显示所选项目的属性

Question

I'm tring to databind properties of an ObservableCollection to a ListBox (Just the Title property for example).

By clicking on one of the ListItem (with an event ), i'd like to display all the properties of the Collection into a StackPanel . After many tries, I still don't know how can I figure it out...

Here is my code behind :

public partial class TestListView : Window 
{

    public TestListView()
    {

        ObservableCollection<Programme> pgr = new ObservableCollection<Programme>();
        pgr = readfile();

        InitializeComponent();


    }

    public class Programme
    {
        public String Title { get; set; }
        public String Date { get; set; }
        public String Chaine { get; set; }

        public Programme(String Title, String Date, String Chaine)
        {
            this.Title = Title;
            this.Date = Date;
            this.Chaine = Chaine;
        }     
    }

Here is my XAML :

    <Window x:Class="Test.TestListView"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="clr-namespace:Test;assembly=Test"
    Title="TestListView" Height="500" Width="1000" x:Name="Window">

<Grid>
    <Grid.ColumnDefinitions>

        <ColumnDefinition Width="249*"/>
        <ColumnDefinition Width="743*"/>


    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>

        <RowDefinition Height="20*"/>
        <RowDefinition Height="428*"/>
        <RowDefinition Height="21*"/>

    </Grid.RowDefinitions>
    <ListBox Name="l1" ItemsSource="{Binding pgr}">
        <ListBox.ItemTemplate>
            <DataTemplate>
                <StackPanel>
                    <TextBlock Text="{Binding Title}"/>
                </StackPanel>
            </DataTemplate>
        </ListBox.ItemTemplate>
    </ListBox>
    <StackPanel Grid.Column="1" Grid.Row="1">
        <TextBox Margin="343,0,0,0" x:Name="Recherche"></TextBox>
        <Button Height="37" Margin="669,0,0,0" ></Button>
        <TextBlock x:Name="t1" Margin="214,0,293,0" Height="33" />
    </StackPanel>
</Grid>
    </Window>

Answer 1

You need to bind your data to (public) properties. Also, you don't need to use ObservableCollection ; any selection changes will be picked up anyhow.

Here's a working sample, with layout and other bits and pieces changed to make it compile for me:

public partial class MainWindow
{
    public IList<Programme> pgr { get; }

    public MainWindow()
    {
        pgr = new List<Programme>
            {
                new Programme("First", "FirstDate", "FirstChaine"),
                new Programme("Second", "SecondDate", "SecondChaine"),
                new Programme("Third", "ThirdDate", "ThirdChaine"),
            };

        InitializeComponent();
    }

    public class Programme
    {
        // No changes
    }
}

...and the XAML:

<Window
    x:Name="self"
    x:Class="WpfApplication1.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:WpfApplication1"
    mc:Ignorable="d"
    Title="MainWindow"
    Height="350"
    Width="525">
    <StackPanel DataContext="{Binding ElementName=self}" Orientation="Horizontal">
        <ListBox Name="l1" ItemsSource="{Binding pgr}">
            <ListBox.ItemTemplate>
                <DataTemplate>
                    <StackPanel>
                        <TextBlock Text="{Binding Title}"/>
                    </StackPanel>
                </DataTemplate>
            </ListBox.ItemTemplate>
        </ListBox>
        <StackPanel Orientation="Vertical">
            <TextBox Margin="10" Text="{Binding ElementName=l1,Path=SelectedItem.Title}" />
            <Button Height="37" Margin="0" Content="{Binding ElementName=l1,Path=SelectedItem.Date}"></Button>
            <TextBlock Margin="10" Height="33" Text="{Binding ElementName=l1,Path=SelectedItem.Chaine}" />
        </StackPanel>
    </StackPanel>
</Window>

Note the bindings that reference the selected item:

Text="{Binding ElementName=l1,Path=SelectedItem.Title}"