Windows Phone appBar adding extra margin above keyboard - windows-phone

Question

I am trying to create a messaging screen. This is my XAML:
<phone:PhoneApplicationPage
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:edc="clr-namespace:Microsoft.Expression.Controls;assembly=Microsoft.Expression.Drawing" xmlns:em="clr-namespace:Microsoft.Expression.Media;assembly=Microsoft.Expression.Drawing"
mc:Ignorable="d" d:DesignWidth="480" d:DesignHeight="696"
x:Class="chatScreen.MainPage"
Orientation="Portrait"
shell:SystemTray.IsVisible="True">
<phone:PhoneApplicationPage.Resources></phone:PhoneApplicationPage.Resources>
<phone:PhoneApplicationPage.ApplicationBar>
<shell:ApplicationBar>
<shell:ApplicationBarIconButton IconUri="/icons/appbar.message.send.png" IsEnabled="True" Text="send"/>
</phone:PhoneApplicationPage.ApplicationBar>
<!--LayoutRoot is the root grid where all page content is placed-->
<Grid x:Name="LayoutRoot" Background="Transparent">
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
<RowDefinition Height="auto"/>
</Grid.RowDefinitions>
<Grid x:Name="userInfo" Grid.Row="0" Margin="12,0,0,0">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="15" />
<ColumnDefinition Width="84" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="48"/>
</Grid.ColumnDefinitions>
<Image x:Name="PresenceIcon" Grid.Column="0" Height="64" Width="12" HorizontalAlignment="Left" VerticalAlignment="Bottom" Source="available.jpg" />
<Image x:Name="DisplayImage" Grid.Column="1" Height="64" Width="64" HorizontalAlignment="Left" VerticalAlignment="Bottom" Source="tony.jpg" Margin="0" />
<Grid x:Name="metaContact_info" Grid.Column="2">
<Grid.RowDefinitions>
<RowDefinition Height="*"/>
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<TextBlock x:Name="DisplayName" Grid.Row="0" Text="Tony Stark" TextWrapping="NoWrap" FontSize="40" />
<TextBlock x:Name="DisplayStatus" Grid.Row="1" Text="enjoying windows phone" FontSize="18" TextTrimming="WordEllipsis" />
</Grid>
<Image x:Name="ServiceIcon" Grid.ColumnSpan="2" Grid.Column="3" Source="service_gtalk.jpg" Width="24" Height="24" VerticalAlignment="Top" Margin="0,20,0,0"/>
</Grid><!-- userInfo ends -->
<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,18,12,12">
<Grid.RowDefinitions>
<RowDefinition Height="auto" />
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<ScrollViewer x:Name="messages" Grid.Row="0" HorizontalContentAlignment="Stretch" VerticalContentAlignment="Stretch" Margin="0"/>
</Grid>
<ScrollViewer x:Name="inputBox_scroller" Grid.Row="2" Margin="0" MaxHeight="108" VerticalAlignment="Bottom">
<TextBox x:Name="inputBox" TextWrapping="Wrap" HorizontalContentAlignment="Stretch" Text="" FontSize="{StaticResource PhoneFontSizeMedium}" InputScope="Chat" AcceptsReturn="True" />
</ScrollViewer><!-- Content Panel ends -->
I am also using Jeff Wilcox's PhoneThemeManager 1.2 to make my app always load in light theme.
When I have appBar in this screen and the keyboard opens, there is extra margin of about 48 px below the textBox. When the phone theme is black, this shows an ugly black bar above the keyboard and below the textBox. When the phone theme is white, this black color bar is in white color. Here are screenshots to better demonstrate:
However, when I disable the appbar and then open the keyboard, this extra margin below the textBox is not there.
I want to disable this extra margin when keyboard is open just like how it happens in messaging hub where appBar is there, along with auto correct bar of keyboard and still this extra margin isn't there.

Answer 1

The only way (known by now) is to disabling the AppBar when you're typing.

Answer 2

Hi i had this problem too. Setting the Textbox.InputScope to nothing removes the extra bar above the keyboard, other than that I wasn't able to make it disappear, short of removing the AppBar.