在聚焦userControl内的TextBox时检测虚拟键盘

时间:2014-10-20 08:38:56

标签: c# xaml user-controls windows-runtime windows-store-apps

我在winRT项目中有以下FlipView

<FlipView x:Name="Flip" GotFocus="FlipView_GotFocus" Grid.Row="1" ItemsSource="{Binding Controls, ElementName=pageRoot}" SelectedItem="{Binding SelectedControl, ElementName=pageRoot, Mode=TwoWay}">
        <FlipView.ItemTemplate>
            <DataTemplate>
                <Grid HorizontalAlignment="Center" VerticalAlignment="Center">
                    <ContentPresenter Content="{Binding}" />
                </Grid>
            </DataTemplate>
        </FlipView.ItemTemplate>
    </FlipView>

在其中我将有几个具有一些TextBox的用户控件,但是当我将焦点放在其中一个TextBox中时,虚拟键盘会在另一个TextBox前面,它不会提升&#34;当我有一个带有TextBox的简单页面时,它就像通常那样。

有没有办法检测键盘显示并拉出应用程序的视图?

以下是使用

的UserControl之一
 <UserControl.Resources>
    <ResourceDictionary>
        <common:ByteArrayToBitmapImageConverter x:Key="ByteArrayToBitmapImageConverter" />
        <common:StringToValidityConverter x:Key="StringToValidityConverter" />
    </ResourceDictionary>
</UserControl.Resources>

<StackPanel>
    <StackPanel Style="{StaticResource SubHeaderStyle}">
        <Image Source="/Images/Contract/Sales.png" Style="{StaticResource SubHeaderImageStyle}" />
        <TextBlock x:Uid="Sale" Style="{StaticResource SubHeaderTextStyle}" />
    </StackPanel>

    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="Auto" />
            <ColumnDefinition Width="50" />
            <ColumnDefinition Width="Auto" />
            <ColumnDefinition Width="Auto" />
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition />
            <RowDefinition Height="Auto" />
            <RowDefinition Height="Auto" />
            <RowDefinition Height="Auto" />
            <RowDefinition Height="Auto" />
            <RowDefinition />
        </Grid.RowDefinitions>

        <Image Grid.RowSpan="6" Width="300" Source="{Binding Picture, Converter={StaticResource ByteArrayToBitmapImageConverter}}" />

        <TextBlock x:Uid="SalesOffice" Grid.Row="1" Grid.Column="2" />
        <TextBox Grid.Row="1" Grid.Column="3" Text="{Binding Office, Mode=TwoWay}" Style="{StaticResource TextBoxStyle}"
                 common:TextBoxBehavior.Validity="{Binding Text, RelativeSource={RelativeSource Self}, Converter={StaticResource StringToValidityConverter}}" />

        <TextBlock x:Uid="SalesAgent" Grid.Row="2" Grid.Column="2" />
        <TextBox Grid.Row="2" Grid.Column="3" Text="{Binding AgentName, Mode=TwoWay}" Style="{StaticResource TextBoxStyle}"
                 common:TextBoxBehavior.Validity="{Binding Text, RelativeSource={RelativeSource Self}, Converter={StaticResource StringToValidityConverter}}" />

        <TextBlock x:Uid="MobilePhone" Grid.Row="3" Grid.Column="2" />
        <TextBox Grid.Row="3" Grid.Column="3" Text="{Binding MobilePhone, Mode=TwoWay}" Style="{StaticResource TextBoxStyle}"
                 common:TextBoxBehavior.Validity="{Binding Text, RelativeSource={RelativeSource Self}, Converter={StaticResource StringToValidityConverter}}" InputScope="Number" />

        <TextBlock x:Uid="EmailAddress" Grid.Row="4" Grid.Column="2" />
        <TextBox Grid.Row="4" Grid.Column="3" Text="{Binding EmailAddress, Mode=TwoWay}" Style="{StaticResource TextBoxStyle}"
                 common:TextBoxBehavior.Validity="{Binding Text, RelativeSource={RelativeSource Self}, Converter={StaticResource StringToValidityConverter}}" />
    </Grid>
</StackPanel>

以下是它的外观 App when Keyboard is up

编辑: 似乎我可以用

检测键盘
Windows.UI.ViewManagement.InputPane.GetForCurrentView().Showing
Windows.UI.ViewManagement.InputPane.GetForCurrentView().Hidding

现在我只需要学习如何提升我的观点。

1 个答案:

答案 0 :(得分:0)

如您所见,您可以使用InputPane的显示和隐藏事件来检测InputPane的可见性更改。 InputPaneVisibilityEventArgs包含它将覆盖的OccludedRect,您可以将RenderTransform应用于页面以将其翻译出来。

<Page.RenderTransform>
    <CompositeTransform x:Name="pageTransform"/>
</Page.RenderTransform>

一个痛苦的天真实施:

void Page_Showing(InputPane sender, InputPaneVisibilityEventArgs args)
{
    // We probably want something more sophisticated to make sure the
    // focus control and any dependencies are in view
    pageTransform.TranslateY -= args.OccludedRect.Height;
    // Tell the InputPane we already handled things so it doesn't move the page again
    args.EnsuredFocusedElementInView = true;
}

void Page_Hiding(InputPane sender, InputPaneVisibilityEventArgs args)
{
    pageTransform.TranslateY = 0;
    args.EnsuredFocusedElementInView = true;
}

实际上,您希望进行数学运算以确保可见必要的控件。您可以使用动画来使移动更加平滑。如果您想获得更多创意,可以切换到一个新的视觉状态,该状态只有必要的字段,可以在更友好的布局中进行编辑。在UserControl的情况下,您可能只想移动控件而不是页面。

还要在Windows 10桌面上进行测试,因为软键盘行为与窗口应用程序的交互方式略有不同。