How to support for Enter key to make focus moving in a text column of the listview

Question

I created the following view

        <ListView.View>
            <GridView>
                <GridViewColumn Header="Tester"
                                DisplayMemberBinding="{Binding User}" />
                <GridViewColumn Header="Executed On" 
                                DisplayMemberBinding="{Binding ExecutionDate}" />
                <GridViewColumn Header="Comment">
                    <GridViewColumn.CellTemplate>
                        <DataTemplate>
                            <DockPanel>
                                <TextBox Text="{Binding Comment}" Name="TxtComment"
                                         MinWidth="100" VerticalContentAlignment="Top"
                                         BorderThickness="0" PreviewKeyDown="TxtComment_PreviewKeyDown"/>
                            </DockPanel>
                        </DataTemplate>
                    </GridViewColumn.CellTemplate>
                </GridViewColumn>
            </GridView>
        </ListView.View>

Now what I suppose is that, After I entered something in "Comment" field and press the Key "Enter", the next row of the "Comment" field will get focus.

I added the following code of the event "PreviewKeyDown", but it seems that the next whole row will get focus not only the "Comment" field...

    Private Sub TxtComment_PreviewKeyDown(ByVal sender As System.Object, ByVal e As System.Windows.Input.KeyEventArgs)
    Dim focusRequest As TraversalRequest
    Dim focusedElement As Object = sender

    Select Case e.Key
        Case Key.Enter
            focusRequest = New TraversalRequest(FocusNavigationDirection.Down)
        Case Else
            ' Do nothing
            Return
    End Select
    '  Do not further propagate event
    e.Handled = True
    'Move focus
    DirectCast(focusedElement, UIElement).MoveFocus(focusRequest)
End Sub

Hope someone can tell me how to solve this problem, ^0^

Answer 1

Add a SelectionChanged event to your ListView to link with your Enter keyboard event, and use VisualTreeHelper to find the textBox.

Here is the ListView XAML; same as your code except I used an ObservableCollection to load data in the ListView (not shown) and I added the SelectionChanged event:

<ListView x:Name="myView" ItemsSource="{Binding Path=MyData}"  
          SelectionChanged="myView_SelectionChanged">
  <ListView.View>
    <GridView>
      <GridViewColumn Header="Tester" 
                      DisplayMemberBinding="{Binding User}" />
      <GridViewColumn Header="Executed On"  
                      DisplayMemberBinding="{Binding ExecutionDate}" />
      <GridViewColumn Header="Comment">
        <GridViewColumn.CellTemplate>
          <DataTemplate>
            <DockPanel>
              <TextBox Text="{Binding Comment}" Name="TxtComment" 
                        MinWidth="100" VerticalContentAlignment="Top" 
                        BorderThickness="0" 
                        PreviewKeyDown="TxtComment_PreviewKeyDown"/>
             </DockPanel>
          </DataTemplate>
        </GridViewColumn.CellTemplate>
      </GridViewColumn>
    </GridView>
  </ListView.View>
</ListView>

Here are the event handlers and a helper function that uses visualtreeHelper in your code-bind:

private void TxtComment_PreviewKeyDown(object sender, KeyEventArgs e)
{
   TraversalRequest focusRequest = null;
   TextBox focusedElement = sender as TextBox;

   switch (e.Key)
   {
      case Key.Enter:
         focusRequest = new TraversalRequest(FocusNavigationDirection.Down);
         if ( focusedElement != null )
         {
            //Move focus 
            bool moved = focusedElement.MoveFocus(focusRequest);
            if (moved)
            {
               e.Handled = true;
            }
         }
         break;
      default:
         break;
   }
}

// find the TextBox here
private void myView_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
   ListView lv = sender as ListView;
   if ( lv != null)
   {
      ItemContainerGenerator generator = lv.ItemContainerGenerator;
      ListViewItem selectedItem = (ListViewItem) generator.ContainerFromIndex(lv.SelectedIndex);
      TextBox tbFind = GetDescendantByType(selectedItem, typeof (TextBox), "TxtComment") as TextBox;
      if (tbFind != null)
      {
         FocusHelper.Focus(tbFind);
      }
   }
}

public static Visual GetDescendantByType(Visual element, Type type, string name)
{
   if (element == null) return null;
   if (element.GetType() == type)
   {
      FrameworkElement fe = element as FrameworkElement;
      if (fe != null)
      {
         if (fe.Name == name)
         {
            return fe;
         }
      }
   }
   Visual foundElement = null;
   if (element is FrameworkElement)
      (element as FrameworkElement).ApplyTemplate();
   for (int i = 0;
        i < VisualTreeHelper.GetChildrenCount(element);
        i++)
   {
      Visual visual = VisualTreeHelper.GetChild(element, i) as Visual;
      foundElement = GetDescendantByType(visual, type, name);
      if (foundElement != null)
         break;
   }
   return foundElement;
}

One more helper to set the Focus on the TextBox:

public static class FocusHelper
{
  public static void Focus(UIElement element)
  {
     element.Dispatcher.BeginInvoke(DispatcherPriority.Input, new ThreadStart(delegate()
     {
        element.Focus();
     }));
  }
}