MVVM Pattern in Master-Detail when editing details - c#

i have a ObservableCollection with some data. They are displayed as Master (ListBox) and Detail (some Labels). I use binding and IsSynchronizedWithCurrentItem to show the correct details to the selected master item. This works all fine. Now i want to edit some details (load different image). I implemeted this a a Button Command in the ViewModel.
But how do i know which item is selected (UI) in the ViewModel-layer ?
Thanks for help

I don't really find the IsSynchronizedWithCurrentItem property that useful in MVVM scenarios.
Just expose another SelectedItem property in the ViewModel.
public ItemType SelectedItem
{
get { return _selectedItem; }
set
{
_selectedItem = value;
// your logic here
}
}

You need to bind a value or Enumerable of values of your ViewModel to the ListBox's SelectedItems property.
SelectedItems="{Binding VMProperty}"
http://msdn.microsoft.com/en-us/library/system.windows.controls.listbox.selecteditems(v=vs.110).aspx
If you only want one item selected you need to set:
SelectionMode="Single"
SelectedItem="{Binding VMProperty}"

If I understood you right, what you are looking for is the following
<ListBox SelectedItem="{Binding ObjectName, UpdateSourceTrigger=PropertyChanged}"/>
Plus under your ViewModel you have to declare the following
public YourObject ObjectName { get; set; }
Simple as that!

The normal way to detect which item in the collection is currently selected in the UI is to data bind a property of the same type as the items in the collection to the ListBox.SelectedItem property:
<ListBox ItemsSource="{Binding SomeCollection}"
SelectedItem="{Binding SomeProperty}" />
Now, whenever the user selects a new item, the SomeProperty setter will be called:
public YourDataType SomeProperty
{
get { return someProperty; }
set
{
someProperty = value;
// The value has just changed
}
}

Related

Binding to ObservableCollection works, but not ListCollectionView

I'm trying to get my ListCollectionView to bind to a combo box. However, it seems to only work when I bind to my ObservableCollection.
Properties:
private ListCollectionView sitesView;
public ListCollectionView SitesView
{
get { return sitesView; }
set
{
sitesView = value;
RaisePropertyChanged(() => SitesView);
}
}
public ObservableCollection<ISite> SitesCollection { get; set; }
Constructor:
SitesCollection = new ObservableCollection<ISite>();
SitesView = (ListCollectionView)CollectionViewSource.GetDefaultView(SitesCollection);
When binding like so:
<ComboBox Grid.Row="2" ItemsSource="{Binding SitesView, Mode=TwoWay}"/>
any item I add to SitesCollection does not get shown when I click the drop down in my combo box. But if I do the binding like so:
<ComboBox Grid.Row="2" ItemsSource="{Binding SitesCollection, Mode=TwoWay}"/>
it works fine and I see the items when I click the drop down.
Attempts at fixing: After I add the an item to the SitesCollection, I tried to raise property change notifications on both the ListCollectionView and the ObservableCollection and it didn't make a difference. Any ideas?
I didn't have time to test my answer; I apologize and will follow up.
I think your issue is because CollectionViewSource.GetDefaultView(...)
returns an ICollectionView, which I believe is essentially just a wrapper that enables the underlying data to be sorted.
Try setting SitesView to the SourceCollection of the DefaultView.
SitesView = (ListCollectionView)CollectionViewSource.GetDefaultView(SitesCollection).SourceCollection

Alternatives for bind an event to a property

I've a list box but if I click on an item, I must see the details of that item. I've made this code where I try to bind the SelectionChanged event to a property whit type RelayCommand and mode is two way.
<ListBox Grid.Row="2" Grid.Column="0" Grid.ColumnSpan="3"
SelectedItem="{Binding SelectedVillage, Mode=TwoWay}"
ItemContainerStyle="{StaticResource lstidflt}"
SelectionChanged="{Binding SelectedVillageChanged, Mode=TwoWay}"
ItemTemplate="{StaticResource weatheritemdt}"
ItemsSource="{Binding VillageList}" />
This doesn't work of course because you can't bind an event to a property or a property to a method and vice versa. You can only bind a property to a property. So the question is now are there alternatives to bind a SelectionChanged event to a property?
I use C# in a Windows universal 10 application with the MVVM light architecture.
You could just let the binding of the SelectedItem property
<ListBox ItemsSource="{Binding VillageList}" SelectedItem="{Binding SelectedVillage, Mode=TwoWay}" />
And do the job in the setter
public class VillageViewModel
{
public ObservableCollection<Village> VillageList { get; set; }
private Village selectedItem;
public Village SelectedItem
{
get { return selectedItem; }
set
{
if (selectedItem == value)
return;
selectedItem = value;
// Do logic on selection change.
}
}
}
What I do (in WPF) is bind the selected item to a full property then raise the event in the set part. It will look something like this;
private Village _SelectedVillage;
public Village SelectedVillage{
get {return _SelectedVillage;}
set {
_SelectedVillage = value;
RaiseEvent myEvent();
}
}
You can also raise the relaycommand or check for a trigger in xaml. If you go with the property, look at dependency property if it's available in win 10 universal.

ComboBox binding to referenced (relative) source

When binding ComboBox to referenced source:
<ComboBox SelectedValue="{Binding Source.SelectedItem}"
ItemsSource="{Binding Source.Items}"
DisplayMemberPath="Name" />
where Source is
SourceType _source;
public SourceType Source
{
get { return _source; }
set { _source = value; OnPropertyChanged(); }
}
and SourceType is
public class SourceType: INotifyPropertyChanged
{
Item _selectedItem;
public Item SelectedItem
{
get { return _selectedItem; }
set { _selectedItem = value; OnPropertyChanged(); }
}
public IReadOnlyList<Item> Items { get; }
public SourceType(...)
{
Items = new List<Items>(...) // **new** list generated from passed arguments
SelectedItem = Items.First();
}
}
and Item is
public class Item: INotifyPropertyChanged
{
string _name;
public string Name
{
get { return _name; }
set { _name = value; OnPropertyChanged(); }
}
}
following happens:
for only one source (if Source never changes) it works: ComboBox display list of Items and correct item is selected (I can see its Name when switching view);
for more than one items ComboBox bugs: has no selection (but drop-down list is there and working fine), selection doesn't persist when switching view or Source is changed (e.g. between 2 sources).
It seems like ComboBox has some problems to identify SelectedValue or find it in the ItemsSource. And I can't figure out what is wrong.
Debugging does not uncover anything: Items is set correctly, SelectedItem is first item from Items collection, yet ComboBox is displayed without selection. Why?
I will use a ObservableCollection instead of a List for Items and use SelectedItem for the ComboBox, not SelectedValue.
Read this great answer for differences between SelectedItem and SelectedValue
Difference between SelectedItem, SelectedValue and SelectedValuePath
#Giangregorio answer is good and working in general, but now I remember why I used SelectedValue in first place.
SelectedValue is useful whenever ItemsSource does not contains SelectedValue. If SelectedItem is used (as per answer), then binding will call setter with null as if the user could select null from the list. I am exploiting this case (to avoid having data-templates and more complicated ViewModel), so I have to stick with SelectedValue and I think I found the reason of the problem in otherwise should-work case.
I have to declare ItemsSource binding first and SelectedValue second:
<ComboBox ItemsSource="{Binding Source.Items}"
SelectedValue="{Binding Source.SelectedItem}"
DisplayMemberPath="Name" />
It works!
Sounds to me like another xaml-specific issue, similar to declare CommandParameter before Command problem.

Access WPF Controls [duplicate]

I am new to wpf and MVVM, and I've spent all day trying to get the value of a ComboBox to my ViewModel on SelectionChanged. I want to call a function in the selection changed process. In mvvm, what is the solution for it?
In MVVM, we generally don't handle events, as it is not so good using UI code in view models. Instead of using events such as SelectionChanged, we often use a property to bind to the ComboBox.SelectedItem:
View model:
public ObservableCollection<SomeType> Items { get; set; } // Implement
public SomeType Item { get; set; } // INotifyPropertyChanged here
View:
<ComboBox ItemsSource="{Binding Items}" SelectedItem="{Binding Item}" />
Now whenever the selected item in the ComboBox is changed, so is the Item property. Of course, you have to ensure that you have set the DataContext of the view to an instance of the view model to make this work. If you want to do something when the selected item is changed, you can do that in the property setter:
public SomeType Item
{
get { return item; }
set
{
if (item != value)
{
item = value;
NotifyPropertyChanged("Item");
// New item has been selected. Do something here
}
}
}

Multicolumn autosearch user control in wpf

I need to create an Auto search control which will show the results as rows as this one http://www.devexpress.com/Products/NET/Controls/WPF/Editors/lookup-editor.xml. However, I dont need the graphics and checkboxes here. A simple listview like appearance will work.
Please suggest how to create the user control using WPF.
Here has a nice article on Sorting, Filtering and Grouping ListView.
Basically you set CollectionViewSource to ListCollectionView. You can then use the Filter Property to filter the ListView.
If you're using an MVVM approach you could do the following:
Bind your search Textbox Text member, ListView's ItemsSource and SelectedItem to the ViewModel
Set 'UpdateSourceTrigger=PropertyChanged' on the TextBox's binding
In the setter of the property that the TextBox is bound to add logic that searches the ItemsSource collection and sets the SelectedItem bound property.
Something like this:
XAML:
<TextBox Text="{Binding Path=SearchTerm, UpdateSourceTrigger=PropertyChanged}"/>
<ListView ItemsSource="{Binding Path=SourceCollection}" SelectedItem="{Binding Path=SelectedSearchItem, Mode=TwoWay}" />
Code:
public class ViewModel : INotifyPropertyChanged
{
public string SearchTerm
{
get { return searchTerm; }
set {
searchTerm = value;
SelectedSearchItem = SourceCollection.FirstOrDefault(foo => foo.Name.Contains(searchTerm));
}
}
public Foo SelectedSearchItem
{
get { return selecedSearchItem; }
set {
selectedSearchItem = value;
// Raise PropertyChanged
}
}
public ObservableCollection<Foo> SourceCollection { get; set;}
}

Categories