ChatView.xaml

<!--
 **********************************************************************

 Copyright (c) 2003-2016 ZeroC, Inc. All rights reserved.

 **********************************************************************
-->

<!-- This file defines a WPF Page that represent the view to display the
    chat when the user is connected. -->
<Page x:Class="ChatDemoGUI.ChatView"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="clr-namespace:ChatDemoGUI"
    Title="ChatView" ShowsNavigationUI="False" Loaded="pageLoaded">
    <Page.Resources>
        <!-- Template for display users -->
        <DataTemplate x:Key="UserTemplate">
            <StackPanel Orientation="Horizontal" Margin="2,2,2,2">
                <Image Source="Images/user.png"></Image>
                <TextBlock Text="{Binding Path=Name}"/>
            </StackPanel>
        </DataTemplate>
    </Page.Resources>
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="5*"></RowDefinition>
            <RowDefinition Height="2"></RowDefinition>
            <RowDefinition Height="2*"></RowDefinition>
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition></ColumnDefinition>
        </Grid.ColumnDefinitions>

        <Grid>
            <Grid.RowDefinitions>
                <RowDefinition></RowDefinition>
            </Grid.RowDefinitions>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="3*"></ColumnDefinition>
                <ColumnDefinition Width="2"></ColumnDefinition>
                <ColumnDefinition Width="5*"></ColumnDefinition>
            </Grid.ColumnDefinitions>

            <!-- ListBox for display connected users.
                The ItemsSource attribute has the WPF binding to connect the list whith our UserList
                object data provider declared by App.xaml.
                The ItemTemplate attribute contains a reference to the template defined
                in Page.Resources.
            -->
            <ListBox Grid.Row="0" Grid.Column="0"
                 IsSynchronizedWithCurrentItem="True"
                 ItemsSource="{Binding Mode=OneWay, IsAsync=True, Source={StaticResource UserList}}"
                 ItemTemplate="{StaticResource UserTemplate}" Focusable="False" IsHitTestVisible="False"
                 IsTextSearchEnabled="False">
            </ListBox>

            <!-- Define a splitter between the user list and the conversation messages. -->
            <GridSplitter Grid.Column="1" ResizeDirection="Columns" HorizontalAlignment="Stretch" />

            <!-- Define a text box to show chat messages. -->
            <TextBox Grid.Row="0" Grid.Column="2" x:Name="txtMessages"
                 FontSize="12" Text="" TextWrapping="Wrap" IsEnabled="True"
                 ScrollViewer.CanContentScroll="True" ScrollViewer.HorizontalScrollBarVisibility="Auto"
                 ScrollViewer.VerticalScrollBarVisibility="Auto" IsReadOnly="True"
                 MinLines="4" SizeChanged="scrollDown"/>
        </Grid>

        <!-- Define another splitter to separate the upper view and the text box used
            for input messages. -->
        <GridSplitter Grid.Row="1" Grid.Column="0" Grid.ColumnSpan="3" Height="2"
                      ResizeDirection="Rows" HorizontalAlignment="Stretch"/>

        <!--- Define an editable text box for the user to write messages. -->
        <TextBox Grid.Row="2" Grid.Column="0" Grid.ColumnSpan="3"
                 Name="txtChatInputLine"
                 TextWrapping="Wrap"
                 ScrollViewer.CanContentScroll="True"
                 HorizontalScrollBarVisibility="Hidden"
                 VerticalScrollBarVisibility="Auto"
                 Background="WhiteSmoke" KeyDown="sendMessage" TabIndex="1"></TextBox>
    </Grid>
</Page>