10

我正在处理一个包含注册表单的应用程序。该表单包含多个文本输入框,因此使用 ScrollViewer 允许它们全部显示在一个页面上。

以下是我正在使用的 XAML 代码的精简示例:

<Grid x:Name="LayoutRoot" Background="Transparent">
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="*"/>
    </Grid.RowDefinitions>

    <StackPanel x:Name="TitlePanel" Grid.Row="0" Margin="12,17,0,28">
        <TextBlock x:Name="ApplicationTitle" Text="SCROLLVIEWER TEST" Style="{StaticResource PhoneTextNormalStyle}"/>
        <TextBlock x:Name="PageTitle" Text="registration" Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle1Style}"/>
    </StackPanel>

    <ScrollViewer Grid.Row="1">
        <StackPanel>
            <TextBlock Text="Hello" Margin="12,0,0,0"/>
            <TextBox />
            <TextBlock Text="Hello1" Margin="12,0,0,0"/>
            <TextBox />
            <TextBlock Text="Hello2" Margin="12,0,0,0"/>
            <TextBox />
            <TextBlock Text="Hello3" Margin="12,0,0,0"/>
            <TextBox />
            <TextBlock Text="Hello4" Margin="12,0,0,0"/>
            <TextBox />
            <TextBlock Text="Hello5" Margin="12,0,0,0"/>
            <TextBox />
            <TextBlock Text="Hello6" Margin="12,0,0,0"/>
            <TextBox />
            <TextBlock Text="Hello7" Margin="12,0,0,0"/>
            <TextBox />
            <TextBlock Text="Hello8" Margin="12,0,0,0"/>
            <TextBox />
            <TextBlock Text="END" Margin="12,0,0,0"/>
            <TextBox />
        </StackPanel>
    </ScrollViewer>
</Grid>

(请注意,ScrollViewer 位于网格单元格内,这意味着标题面板应始终保持 OnScreen)

滚动效果很好,所以这不是问题。但是,当用户选择文本框输入数据(即软键盘打开)时,系统会将整个页面的内容(包括注册标题面板)推送到周围,这不是预期的行为。[查看 Windows Phone 上的人脉应用并尝试添加新联系人。这包含类似的结构,但 ScrollViewer 仅通过向上推滚动查看器中的内容来正确运行]

测试用例

  • 选择一个在屏幕顶部附近可见的文本框以打开键盘。
  • 尝试在打开键盘的情况下滚动到页面底部。
  • 页面底部的项目无法访问。

或者

  • 选择一个在屏幕底部附近可见的文本框。
  • 整个页面的内容被向上推。
  • 尝试在打开键盘的情况下滚动到页面顶部。
  • 页面顶部的项目无法访问,并且在关闭键盘之前,标题面板永远不会重新出现。

任何有关解决此问题的帮助将不胜感激。谢谢。

4

4 回答 4

0

我开发的一个应用程序也遇到了同样的问题,我处理它的方式是找出包含输入textboxs 的面板的自动高度,然后手动设置高度并将大约 400 - 500 px 添加到底部使其滚动良好。效果非常流畅,不会让你的 UI 看起来“hackish”恕我直言。

在您的情况下,您将必须找出第 1 行的自动高度,LayoutRoot Grid然后RowDefinition手动设置高度 - 记住添加额外的 400 像素(或任何适合您情况的值)。

为了便于输入,我随后处理了每个OnKeyDown事件的每个事件,以便在点击时TextBox将焦点更改为下一个。最后,我将焦点设置为 this.focus(),它将焦点设置为 Page 并隐藏 SIP。TextBoxEnterTextBox

于 2013-04-05T14:16:57.040 回答
0

请看看我的小图书馆 - https://siphelper.codeplex.com/

它修改了scrollviewer的高度,内容可以滚动到最上面/最下面的点。

如果您有任何建议 - 请随时与我联系。

于 2013-07-10T09:45:28.997 回答
0

我认为你可以通过从另一个角度来解决这个问题。手机将向上滚动页面,这样 SIP(​​软件键盘)就不会覆盖有焦点的 TextBox。

但是,您可以通过检测 ScrollViewer 中包含的顶部元素上的触摸事件来强制 SIP 隐藏,例如:

<ScrollViewer Grid.Row="1">
    <StackPanel ManipulationDelta="OnScrollViewerGridManipulationDelta">`

然后,通过将焦点赋予隐藏按钮(大小为 0x0 像素),这将强制 SIP 关闭。然后,您的用户就可以按预期上下滚动滚动查看器......

    private void OnScrollViewerGridManipulationDelta(object sender, System.Windows.Input.ManipulationDeltaEventArgs e)
    {
        // This will hide the SIP if it is currently showing. 
        // We can't do this directly, but we can force this by taking focus away from any of the TextBoxes that may have it.
        this.hiddenButton.Focus();
    }
于 2012-10-29T14:45:38.967 回答
0

问题是 ScrollViwer 的高度在键盘出现后没有被修改,所以它被剪掉了。一种解决方案是修改 scrollviwer 的高度(根据键盘高度),然后重新定位它(这可能会让您有些头疼)。

另一个问题是知道键盘何时出现 - 您可以在所有 TextBox 上注册 GotFocus/LostFocus 事件,但这不是一个很好的解决方案。这可能对您有所帮助:http: //blogs.msdn.com/b/jaimer/archive/2010/11/05/guessing-if-the-sip-is-visible-in-a-windows-phone-application.aspx

希望这有所帮助 :)

于 2012-08-31T12:56:22.387 回答