メッセージ画面を作成しようとしています。これは私の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 -->
また、Jeff Wilcox の PhoneThemeManager 1.2 を使用して、アプリが常にライト テーマで読み込まれるようにしています。
この画面に appBar があり、キーボードが開くと、textBox の下に約 48 ピクセルの余白ができます。電話のテーマが黒の場合、キーボードの上と textBox の下に醜い黒いバーが表示されます。電話のテーマが白の場合、この黒のカラー バーは白になります。よりよく示すためのスクリーンショットを次に示します。
ただし、appbar を無効にしてからキーボードを開くと、textBox の下にこの余分なマージンがありません。
キーボードが開いているときにこの余分なマージンを無効にしたいのですが、appBar があるメッセージング ハブで発生するのと同じように、キーボードの自動修正バーがあり、それでもこの余分なマージンはありません。