我在Windows Phone 8.1中创建了一个简单示例,我遇到了与UI相关的问题。
我有一个网格,其中包含标题中的图像和下面的文本框:
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="*"/>
<RowDefinition Height="8*"/>
</Grid.RowDefinitions>
<Image Source="Assets/topbar.png" />
<TextBox Grid.Row="1" VerticalAlignment="Bottom"/>
</Grid>
问题在于,当文本框获得焦点时,标题图像会显示在屏幕顶部,但是当文本框获得焦点时,我需要将标题图像保留在同一位置。
请分享解决此问题的任何想法。
答案 0 :(得分:0)
你必须为网格布局设置3行,用于标题,正文,页脚。像这样:
<Grid x:Name="LayoutRoot" Grid.Row="1" Margin="12,0,12,0">
<Grid.RowDefinitions>
<RowDefinition Height="auto" />
<RowDefinition />
<RowDefinition Height="auto" />
</Grid.RowDefinitions>
<StackPanel Grid.Row="0" Name="Header" Background="#FF1DA8D1">
<TextBlock Text="Header" HorizontalAlignment="Center" FontSize="40" />
</StackPanel>
<ScrollViewer Grid.Row="1" Background="Orange" Name="Body">
<Grid >
<Grid.RowDefinitions>
<RowDefinition Height="auto" />
</Grid.RowDefinitions>
<TextBox Grid.Row="0" Name="txtMessage"
TextWrapping="Wrap"
AcceptsReturn="True"
TextChanged="txtMessage_TextChanged"
GotFocus="txtMessage_GotFocus"
LostFocus="txtMessage_LostFocus"
Tap="txtMessage_Tap" />
</Grid>
</ScrollViewer>
<Grid Grid.Row="2" Name="FooterPlaceholder" Visibility="Collapsed"/>
<StackPanel Name="withoutkeyboardfooter" Grid.Row="2" Background="#FF1DA8D1">
<TextBlock Text="Footer" HorizontalAlignment="Center" FontSize="40" />
</StackPanel>
</Grid>
在上面的xaml代码主要部分是Body(Grid.Row = 1)内容,它有一个带有TextBox的scrollviewer用于测试目的。所以这里TextBox有以下事件来处理键盘问题。
框TextChanged = “txtMessage_TextChanged”
的GotFocus = “txtMessage_GotFocus”
引发LostFocus = “txtMessage_LostFocus”
点击= “txtMessage_Tap”
这里我们需要使用这些事件来手动指定滚动位置。通常在最初点击填充的文本框时,滚动到用户希望光标专用于在显示键盘后将隐藏的区域的点需要一些手动方法来完成。这是在点击事件中处理的。
double tapOffset;
private void txtMessage_Tap(object sender, System.Windows.Input.
GestureEventArgs e)
{
tapOffset = e.GetPosition(txtMessage).Y - 80;
}
不同分辨率的键盘高度不同,因此需要进行一些检查以找到正确的键盘高度,这可以在页面的已加载事件中完成。
void MainPage_Loaded(object sender, RoutedEventArgs e)
{
var deviceWidth = this.ActualWidth;
var isHdDevice = (deviceWidth > 500 ? true : false);
if (isHdDevice)
keyboardHeight = 540;
else
keyboardHeight = 336;
//this will be used to offset other controls on the page into the viewable area
FooterPlaceholder.Height = keyboardHeight;
}
我们需要在LostFocus活动中这样做:
private void txtMessage_LostFocus(object sender, RoutedEventArgs e)
{
//hide the keyboard placeholder from screen
//allowing the scrollviewer to re-occupy the available area again
this.FooterPlaceholder.Visibility = Visibility.Collapsed;
withoutkeyboardfooter.Visibility = Visibility.Visible;
footerkeyboard.Visibility = Visibility.Collapsed;
}