title: WinRT XAML and programmatically setting focus to TextBox - Why Focus doesn't stick?
body: <p>My Windows 8 XAML page contains two controls: Image and TextBox. When the user doubletaps Image, I want to move the focus to TextBox so that the virtual keyboard is automatically displayed. </p>
  
  <p>The problem: The TextBox control correctly receives the focus, but only for 0.1 seconds. The focus then moves to somewhere else and no keyboard is displayed. </p>
  
  <p>Through the events I can see that GotFocus and and LostFocus events are raised for the TextBox. The Image control doesn't have other event handlers as it only handles the DoubleTapped event:</p>
  
  <pre><code>    private void CurrentPage_OnDoubleTapped(object sender, DoubleTappedRoutedEventArgs e)
      {
          e.Handled = true;
          this.PageNumberTextBox.Focus(FocusState.Keyboard);
      }
  </code></pre>
  
  <p>Why doesn't the focus "stick"? Where and why the focus goes?</p>
  
  <p><strong>Update:</strong></p>
  
  <p>With <a href="http://www.zagstudio.com/blog/1335#.UrXCK_RdVSu" rel="nofollow noreferrer">this very helpful helper</a> I can see that the focus moves to <strong>ScrollViewer [Windows.UI.Xaml.Controls.Border]</strong>. I presume this is something which is built-in (maybe used by the RootFrame?) as I don't have any ScrollViewers added to the page and because this control seems to fill the whole screen. </p>
  
  <p>So, the problem seems to be caused by <strong>event bubbling</strong>: Image-control is first to receive the event and then the control behind it. But why? Shouldn't <strong>e.Handled = true</strong> prevent this behavior? </p>
  
  <p>Modifying the code to look like this doesn't help:</p>
  
  <pre><code>    private void CurrentPage_OnDoubleTapped(object sender, DoubleTappedRoutedEventArgs e)
      {
          e.Handled = true;
          //this.PageNumberTextBox.Focus(FocusState.Keyboard);
      }
  </code></pre>
  
  <p>After the doubletap, the mystery ScrollViewer has the focus.</p>
  
  <p><strong>Update 2:</strong></p>
  
  <p>The problem might be related to Image-control. I created the following spike:</p>
  
  <pre><code>&lt;Grid Background="{StaticResource ApplicationPageBackgroundThemeBrush}"&gt;
      &lt;Grid.RowDefinitions&gt;
          &lt;RowDefinition/&gt;
          &lt;RowDefinition/&gt;
      &lt;/Grid.RowDefinitions&gt;
  
      &lt;Image Grid.Row="0" DoubleTapped="UIElement_OnDoubleTapped" Tapped="UIElement_OnTapped"
             Source="http://upload.wikimedia.org/wikipedia/commons/1/1c/Squirrel_posing.jpg" Stretch="Fill"/&gt;
      &lt;TextBox x:Name="MyBox" Grid.Row="1"/&gt;
  &lt;/Grid&gt;
  </code></pre>
  
  <p>The spike app is created using the Blank template. In code behind I set the e.Handled = true for both Tapped and DoubleTapped:</p>
  
  <pre><code>    private void UIElement_OnDoubleTapped(object sender, DoubleTappedRoutedEventArgs e)
      {
          e.Handled = true;
      }
  
      private void UIElement_OnTapped(object sender, TappedRoutedEventArgs e)
      {
          e.Handled = true;
      }
  </code></pre>
  
  <p>The problem: When I tap the Image, the focus is always given to this mystery ScrollViewer. Here's some screenshots:</p>
  
  <ol>
  <li>When I click the TextBox which takes the bottom half of the view, the focus correctly moves to the TextBox (the control with focus is highlighted and the control's name is displayed in top left):</li>
  </ol>
  
  <p><img src="https://i.stack.imgur.com/llhEY.png" alt="Focus textbox"></p>
  
  <ol start="2">
  <li>When I click the Image at the top, the Image doesn't receive the focus. Instead, it's given to the mystery ScrollViewer, which seems to fill the whole screen:</li>
  </ol>
  
  <p><img src="https://i.stack.imgur.com/g7owq.png" alt="Focus image"></p>
  
  <p>So even though I've set the Image to handle both Tapped and DoubleTapped, the Image control doesn't receive the focus.</p>