Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to bind ReactiveList to WPF ListBox or ListView using code-behind?

Tags:

c#

wpf

reactiveui

I have a problem to display the contents of a ReactiveList in a ListBoxcontrol in my view. When I try to bind it via code-behind bindings (using this.OneWayBind(...)) the list stays empty. I am using the latest ReactiveUI version (6.1.0). If I change the binding to XAML-Binding and remove the call to OneWayBind(...), the list will display the five String elements.

I don't know why this isn't working, a simple TextBlock.Text-Binding works as expected (see the code).


MainWindow.xaml:

<Window x:Class="View_Location_Test.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:local="clr-namespace:View_Location_Test"
    xmlns:System="clr-namespace:System;assembly=mscorlib"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="MainWindow" Height="350" Width="525">
<StackPanel>
    <ListBox x:Name="ToasterList">
    <!-- This is working if you uncomment the above line and remove the OneWayBind call in the view-code: -->
    <!--<ListBox x:Name="ToasterList" ItemsSource="{Binding ToasterList}">-->
        <ListBox.Resources>
            <DataTemplate DataType="{x:Type System:String}">
                <TextBlock Text="{Binding}" />
            </DataTemplate>
        </ListBox.Resources>
    </ListBox>
    <TextBlock x:Name="ToasterName" />
</StackPanel>

MainWindow.xaml.cs:

public partial class MainWindow : Window, IViewFor<ViewModel>
{
    public MainWindow()
    {
        ViewModel = new ViewModel();
        DataContext = ViewModel;

        InitializeComponent();

        // bind
        this.OneWayBind(ViewModel, vm => vm.ToasterList, v => v.ToasterList.ItemsSource);
        this.Bind(ViewModel, vm => vm.Name, v => v.ToasterName.Text);
    }

    public ViewModel ViewModel
    {
        get { return (ViewModel)GetValue(ViewModelProperty); }
        set { SetValue(ViewModelProperty, value); }
    }

    public static readonly DependencyProperty ViewModelProperty =
        DependencyProperty.Register("ViewModel", typeof(ViewModel), typeof(MainWindow), new PropertyMetadata(null));

    object IViewFor.ViewModel
    {
        get { return ViewModel; }
        set { ViewModel = (ViewModel)value; }
    }
}

ViewModel.cs:

public class ViewModel : ReactiveObject
{
    public ViewModel()
    {
        ToasterList.Add("Toaster 1");
        ToasterList.Add("Toaster 2");
        ToasterList.Add("Toaster 3");
        ToasterList.Add("Toaster 4");
        ToasterList.Add("Toaster 5");
    }

    private String name = "My name";
    public String Name
    {
        get { return name; }
        set { this.RaiseAndSetIfChanged(ref name, value); }
    }

    private ReactiveList<String> toasterList = new ReactiveList<string>();
    public ReactiveList<String> ToasterList
    {
        get { return toasterList; }
        set { this.RaiseAndSetIfChanged(ref toasterList, value); }
    }
}
like image 278
Mirko Avatar asked Oct 06 '14 10:10

Mirko


1 Answers

This is because you've set the ItemsTemplate in a Weird Way™, so ReactiveUI thinks that you have no ItemsTemplate and is setting up the convention-based one (which is overkill for just a string).

Instead, set it like this:

<ListBox x:Name="ToasterList">
    <ListBox.ItemTemplate>
        <DataTemplate>
            <TextBlock Text="{Binding}" />
        </DataTemplate>
    </ListBox.ItemTemplate>
</ListBox>
like image 132
Ana Betts Avatar answered Sep 28 '22 23:09

Ana Betts