MessageTextPage.xaml

<Page
    x:Class="RingClientUWP.Views.MessageTextPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:RingClientUWP"
    xmlns:ctl="using:RingClientUWP.Controls"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d">

    <Page.Resources>
        <DataTemplate x:Key="ConversationMessageTemplate" x:DataType="local:ConversationMessage">
            <Grid>
                <TextBlock x:Name="_msgContent_" Text="{x:Bind Payload}"/>
            </Grid>
        </DataTemplate>

        <!-- barre d'envoi de message -->
    <Style TargetType="TextBox">
        <Setter Property="MinWidth" Value="{ThemeResource TextControlThemeMinWidth}" />
        <Setter Property="MinHeight" Value="{ThemeResource TextControlThemeMinHeight}" />
        <Setter Property="Foreground" Value="Black" />
        <Setter Property="Background" Value="white" />
        <Setter Property="FontFamily" Value="{ThemeResource ContentControlThemeFontFamily}" />
        <Setter Property="FontSize" Value="{ThemeResource ControlContentThemeFontSize}" />
        <Setter Property="ScrollViewer.HorizontalScrollMode" Value="Auto" />
        <Setter Property="ScrollViewer.VerticalScrollMode" Value="Auto" />
        <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Hidden" />
        <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Hidden" />
        <Setter Property="ScrollViewer.IsDeferredScrollingEnabled" Value="False" />
        <Setter Property="Padding" Value="4,4"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="TextBox">
                        <Grid>
                            <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="*" />
                            <ColumnDefinition Width="Auto" />
                        </Grid.ColumnDefinitions>
                        <Grid.RowDefinitions>
                            <RowDefinition Height="Auto" />
                            <RowDefinition Height="*" />
                        </Grid.RowDefinitions>
                        <Border x:Name="BackgroundElement"
                                Grid.Row="1"
                                Background="{TemplateBinding Background}"
                                Margin="{TemplateBinding BorderThickness}"
                                Opacity="1"
                                Grid.ColumnSpan="2"
                                BorderBrush="LightBlue"
                                BorderThickness="1"
                                Grid.RowSpan="1"/>
                        <ScrollViewer x:Name="ContentElement"
                                      Grid.Row="1"
                                      HorizontalScrollMode="{TemplateBinding ScrollViewer.HorizontalScrollMode}"
                                      HorizontalScrollBarVisibility="{TemplateBinding ScrollViewer.HorizontalScrollBarVisibility}"
                                      VerticalScrollMode="{TemplateBinding ScrollViewer.VerticalScrollMode}"
                                      VerticalScrollBarVisibility="{TemplateBinding ScrollViewer.VerticalScrollBarVisibility}"
                                      IsHorizontalRailEnabled="{TemplateBinding ScrollViewer.IsHorizontalRailEnabled}"
                                      IsVerticalRailEnabled="{TemplateBinding ScrollViewer.IsVerticalRailEnabled}"
                                      IsDeferredScrollingEnabled="{TemplateBinding ScrollViewer.IsDeferredScrollingEnabled}"
                                      Margin="{TemplateBinding BorderThickness}"
                                      Padding="{TemplateBinding Padding}"
                                      IsTabStop="False"
                                      AutomationProperties.AccessibilityView="Raw"
                                      ZoomMode="Disabled" />

                        <Button x:Name="_sendBtn_"
                                Background="Transparent"
                                Grid.Row="1"
                                FontFamily="Segoe MDL2 Assets"
                                Foreground="LightBlue"
                                Content="&#xE122;"
                                IsTabStop="False"
                                Grid.Column="1"
                                Click="_sendBtn__Click"
                                Visibility="Visible"
                                MinWidth="34"
                                FontSize="20"
                                VerticalAlignment="Stretch"/>
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
    </Page.Resources>

    <Grid Background="White">
        <Grid.RowDefinitions>
            <RowDefinition Height="auto" />
            <RowDefinition Height="*"/>
            <RowDefinition Height="auto" />
        </Grid.RowDefinitions>
        <StackPanel Grid.Row="0"
                    Background="White"
                    Height="70"
                    Orientation="Horizontal"
                    Padding="10,10">
            <Image Source="ms-appx:///contact-avatar-test.png" />
            <StackPanel>
                    <TextBlock x:Name="_title_"
                               Text="[TEXT MISSING]"
                               TextWrapping="NoWrap"
                               VerticalAlignment="Center"
                               FontSize="20"
                               Margin="20,0" />
            </StackPanel>

        </StackPanel>
        <ScrollViewer  BorderThickness="0,1,0,1"
                       BorderBrush="LightBlue"
                       Grid.Row="1">
            <StackPanel x:Name="_messagesWindowOutput_"
                        Background="#FFF2F2F2">
                    <ListBox x:Name="_messagesList_"
                             Margin="0"
                             Padding="0"
                             ItemTemplate="{StaticResource ConversationMessageTemplate}"/>
            </StackPanel>
        </ScrollViewer>
        <Grid Height="50"
              Grid.Row="2"
              Margin="0"
              Padding="0"
              Background="#FFF2F2F2">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="30" />
                <ColumnDefinition Width="*" />
                <ColumnDefinition Width="30" />
            </Grid.ColumnDefinitions>
            <TextBox x:Name="_messageTextBox_"
                     Grid.Column="1"
                     HorizontalAlignment="Stretch"
                     TextWrapping="NoWrap"
                     VerticalAlignment="Center"
                     Margin="10"
                     Background="White"
                     KeyDown="_messageTextBox__KeyDown"/>
        </Grid>
    </Grid>
</Page>