Windows 8/Metro UI中的文本框下的自动完成框

Question

我想使用C＃/ XAML在Windows 8 UI/Metro UI应用程序的文本框中实现自动完成。

此时，当软/触摸键盘显示时，它会遮挡自动完成框。但是，在文本框焦点上，Windows 8自动向上滚动整个视图并确保文本框处于焦点状态。

在现实中，我想要的只是向上滚动一点点的视图（实际上是通过自动完成框的高度）。

我知道我可以拦截InputPane.GetForCurrentView（）的显示事件

我可以设置InputPaneVisibilityEventArgs.EnsuredFocusedElementInView到显示事件精细内真（所以Windows不会尝试做任何事情）....然而，我怎样才能调用与Windows 8相同的滚动功能，但要求它多滚动一下！？

这里的主网页代码：

<Grid Background="{StaticResource ApplicationPageBackgroundThemeBrush}"> 
    <StackPanel VerticalAlignment="Center" HorizontalAlignment="Center" Margin="0,200,0,0"> 
     <TextBlock HorizontalAlignment="Center" FontSize="60">App 1</TextBlock> 
     <TextBlock HorizontalAlignment="Center">Enter text below</TextBlock> 
     <TextBox HorizontalAlignment="Center" Margin="-10,0,10,0" Width="400" Height="30"/> 
     <ListBox HorizontalAlignment="Center" Width="400"> 
      <ListBoxItem>Auto complete item 1</ListBoxItem> 
      <ListBoxItem>Auto complete item 2</ListBoxItem> 
      <ListBoxItem>Auto complete item 3</ListBoxItem> 
      <ListBoxItem>Auto complete item 4</ListBoxItem> 
      <ListBoxItem>Auto complete item 5</ListBoxItem> 
     </ListBox> 
    </StackPanel> 
</Grid> 

如果启动了最低分辨率模拟器，用手去“触摸”的文本框，这将弹出软键盘。在真实应用程序中，随着用户输入文本，自动完成列表将显示项目。

所以简而言之，如何将屏幕向上移动一点以便用户可以看到整个自动完成列表？

请记住，在真实的应用程序，它会更糟糕，因为用户可能甚至没有注意到自动完成列表出现在键盘下方。

我真的很感谢一些建议，非常感谢！

Answer 1

好吧，这里是我将如何解决这个问题，因为我似乎无法找到任何方式来控制基于键盘外观的应用程序的滚动。我将创建一个用户控件，它将构成自动完成文本框的基础。

<UserControl 
x:Class="App6.MyUserControl1" 
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
xmlns:local="using:App6" 
xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
mc:Ignorable="d" 
d:DesignHeight="300" 
d:DesignWidth="400"> 

<Grid> 
    <TextBox x:Name="textBox" TextWrapping="Wrap" Text="TextBox" VerticalAlignment="Top" GotFocus="textBox_GotFocus" LostFocus="textBox_LostFocus" /> 
    <ListBox x:Name="listBox" Height="150" Margin="0,-150,0,0" VerticalAlignment="Top" Visibility="Collapsed"/> 
</Grid> 

这是一个令人难以置信的基本实现，所以你必须调整，以满足您的需求。

然后，我将添加以下代码隐藏到用户控制

public sealed partial class MyUserControl1 : UserControl 
{ 
    // Rect occludedRect; 
    bool hasFocus = false; 

    public MyUserControl1() 
    { 
     this.InitializeComponent(); 
     InputPane.GetForCurrentView().Showing += MyUserControl1_Showing; 
    } 

    void MyUserControl1_Showing(InputPane sender, InputPaneVisibilityEventArgs args) 
    { 
     if (hasFocus) 
     { 
      var occludedRect = args.OccludedRect; 

      var element = textBox.TransformToVisual(null); 
      var point = element.TransformPoint(new Point(0, 0)); 

      if (occludedRect.Top < point.Y + textBox.ActualHeight + listBox.ActualHeight) 
      { 
       listBox.Margin = new Thickness(0, -listBox.ActualHeight, 0, 0);   // Draw above  
      } 
      else 
      { 
       listBox.Margin = new Thickness(0, textBox.ActualHeight, 0, 0); // draw below 
      } 
     }   
    } 

    private void textBox_GotFocus(object sender, RoutedEventArgs e) 
    { 
     listBox.Visibility = Windows.UI.Xaml.Visibility.Visible; 
     hasFocus = true; 
    } 

    private void textBox_LostFocus(object sender, RoutedEventArgs e) 
    { 
     listBox.Visibility = Windows.UI.Xaml.Visibility.Collapsed; 
     hasFocus = false; 
    }   
} 

下一步将公开属性传递给被绑定到列表框数据。硬核将是ListBoxItem模板和更多，取决于你想要它的可重用性。

Answer 2

我创建的Windows Store应用程序的AutoCompleteBox的NuGet包可在https://nuget.org/packages/AutoCompleteBoxWinRT