× {{alert.msg}} Never ask again
Get notified about new tutorials RECEIVE NEW TUTORIALS

Invoke Command when TreeViewItem is Expanded

Gayot Fow
Feb 05, 2015
<p>To get this working, you can use an attached behaviour, and you'll see that it's a clean MVVM strategy.</p> <p>Create a WPF app and add this Xaml...</p> <pre><code>&lt;Grid&gt; &lt;TreeView&gt; &lt;TreeView.Resources&gt; &lt;Style TargetType="TreeViewItem"&gt; &lt;Setter Property="bindTreeViewExpand:Behaviours.ExpandingBehaviour" Value="{Binding ExpandingCommand}"/&gt; &lt;/Style&gt; &lt;/TreeView.Resources&gt; &lt;TreeViewItem Header="this" &gt; &lt;TreeViewItem Header="1"/&gt; &lt;TreeViewItem Header="2"&gt;&lt;TreeViewItem Header="Nested"&gt;&lt;/TreeViewItem&gt;&lt;/TreeViewItem&gt; &lt;TreeViewItem Header="2"/&gt; &lt;TreeViewItem Header="2"/&gt; &lt;TreeViewItem Header="2"/&gt; &lt;/TreeViewItem&gt; &lt;TreeViewItem Header="that" &gt; &lt;TreeViewItem Header="1"/&gt; &lt;TreeViewItem Header="2"/&gt; &lt;TreeViewItem Header="2"/&gt; &lt;TreeViewItem Header="2"/&gt; &lt;TreeViewItem Header="2"/&gt; &lt;/TreeViewItem&gt; &lt;/TreeView&gt; &lt;/Grid&gt; </code></pre> <p>Then create a View Model like this...</p> <pre><code>public class ViewModel : INotifyPropertyChanged { public ICommand ExpandingCommand { get; set; } public ViewModel() { ExpandingCommand = new RelayCommand(ExecuteExpandingCommand, CanExecuteExpandingCommand); } private void ExecuteExpandingCommand(object obj) { Console.WriteLine(@"Expanded"); } private bool CanExecuteExpandingCommand(object obj) { return true; } #region INotifyPropertyChanged Implementation public event PropertyChangedEventHandler PropertyChanged; protected virtual void OnPropertyChanged(string name) { var handler = System.Threading.Interlocked.CompareExchange(ref PropertyChanged, null, null); if (handler != null) { handler(this, new PropertyChangedEventArgs(name)); } } #endregion } </code></pre> <p>I use the Relay Command, but you can use the Delegate Command interchangeably. The source for the Relay Command is at <a href="http://msdn.microsoft.com/en-us/magazine/dd419663.aspx" rel="nofollow">http://msdn.microsoft.com/en-us/magazine/dd419663.aspx</a></p> <p>Then create a separate class that looks like this...</p> <pre><code>public static class Behaviours { #region ExpandingBehaviour (Attached DependencyProperty) public static readonly DependencyProperty ExpandingBehaviourProperty = DependencyProperty.RegisterAttached("ExpandingBehaviour", typeof(ICommand), typeof(Behaviours), new PropertyMetadata(OnExpandingBehaviourChanged)); public static void SetExpandingBehaviour(DependencyObject o, ICommand value) { o.SetValue(ExpandingBehaviourProperty, value); } public static ICommand GetExpandingBehaviour(DependencyObject o) { return (ICommand) o.GetValue(ExpandingBehaviourProperty); } private static void OnExpandingBehaviourChanged(DependencyObject d, DependencyPropertyChangedEventArgs e) { TreeViewItem tvi = d as TreeViewItem; if (tvi != null) { ICommand ic = e.NewValue as ICommand; if (ic != null) { tvi.Expanded += (s, a) =&gt; { if (ic.CanExecute(a)) { ic.Execute(a); } a.Handled = true; }; } } } #endregion } </code></pre> <p>Then import the name space of this class into your Xaml...</p> <p>xmlns:bindTreeViewExpand="clr-namespace:BindTreeViewExpand" (your name space will be different!)</p> <p>Resharper will do this for you, or give you an intellesense prompt.</p> <p>Finally wire up the View Model. Use the quick and dirty method like this...</p> <pre><code>public partial class MainWindow : Window { public MainWindow() { InitializeComponent(); DataContext = new ViewModel(); } </code></pre> <p>Then, after the name spaces are resolved and the wiring is correct, it will start to work. Anchor your debugger in the Execute method and observe that you get a RoutedEvent argument. You can parse this to get which Tree view item was expanded.</p> <p>The key aspect in this solution is the behaviour being specified in the STYLE! So it is applied to each and every TreeViewItem. No code behind either (other than the behaviour).</p> <p>The behaviour I listed above marks the event as handled. You may wish to change that depending upon the behaviour you are after. </p> <p>This tip was originally posted on <a href="http://stackoverflow.com/questions/23316932/Invoke%20Command%20when%20TreeViewItem%20is%20Expanded/23318067">Stack Overflow</a>.</p>
comments powered by Disqus