如何通过按其子元素将焦点设置到绑定的ListboxItem？

Question

I am developping a small WPF application which consist mostly in displaying ObservableCollection<> in others ObservableCollection<> , and so on.

Here is a code example of what my application looks like:

<Listbox Name="MainList" ItemsSource={Binding}>
    <ListBox.ItemTemplate>
        <DataTemplate>
            <StackPanel>      

                <Textblock Text={Binding MainName} />
                <Button>Add item</Button>
                <Button>Delete item</Button>

                <Listbox Name="ChildList" ItemsSource="{Binding Path=ChildItem}">
                    <ListBox.ItemTemplate>
                        <DataTemplate>
                            <Textblock Text={Binding ChildName} />
                        </DataTemplate>
                    </ListBox.ItemTemplate>
                </Listbox>

            </StackPanel>
        </DataTemplate>
    </ListBox.ItemTemplate>
</Listbox>

And visually it pretty much looks like this:

EDIT:

I will re-explain what I am trying to do.

• Whenever I click Button A or Button B I want to Select the MainList ListBoxItem in which they are contained (ie: A Item )

• And in a second time whenever I click Button B :

  • I want to be sure that a ListBoxItem is selected in ChildList (Second Listbox in the picture)
  • And if so, I want to delete it in code-behind.

But my main problem is since everything is generated by my bindings I cannot get, so far, an element from my ChildList because ChildList is duplicated in any of my MainList ListBoxItem .

Answer 1

If I understand well the problem is that you want first click on a button of unselected item to select the MainItem , and on next click, when MainItem is already selected, preform click action. Try this when button is clicked:

private ListBoxItem FindItemContainer(DependencyObject obj)
{
   while (obj != null && !(obj is ListBoxItem))
   {
       obj = VisualTreeHelper.GetParent(obj);
   }

   if (obj != null)
       return obj as ListBoxItem;
   else
       return null;
}

private void Button_Click(object sender, RoutedEventArgs e)
{
   var lbi = FindItemContainer(sender as DependencyObject);
   if (lbi != null)
   {
       if (lbi.IsSelected)
       {
           //do click event
       }
       else
           lbi.IsSelected = true;
   }
}

Of course you can also do it more MVVM way by binding ListBoxItem.IsSelected to lets say bool MainItem.MyItemIsSelected

<ListBox.ItemContainerStyle>
    <Style TargetType="{x:Type ListBoxItem}">
        <Setter Property="IsSelected" Value="{Binding Path=MyItemIsSelected, Mode=TwoWay}"/>
    </Style>
</ListBox.ItemContainerStyle>

and Button.Command to your ICommand MainItem.DeleteCommand and then when command is executed do something like that:

if (MyItemIsSelected)
{
    //do command body
}
else
    MyItemIsSelected = true;

which will be better long term because you could replicate SelectedItem behaviour in ChildList object (add MyItemIsSelected and bind it to inner 'ListBoxItem.IsSelected , like discribed above) and add MySelectedItem property to ChildList :

ChildItem MySelectedItem
{
   get
   {
      return Items.FirstOrDefault(n=>n.MyItemIsSelected);
   }
}

and your delete command would look like this:

if (MyItemIsSelected)
{
    ChildItem selItem = ChildItems.MySelectedItem;
    if (selItem != null) ChildItems.Items.Remove(selItem);
}
else
    MyItemIsSelected = true;

if everything is data bound and lists are ObservableCollections then you can do all that in object and UI will follow. Actually you can do only this child selection binding bit and still use first solution and in Button_Click look like this:

private void Button_Click(object sender, RoutedEventArgs e)
{
   var lbi = FindItemContainer(sender as DependencyObject);
   if (lbi != null)
   {
       if (lbi.IsSelected)
       {
           MainItem mainItem = lbi.Content as MainItem;
           ChildItem selChild = mainItem.ChildItems.MySelectedItem;
           if (selChild != null) mainItem.ChildItems.Items.Remove(selChild);
       }
       else
           lbi.IsSelected = true;
   }
}

Here is simple, working example on Dropbox

Answer 2

You can do everything you want to do in code behind:

• Find the item on which the Button is pressed: in the click-event, cast the sender parameter to type Button. Its DataContext property will contain the item you want to select.
• Select the item: set MainList.SelectedItem to the item.
• Focus will be on the Button, but that should be ok, since it is inside the item.

• Find the selected item in second listbox: locating the ListBox in the DataTemplate is tricky, but you could set its IsSynchronizedWithCurrentItem property to True, and then use the underlying child collection's default CollectionView. You'd find the current item of MainList like above. Then you'd use:

  itemToDelete = CollectionViewSource.GetDefaultView(item.ChildItems).CurrentItem; item.ChildItems.Remove(itemToDelete);