存在键盘时的 Windows Phone 应用程序滚动问题答案

【问题标题】：Windows Phone App scroll issue when the keyboard is present存在键盘时的 Windows Phone 应用程序滚动问题
【发布时间】：2013-08-15 09:22:55
【问题描述】：

我有一个由几个 UI 元素组成的屏幕，主要是 TextBox。当一个 TextBox 获得焦点时，整个页面向上推，将标题移到屏幕外。我希望标题位于固定位置，其余内容在 ScrollViewer 中向上推送。理想情况下，我希望按预期放置偏移量，并显示/隐藏键盘并正确聚焦到 UI 元素。正确滚动行为的一个很好的例子是本机警报应用程序。任何帮助表示赞赏。干杯！

【问题讨论】：

我看不出警报应用程序的功能有什么不同。它完全按照您所说的那样做，您不希望它做，并推动一切。您能否尝试清楚地解释标准行为在您的情况下如何不起作用，可能使用一些代码来演示您想要更改的行为？
它不会在警报应用程序中向上推标题，而只会在标题下方的滚动查看器内进行evertyhing。我想在键盘打开时保留标题并像上面一样移动其余内容。通常我看到许多应用程序将所有布局内容包装在滚动查看器周围，因此最上面的控件移动到屏幕之外。我们该怎么做？（由于法律问题，我无法共享屏幕，但请检查任何应用程序，其中大多数在键盘处于活动状态时会导致相同的推送到屏幕外）

标签： windows xaml windows-phone-8 scroll scrollviewer

【解决方案1】：

渲染 SIP 键盘时，PhoneApplicationFrame.TranslateTransform.Y 设置为特定值。要更新布局，我们只需将上边距设置为指定值 (-s)，然后 Silverlight 布局系统将解决此问题。

这里是 XAML 部分：

<Grid x:Name="LayoutRoot" >
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="*"/>
        <RowDefinition Height="Auto"/>
    </Grid.RowDefinitions>
    <StackPanel Grid.Row="0" Margin="12,17,0,28">
        <TextBlock Text="WINDOWS PHONE" Style="{StaticResource PhoneTextNormalStyle}"/>
        <TextBlock Text="developer's ?" Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle1Style}"/>
    </StackPanel>
    <Grid Grid.Row="1" Margin="12,0,12,0"></Grid>
    <TextBox Grid.Row="2" LostFocus="TextBox_OnLostFocus" />
</Grid>

C#部分

public partial class MainPage : PhoneApplicationPage
{
    private static double newValue = 0.0;
    public static readonly DependencyProperty TranslateYProperty = DependencyProperty.Register("TranslateY", typeof(double), typeof(MainPage), new PropertyMetadata(0d, OnRenderXPropertyChanged));

    public MainPage()
    {
        InitializeComponent();
        this.Loaded += BindToKeyboardFocus;
    }

    private void BindToKeyboardFocus(object sender, RoutedEventArgs e)
    {
        PhoneApplicationFrame frame = Application.Current.RootVisual as PhoneApplicationFrame;
        if (frame != null)
        {
            var group = frame.RenderTransform as TransformGroup;
            if (group != null)
            {
                var translate = group.Children[0] as TranslateTransform;
                var translateYBinding = new Binding("Y");
                translateYBinding.Source = translate;
                SetBinding(TranslateYProperty, translateYBinding);
            }
        }
    }

    public double TranslateY
    {
        get { return (double)GetValue(TranslateYProperty); }
        set { SetValue(TranslateYProperty, value); }
    }

    private static void OnRenderXPropertyChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
    {
        if ((double)e.NewValue <= newValue)
            ((MainPage)d).UpdateTopMargin((double)e.NewValue);
        newValue = (double)e.NewValue;
    }

    private void UpdateTopMargin(double translateY)
    {
        LayoutRoot.Margin = new Thickness(0, -translateY, 0, 0);
    }

    private void TextBox_OnLostFocus(object sender, RoutedEventArgs e)
    { 
        LayoutRoot.Margin = new Thickness();
    }
}

我认为这会有所帮助。这是我的 GitHub 链接-https://github.com/rezacse/fixedHeaderOnTextBoxFocus

【讨论】：

我添加了我的 gitHub 帐户的项目 url。现在可能修好了。

【解决方案2】：

我遇到了同样的问题。但最后我解决了它，我只是使用 Height 属性来做到这一点。请执行以下步骤

首先创建一个ScrollViewer
在 ScrollViewer 中创建一个容器（例如：Grid/StackPanel/Border 等...）并将每个控件放入其中。
为 ScrollViewer 和 Container 设置固定的高度（注意：容器的高度应大于 ScrollViewer 的高度）

查看以下代码

<ScrollViewer Height="500">
        <Grid Name="Container" Height="700">
            <TextBox/>
            <TextBox/>
            <TextBox/>
        </Grid>
</ScrollViewer>

现在您可以滚动容器网格甚至显示的键盘，甚至可以将焦点放在文本框上。您可以聚焦任何文本框，并且 ScrollViewer 不会向后滚动。

【讨论】：

您好，感谢您的回复。我试过了，键盘仍然将标题面板向上推到屏幕外。你可以为整个屏幕发布一些xaml代码吗？