.netwpflistbox

Updating WPF list when item changes


I have a WPF ListBox, and I've added some 'FooBar' objects as items (by code). FooBars aren't WPF objects, just dumb class with an overwritten ToString() function.

Now, when I change a property which influences the ToString, I'd like to get the ListBox to update.

  1. How can I do this 'quick and dirty' (like repaint).
  2. Are dependency properties the way to go on this?
  3. Is it worth it/always advisable, to create a WPF wrapper class for my FooBars?

Solution

  • Your type should implement INotifyPropertyChanged so that a collection can detect the changes. As Sam says, pass string.Empty as the argument.

    You also need to have the ListBox's data source be a collection that provides change notification. This is done via the INotifyCollectionChanged interface (or the not-so-WPF IBindingList interface).

    Of course, you need the INotifyCollectionChanged interface to fire whenever one of the member INotifyPropertyChanged items fires its event. Thankfully there are a few types in the framework that provide this logic for you. Probably the most suitable one is ObservableCollection<T>. If you bind your ListBox to an ObservableCollection<FooBar> then the event chaining will happen automatically.

    On a related note, you don't have to use a ToString method just to get WPF to render the object in the way that you want. You can use a DataTemplate like this:

    <ListBox x:Name="listBox1">
        <ListBox.Resources>
            <DataTemplate DataType="{x:Type local:FooBar}">
                <TextBlock Text="{Binding Path=Property}"/>
            </DataTemplate>
        </ListBox.Resources>
    </ListBox>
    

    In this way you can control the presentation of the object where it belongs -- in the XAML.

    EDIT 1 I noticed your comment that you're using the ListBox.Items collection as your collection. This won't do the binding required. You're better off doing something like:

    var collection = new ObservableCollection<FooBar>();
    collection.Add(fooBar1);
    
    _listBox.ItemsSource = collection;
    

    I haven't checked that code for compilation accuracy, but you get the gist.

    EDIT 2 Using the DataTemplate I gave above (I edited it to fit your code) fixes the problem.

    It seems strange that firing PropertyChanged doesn't cause the list item to update, but then using the ToString method isn't the way that WPF was intended to work.

    Using this DataTemplate, the UI binds correctly to the exact property.

    I asked a question on here a while back about doing string formatting in a WPF binding. You might find it helpful.

    EDIT 3 I'm baffled as to why this is still not working for you. Here's the complete source code for the window I'm using.

    Code behind:

    using System.Collections.ObjectModel;
    using System.ComponentModel;
    using System.Windows;
    
    namespace StackOverflow.ListBoxBindingExample
    {
        public partial class Window1
        {
            private readonly FooBar _fooBar;
    
            public Window1()
            {
                InitializeComponent();
    
                _fooBar = new FooBar("Original value");
    
                listBox1.ItemsSource = new ObservableCollection<FooBar> { _fooBar };
            }
    
            private void button1_Click(object sender, RoutedEventArgs e)
            {
                _fooBar.Property = "Changed value";
            }
        }
    
        public sealed class FooBar : INotifyPropertyChanged
        {
            public event PropertyChangedEventHandler PropertyChanged;
    
            private string m_Property;
    
            public FooBar(string initval)
            {
                m_Property = initval;
            }
    
            public string Property
            {
                get { return m_Property; }
                set
                {
                    m_Property = value;
                    OnPropertyChanged("Property");
                }
            }
    
            private void OnPropertyChanged(string propertyName)
            {
                var handler = PropertyChanged;
                if (handler != null)
                    handler(this, new PropertyChangedEventArgs(propertyName));
            }
        }
    }
    

    XAML:

    <Window x:Class="StackOverflow.ListBoxBindingExample.Window1"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:local="clr-namespace:StackOverflow.ListBoxBindingExample"
        Title="Window1" Height="300" Width="300">
        <DockPanel LastChildFill="True">
            <Button Click="button1_Click" DockPanel.Dock="Top">Click Me!</Button>
            <ListBox x:Name="listBox1">
                <ListBox.Resources>
                    <DataTemplate DataType="{x:Type local:FooBar}">
                        <TextBlock Text="{Binding Path=Property}"/>
                    </DataTemplate>
                </ListBox.Resources>
            </ListBox>
        </DockPanel>
    </Window>