We Keep Coding

WPF Select multiple items in DataGrid from ViewModel with twoway binding

I'm trying to create a twoway binding to the selected items in a WPF DataGrid. I want to be able to select multiple items from the ViewModel and also from the actual UserControl. I know I cannot directly set the selected items since this property is readonly.
I'm thinking of binding to a DependencyProperty and subscribing to the SelectionChanged event of the DataGrid in the code behind.
<UserControl.Resources>
<Style TargetType="local:ListView">
<Setter Property="SelectedItems" Value="{Binding SelectedItemsVM, Mode=TwoWay}"/>
</Style>
</UserControl.Resources>
<DataGrid Name="ObjectListDataGrid" SelectionChanged="OnSelectionChanged">
In the code behind I create the DependencyProperty. When this is set, I subscribe to the CollectionChanged event.
public ObservableCollection<object> SelectedItems
{
get { return (ObservableCollection<object>)GetValue(SelectedItemsProperty); }
set { SetValue(SelectedItemsProperty, value); }
}
public static readonly DependencyProperty SelectedItemsProperty =
DependencyProperty.Register("SelectedItems", typeof(ObservableCollection<object>), typeof(ListView), new PropertyMetadata(default(ObservableCollection<object>), OnSelectedItemsChanged));
private static void OnSelectedItemsChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
{
var collection = e.NewValue as ObservableCollection<object>;
if (collection != null)
{
collection.CollectionChanged -= OnSelectedItemsCollectionChanged;
collection.CollectionChanged += OnSelectedItemsCollectionChanged;
}
}
I use the EventHandler to the SelectionChanged event of the DataGrid to add/remove the items in the collection.
private void OnSelectionChanged(object sender, SelectionChangedEventArgs args)
{
SelectedItems.Remove(args.RemovedItems);
SelectedItems.Add(args.AddedItems);
}
Now I want to select the rows needed in the OnSelectedItemsCollectionChanged method when the collection changes.
private static void OnSelectedItemsCollectionChanged(object sender, NotifyCollectionChangedEventArgs e)
{
foreach (DataGridRow row in ObjectListDataGrid.Rows())
{
if(ObjectListDataGrid.SelectedItems.Contains(row.Item))
row.IsSelected = true;
else
row.IsSelected = false;
}
}
The problem:
Since the OnSelectedItemsCollectionChanged method is static, I do not have access to the ObjectListDataGrid. Is there any way to overcome this, or do it in a different way?
For completeness, the DataGrid.Rows() method is an extension method to get a list of the rows:
public static IEnumerable<DataGridRow> Rows(this DataGrid grid)
{
var itemsSource = grid.ItemsSource as IEnumerable;
if (null == itemsSource) yield return null;
foreach (var item in itemsSource)
{
var row = grid.ItemContainerGenerator.ContainerFromItem(item) as DataGridRow;
if (null != row) yield return row;
}
}

Your OnSelectedItemsCollectionChanged method must not be static.
Cast the DependencyObject argument of the OnSelectedItemsChanged method to your ListView class. Also make sure to detach the handler from the old value of the SelectedItems property.
private static void OnSelectedItemsChanged(
DependencyObject d, DependencyPropertyChangedEventArgs e)
{
var listView = (ListView)d;
var oldCollection = (INotifyCollectionChanged)e.OldValue;
var newCollection = (INotifyCollectionChanged)e.NewValue;
if (oldCollection != null)
{
oldCollection.CollectionChanged -= listView.OnSelectedItemsCollectionChanged;
}
if (newCollection != null)
{
newCollection.CollectionChanged += listView.OnSelectedItemsCollectionChanged;
}
}
private void OnSelectedItemsCollectionChanged(
object sender, NotifyCollectionChangedEventArgs e)
{
foreach (var row in ObjectListDataGrid.Rows())
{
row.IsSelected = ObjectListDataGrid.SelectedItems.Contains(row.Item);
}
}

Change the background color of a WPF editable ComboBox programmatically

I'm trying to dynamically change the background color of an editable ComboBox at runtime, using code. In particular, I want to change the background of the editable TextBox that is part of the ComboBox.
There are several answers about this on SO, like this one:
WPF change the background color of an edittable combobox in code
however, the problem is that they're all based on XAML and editing default templates. I don't want to do that, I'm searching for a generic solution that works with just code.
Is it possible? I tried the solution that seems obvious:
TextBox textBox = (TextBox)comboBox.Template.FindName("PART_EditableTextBox", comboBox);
textBox.Background = Brushes.Yellow;
But this does absolutely nothing. What am I missing?

This is how you can do it
<ComboBox Loaded="MyCombo_OnLoaded" x:Name="myCombo" IsEditable="True"></ComboBox>
private void MyCombo_OnLoaded(object sender, RoutedEventArgs e)
{
var textbox = (TextBox)myCombo.Template.FindName("PART_EditableTextBox", myCombo);
if (textbox!= null)
{
var parent = (Border)textbox.Parent;
parent.Background = Brushes.Yellow;
}
}

Reusable AttachedProperty solution for xaml only fans:
<ComboBox Background="Orange" IsEditable="True" Text="hi" local:ComboBoxHelper.EditBackground="Red"></ComboBox>
Implementation:
public static class ComboBoxHelper
{
public static readonly DependencyProperty EditBackgroundProperty = DependencyProperty.RegisterAttached(
"EditBackground", typeof (Brush), typeof (ComboBoxHelper), new PropertyMetadata(default(Brush), EditBackgroundChanged));
private static void EditBackgroundChanged(DependencyObject dependencyObject, DependencyPropertyChangedEventArgs args)
{
var combo = dependencyObject as ComboBox;
if (combo != null)
{
if (!combo.IsLoaded)
{
RoutedEventHandler comboOnLoaded = null;
comboOnLoaded = delegate(object sender, RoutedEventArgs eventArgs)
{
EditBackgroundChanged(dependencyObject, args);
combo.Loaded -= comboOnLoaded;
};
combo.Loaded += comboOnLoaded;
return;
}
var part = combo.Template.FindName("PART_EditableTextBox", combo);
var tb = part as TextBox;
if (tb != null)
{
var parent = tb.Parent as Border;
if (parent != null)
{
parent.Background = (Brush)args.NewValue;
}
}
}
}
[AttachedPropertyBrowsableForType(typeof(ComboBox))]
public static void SetEditBackground(DependencyObject element, Brush value)
{
element.SetValue(EditBackgroundProperty, value);
}
[AttachedPropertyBrowsableForType(typeof(ComboBox))]
public static Brush GetEditBackground(DependencyObject element)
{
return (Brush) element.GetValue(EditBackgroundProperty);
}
}

Raise/Fire Listbox SelectionChangedEvent manually

I want to select programatically multiple items in my ListBox. So, to be as mvvm friendly as possible, I create a custom control inherited from ListBox. In this custom control I've made a dependency property allowing items selection changes. Here is the code of the OnPropertyChanged part :
private static void OnSetSelectionToPropertyChanged
(DependencyObject d, DependencyPropertyChangedEventArgs e)
{
InitializableListBox list = d as InitializableListBox;
Dictionary<int, string> toSelect = e.NewValue as Dictionary<int, string>;
if (toSelect == null)
return;
list.SetSelectedItems(toSelect);
}
The selection works great, but this solution does not raise the OnSelectionChanged event
So I try also :
private static void OnSetSelectionToPropertyChanged
(DependencyObject d, DependencyPropertyChangedEventArgs e)
{
InitializableListBox list = d as InitializableListBox;
Dictionary<int, string> toSelect = e.NewValue as Dictionary<int, string>;
if (toSelect == null)
return;
SelectionChangedEventArgs e_selChanged;
List<Object> removed = new List<object>();
List<Object> added = new List<object>();
//Clear the SelectedItems list
while(list.SelectedItems.Count > 0)
{
removed.Add(list.SelectedItems[0]);
list.SelectedItems.RemoveAt(0);
}
//Add each selected items
foreach (var item in toSelect)
{
list.SelectedItems.Add(item);
added.Add(list.SelectedItems[list.SelectedItems.Count - 1]);
}
//Raise the SelectionChanged event
e_selChanged = new SelectionChangedEventArgs(SelectionChangedEvent,removed,added);
list.OnSelectionChanged(e_selChanged);
}
But this was not better. I think I'm not dealing the right way with the event so if you could help me, that would be great.
Thanks in advance.
EDIT
I have found another solution (more a hack actually) than #NETscape. I don't think it's better, but it seems to work pretty well, and it's maybe easier.
The trick is to made a dependency property wich allow you to access the SelectedItems property (wich is readonly and unbindable on the normal ListBox). Here is the code of my custom ListBox :
public class InitializableListBox : ListBox
{
public InitializableListBox()
{
SelectionChanged += CustomSelectionChanged;
}
private void CustomSelectionChanged(object sender, SelectionChangedEventArgs e)
{
InitializableListBox s = sender as InitializableListBox;
if (s == null)
return;
s.CustomSelectedItems = s.SelectedItems;
}
#region CustomSelectedItems DependyProperty
public static DependencyProperty CustomSelectedItemsProperty =
DependencyProperty.RegisterAttached("CustomSelectedItems",
typeof(System.Collections.IList),typeof(InitializableListBox),
new PropertyMetadata(null, OnCustomSelectedItemsPropertyChanged));
public System.Collections.IList CustomSelectedItems
{
get
{
return (System.Collections.IList)GetValue(CustomSelectedItemsProperty);
}
set
{
SetValue(CustomSelectedItemsProperty, value);
}
}
private static void OnCustomSelectedItemsPropertyChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
{
InitializableListBox list = d as InitializableListBox;
System.Collections.IList toSelect = e.NewValue as System.Collections.IList;
if (toSelect == null)
return;
list.SetSelectedItems(toSelect);
}
#endregion
}

See this
If you set your ItemsSource to a collection, and the objects in the collection implement INPC, you can set the Style on ListViewItem to use the bound objects IsSelected property.
See this answer to understand what I mean.
Let's say you have ItemsSource="{Binding Items}", then you can do something like:
Items.Where(item => item.IsSelected == true);
to return your list of items that are selected.
You could also do Items[0].IsSelected = true; to programmatically select an item.
In short, you shouldn't have to use a custom control to implement multiple selection on a ListView.
EDIT
I experienced the virtualization problem when I was implementing Telerik's RadGridView. I used a behavior to counter this problem and it seems to have worked:
public class RadGridViewExt : Behavior<RadGridView>
{
private RadGridView Grid
{
get
{
return AssociatedObject as RadGridView;
}
}
public INotifyCollectionChanged SelectedItems
{
get { return (INotifyCollectionChanged)GetValue(SelectedItemsProperty); }
set { SetValue(SelectedItemsProperty, value); }
}
public static readonly DependencyProperty SelectedItemsProperty =
DependencyProperty.Register("SelectedItems", typeof(INotifyCollectionChanged), typeof(RadGridViewExt), new PropertyMetadata(OnSelectedItemsPropertyChanged));
private static void OnSelectedItemsPropertyChanged(DependencyObject target, DependencyPropertyChangedEventArgs args)
{
var collection = args.NewValue as INotifyCollectionChanged;
if (collection != null)
{
collection.CollectionChanged += ((RadGridViewExt)target).ContextSelectedItemsCollectionChanged;
}
}
protected override void OnAttached()
{
base.OnAttached();
Grid.SelectedItems.CollectionChanged += GridSelectedItemsCollectionChanged;
}
void ContextSelectedItemsCollectionChanged(object sender, NotifyCollectionChangedEventArgs e)
{
UnsubscribeFromEvents();
Transfer(SelectedItems as IList, AssociatedObject.SelectedItems);
SubscribeToEvents();
}
void GridSelectedItemsCollectionChanged(object sender, System.Collections.Specialized.NotifyCollectionChangedEventArgs e)
{
UnsubscribeFromEvents();
Transfer(AssociatedObject.SelectedItems, SelectedItems as IList);
SubscribeToEvents();
}
private void SubscribeToEvents()
{
AssociatedObject.SelectedItems.CollectionChanged += GridSelectedItemsCollectionChanged;
if (SelectedItems != null)
{
SelectedItems.CollectionChanged += ContextSelectedItemsCollectionChanged;
}
}
private void UnsubscribeFromEvents()
{
AssociatedObject.SelectedItems.CollectionChanged -= GridSelectedItemsCollectionChanged;
if (SelectedItems != null)
{
SelectedItems.CollectionChanged -= ContextSelectedItemsCollectionChanged;
}
}
public static void Transfer(IList source, IList target)
{
if (source == null || target == null)
return;
target.Clear();
foreach (var o in source)
{
target.Add(o);
}
}
}
Inside RadGridView control:
<i:Interaction.Behaviors>
<local:RadGridViewExt SelectedItems="{Binding SelectedItems}" />
</i:Interaction.Behaviors>
where
xmlns:i="clr-namespace:System.Windows.Interactivity;assembly=System.Windows.Interactivity"
and remember to add reference to Interactivity assembly.

ListBox has a property called SelectionMode. You can set it to Multiple to enable multiple selection.
<ListBox x:Name="MyListBox" SelectionMode="Multiple"/>
You can use SelectedItems property to get all the selected items afterwards.

autocompletebox focus in wpf

when I try to focus on my "autocompletetextbox" I failed I write autocompletetextbox.focus()
but the cursor still focus in another what should I do or write to enable to write in it or focus?

I experienced the same thing -- it does not work properly in its current form (I expect you're talking about the AutoCompleteBox that comes with the February 2010 release of WPFToolkit).
I created a subclass:
public class AutoCompleteFocusableBox : AutoCompleteBox
{
public override void OnApplyTemplate()
{
base.OnApplyTemplate();
var textbox = Template.FindName("Text", this) as TextBox;
if(textbox != null) textbox.Focus();
}
}
This sets focus to the actual TextBox (called "Text") that is part of the default ControlTemplate.

You will have to override the Focus method to find the template of the Textbox.
public class FocusableAutoCompleteBox : AutoCompleteBox
{
public new void Focus()
{
var textbox = Template.FindName("Text", this) as TextBox;
if (textbox != null) textbox.Focus();
}
}

This is very old question, but I want to share my work-around.
Keyboard.Focus(autocompletetextbox);
autocompletetextbox.MoveFocus(new TraversalRequest(FocusNavigationDirection.Next));
This works in WPFToolkit v3.5.50211.1 on Visual Studio Express 2015 for Windows Desktop

It seems that you have to wait for the auto complete box to load first. Then set focus
<sdk:AutoCompleteBox
x:Name="_employeesAutoCompleteBox"
ItemsSource="{Binding Path=Employees}"
SelectedItem="{Binding SelectedEmployee, Mode=TwoWay}"
ValueMemberPath="DisplayName" >
</sdk:AutoCompleteBox>
_employeesAutoCompleteBox.Loaded +=
(sender, e) => ((AutoCompleteBox)sender).Focus();

This is my solution,
I found it easier than having inherited class
private void UserControl_Loaded(object sender, RoutedEventArgs e)
{
var textBox = FindVisualChild<TextBox>(CodedCommentBox);
textBox.Focus();
}
private TChildItem FindVisualChild<TChildItem>(DependencyObject obj) where TChildItem : DependencyObject
{
for (var i = 0; i < VisualTreeHelper.GetChildrenCount(obj); i++)
{
var child = VisualTreeHelper.GetChild(obj, i);
var item = child as TChildItem;
if (item != null)
{
return item;
}
var childOfChild = FindVisualChild<TChildItem>(child);
if (childOfChild != null)
{
return childOfChild;
}
}
return null;
}

This is my solution for setting focus on AutoCompleteTextBox control Text:
private void MyPageLoaded(object sender, RoutedEventArgs e)
{
var myPage = (MyControl)sender;
var autoTextBox = (AutoCompleteTextBox)myPage.FindName("AutoTextBox");
if (autoTextBox != null)
{
var innerTextBox = autoTextBox.textBox;
if (innerTextBox != null)
{
innerTextBox.Focus();
}
}
}

You could also use a extension method for this:
public static void ForceFocus(this AutoCompleteBox box)
{
if (box.Template.FindName("Text", box) is TextBox textbox)
{
textbox.Focus();
}
}

How to control the scroll position of a ListBox in a MVVM WPF app

I have got a big ListBox with vertical scrolling enabled, my MVVM has New and Edit ICommands.
I am adding new item to the end of the collection but I want the scrollbar also to auto position to the End when I call my MVVM-AddCommand.
I am also making an item editable(By calling EditCommand with a particular row item) from some other part of the application so that my ListBoxItem getting in to edit mode using DataTrigger, but how will I bring that particular row(ListBoxItem) to the view by adjusting the scroll position.
If I am doing it in the View side I can call listBox.ScrollInToView(lstBoxItem).
But what is the best way to solve this common Scroll issue from an MVVM perspective.

I typically set IsSynchronizedWithCurrentItem="True" on the ListBox. Then I add a SelectionChanged handler and always bring the selected item into view, with code like this:
private void BringSelectionIntoView(object sender, SelectionChangedEventArgs e)
{
Selector selector = sender as Selector;
if (selector is ListBox)
{
(selector as ListBox).ScrollIntoView(selector.SelectedItem);
}
}
From my VM I can get the default collection view and use one of the MoveCurrent*() methods to ensure that the item being edited is the current item.
CollectionViewSource.GetDefaultView(_myCollection).MoveCurrentTo(thisItem);
NOTE: Edited to use ListBox.ScrollIntoView() to accomodate virtualization

Using this in MVVM can be easily accomplished via an attached behavior like so:
using System.Windows.Controls;
using System.Windows.Interactivity;
namespace Jarloo.Sojurn.Behaviors
{
public sealed class ScrollIntoViewBehavior : Behavior<ListBox>
{
protected override void OnAttached()
{
base.OnAttached();
AssociatedObject.SelectionChanged += ScrollIntoView;
}
protected override void OnDetaching()
{
AssociatedObject.SelectionChanged -= ScrollIntoView;
base.OnDetaching();
}
private void ScrollIntoView(object o, SelectionChangedEventArgs e)
{
ListBox b = (ListBox) o;
if (b == null)
return;
if (b.SelectedItem == null)
return;
ListBoxItem item = (ListBoxItem) ((ListBox) o).ItemContainerGenerator.ContainerFromItem(((ListBox) o).SelectedItem);
if (item != null) item.BringIntoView();
}
}
}
Then in the View ad this reference at the top:
xmlns:i="clr-namespace:System.Windows.Interactivity;assembly=System.Windows.Interactivity"
And do this:
<ListBox ItemsSource="{Binding MyData}" SelectedItem="{Binding MySelectedItem}">
<i:Interaction.Behaviors>
<behaviors:ScrollIntoViewBehavior />
</i:Interaction.Behaviors>
</ListBox>
Now when the SelectedItem changes the behavior will do the BringIntoView() call for you.

This is the attached property form of the accepted answer:
using System.Windows;
using System.Windows.Controls;
namespace CommonBehaviors
{
public static class ScrollCurrentItemIntoViewBehavior
{
public static readonly DependencyProperty AutoScrollToCurrentItemProperty =
DependencyProperty.RegisterAttached("AutoScrollToCurrentItem",
typeof(bool), typeof(ScrollCurrentItemIntoViewBehavior),
new UIPropertyMetadata(default(bool), OnAutoScrollToCurrentItemChanged));
public static bool GetAutoScrollToCurrentItem(DependencyObject obj)
{
return (bool)obj.GetValue(AutoScrollToCurrentItemProperty);
}
public static void OnAutoScrollToCurrentItemChanged(DependencyObject obj, DependencyPropertyChangedEventArgs e)
{
var listBox = obj as ListBox;
if (listBox == null) return;
var newValue = (bool)e.NewValue;
if (newValue)
listBox.SelectionChanged += listBoxSelectionChanged;
else
listBox.SelectionChanged -= listBoxSelectionChanged;
}
static void listBoxSelectionChanged(object sender, SelectionChangedEventArgs e)
{
var listBox = sender as ListBox;
if (listBox == null || listBox.SelectedItem == null || listBox.Items == null) return;
listBox.Items.MoveCurrentTo(listBox.SelectedItem);
listBox.ScrollIntoView(listBox.SelectedItem);
}
public static void SetAutoScrollToCurrentItem(DependencyObject obj, bool value)
{
obj.SetValue(AutoScrollToCurrentItemProperty, value);
}
}
}
Usage:
<ListBox ItemsSource="{Binding}"
IsSynchronizedWithCurrentItem="True"
behaviors:ScrollCurrentItemIntoViewBehavior.AutoScrollToCurrentItem="True">

If the above code doesn't work for you, give this a try
public class ListBoxExtenders : DependencyObject
{
public static readonly DependencyProperty AutoScrollToCurrentItemProperty = DependencyProperty.RegisterAttached("AutoScrollToCurrentItem", typeof(bool), typeof(ListBoxExtenders), new UIPropertyMetadata(default(bool), OnAutoScrollToCurrentItemChanged));
public static bool GetAutoScrollToCurrentItem(DependencyObject obj)
{
return (bool)obj.GetValue(AutoScrollToSelectedItemProperty);
}
public static void SetAutoScrollToCurrentItem(DependencyObject obj, bool value)
{
obj.SetValue(AutoScrollToSelectedItemProperty, value);
}
public static void OnAutoScrollToCurrentItemChanged(DependencyObject s, DependencyPropertyChangedEventArgs e)
{
var listBox = s as ListBox;
if (listBox != null)
{
var listBoxItems = listBox.Items;
if (listBoxItems != null)
{
var newValue = (bool)e.NewValue;
var autoScrollToCurrentItemWorker = new EventHandler((s1, e2) => OnAutoScrollToCurrentItem(listBox, listBox.Items.CurrentPosition));
if (newValue)
listBoxItems.CurrentChanged += autoScrollToCurrentItemWorker;
else
listBoxItems.CurrentChanged -= autoScrollToCurrentItemWorker;
}
}
}
public static void OnAutoScrollToCurrentItem(ListBox listBox, int index)
{
if (listBox != null && listBox.Items != null && listBox.Items.Count > index && index >= 0)
listBox.ScrollIntoView(listBox.Items[index]);
}
}
Usage in XAML
<ListBox IsSynchronizedWithCurrentItem="True" extenders:ListBoxExtenders.AutoScrollToCurrentItem="True" ..../>