ETO - Binding to Collection

Hey people,

Currently I’m playing around with ETO and started to implement a MVVM-Pattern.
In the end it should be used within the grasshopper-workflow to build custom UI-Interfaces on the fly.

I have no no problem to bind to “single-value” Property, but when it comes to collection I can not wrap my head around. I have not found any useful guidance in the www to do so.

Do I need to use a ObservableCollection? or any special class to deal with this?

I mean, Its not a big deal to populate a control from a collection with code directly (mod in loop) but ya… Isn’t there direct binding-mechanism like its used, lets say, XAML? Maybe in combination with a converter-object?

If anybody has an advice (OR a good reference/link to a working pattern) I would be very thankful to hear from u.

Greets
Mark

1 Like

In the example below, I have a view model that has an ObservableCollection of ‘Properties’ and I bind the selected item to the view-model’s property ‘SelectedProperty’.

You need to set three things: the control’s data store and data context, and the SelectedValueBinding.

Is this helpful?

class PropertyListView : Panel
{
    public PropertyListView(PropertyListViewModel vm)
    {
		Label properties = new Label {Text = "Properties", Font = new Font(FontFamilies.Sans, 16.0f)};
		ListBox listbox = new ListBox
		{
		    DataContext = vm,
		    DataStore = vm.Properties
		};
		listbox.SelectedValueBinding.BindDataContext((PropertyListViewModel avm) => avm.SelectedProperty);

		Content = new TableLayout
		{
		    Padding = new Padding(5),
		    Spacing = new Size(5,5),
		    Rows =
		    {
		        new TableRow(properties),
		        new TableRow(listbox)
		    }
		};
        
    }
1 Like

Thanks for ur answer.

I tried ur advice, and had kind of a success.
But, as I can see, ur example works for a ListBox (going to use it later :wink:), but for now I’m just looking for a way to do the same with soemthing like a Stackpanel, but I do not find any equivalent class which has a Property named “DataStore” to follow ur pattern.

Do u have any advices in this direction?

Edit:
I’m also looking for a place to but my ‘IValueConverter’ to convert the given data, to a control.
But where? :persevere:

StackPanel is not a control that has a list of values, but it is a container for other controls. Just like I used TableLayout in the example I give above, you could also use StackPanel.

As for converters, maybe the example from my code below can give you some insight in how to use/bind them.

PropertyViewModel pvm; // defined elsewhere
// text area control
TextArea ta = new TextArea
{
  Height = 450,
  Width = 250,
  DataContext = vm,
  AcceptsReturn = true,
  AcceptsTab = false,
};

// bind the text to the view-model property StringRepresentation
ta.TextBinding.BindDataContext((PropertyViewModel pvm) => pvm.StringRepresentation);

// create a binding to the boolean property IsStringRepresentationValid
var validBinding = Binding.Property((PropertyViewModel  pvm) => pvm.IsStringRepresentationValid);

// convert it to a color binding
var colorBinding = validBinding.Convert(tf => tf ? Colors.White : Colors.PaleVioletRed);

// use the color binding for setting the background.
// end result: the text area shows a white background if the entered string is valid
// and a red background if the entered string is not valid.
ta.Bind(area => area.BackgroundColor, vm, colorBinding);
1 Like

Hey @menno,

I’m very thankful for ur support.
I allready know about this kind of bindings, and it works just fine in other cases. I use a different overload to setup my bindings, but I guess in the end it should become the same.

I tried to use this thingy with a StackLayout to bind a List of Controls to it. Do be more precise, I do not bind a List of Controls, I try to bind a List of Factories which is going to converted by building a Control (yellow) which is bind to an other Viewmodel setted up deeper in the build-tree.

At least it looks like Items (green) should be the right spot to bind [ *.Items.Add(…) ].
It does not work at all.
I tried some others which sound promising, but without any success.

Do u have some insights in this case, or any other idea how to go on?


EXCURSE:
I could go some other way (not use bindings at all with containers), but this comes with some sideeffects which I want to avoid. I want to be able to set the content of the layout after the creation (red group), without breaking the MVVM-pattern…

I’m looking for this, so Controls and Containers can follow the same rules during the use within Grasshopper… So there is no need to specialize major components at all…


Greets
Mark

1 Like