MessageTextPage.xaml 9.78 KB
Newer Older
1 2 3 4 5
<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"
6
    xmlns:views="using:RingClientUWP.Views"
7 8 9
    xmlns:ctl="using:RingClientUWP.Controls"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
10
    NavigationCacheMode="Enabled"
11 12 13
    mc:Ignorable="d">

    <Page.Resources>
14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39
        <!-- bubble -->
        <views:BubbleBackground x:Key="_bubbleBackground_" />
        <views:BubbleHorizontalAlignement x:Key="_bubbleHorizontalAlignement_" />
        <DataTemplate x:Key="ConversationMessageTemplate"
                      x:DataType="local:ConversationMessage">
            <Grid Margin="0"
                  HorizontalAlignment="{x:Bind FromContact, Converter={StaticResource _bubbleHorizontalAlignement_}}" >
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="2*" />
                    <ColumnDefinition Width="8*" />
                </Grid.ColumnDefinitions>
                <Border  Background="{x:Bind FromContact, Converter={StaticResource _bubbleBackground_}}"
                         CornerRadius="10"
                         Grid.Column="1"
                         Width="auto"
                         Height="auto"
                         Padding="5"
                         Margin="5" >
                    <ContentPresenter>
                        <!--Text="Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."-->
                        <TextBlock x:Name="_msgContent_"
                                   TextWrapping="Wrap"
                                   Text="{x:Bind Payload}"
                                   Foreground="White"/>
                    </ContentPresenter>
                </Border>
40
            </Grid>
41
        </DataTemplate>
42
        <!-- barre d'envoi de message -->
43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90
        <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" />
91

92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109
                            <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>
110 111 112 113 114 115
        <DataTemplate x:Key="_AssociableAccountsListDataTemplate_"
                      x:DataType="local:Account">
            <Grid>
                <TextBlock Text="{x:Bind name_}"/>
            </Grid>
        </DataTemplate>
116 117
    </Page.Resources>

118
    <Grid Background="#FFF2F2F2">
119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136
        <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" />
137
                <StackPanel Orientation="Horizontal">
138 139 140 141 142 143 144 145 146
                <ComboBox x:Name="_associableAccountsList_">
                    <ComboBox.ItemTemplate>
                        <DataTemplate x:DataType="local:Account">
                            <StackPanel Orientation="Horizontal">
                                <TextBlock Text="{x:Bind name_, Mode=OneWay}" />
                            </StackPanel>
                        </DataTemplate>
                    </ComboBox.ItemTemplate>
                </ComboBox>
147 148 149 150
                <Button x:Name="_deleteContact_"
                        Content="delete"
                        Click="_deleteContact__Click"/>
                </StackPanel>
151 152 153
            </StackPanel>

        </StackPanel>
154
        <ScrollViewer x:Name="_scrollView_"
155
                       BorderThickness="0,1,0,0"
156 157
                       BorderBrush="LightBlue"
                       Grid.Row="1">
158 159 160 161 162 163 164
            <StackPanel>
                <ListBox x:Name="_messagesList_"
                         Margin="0"
                         Padding="0"
                         ItemContainerStyle="{StaticResource messageBubleStyle}"
                         ItemTemplate="{StaticResource ConversationMessageTemplate}">
                </ListBox>
165 166 167 168 169 170 171 172 173 174 175 176 177 178 179 180 181 182 183 184
            </StackPanel>
        </ScrollViewer>
        <Grid Height="50"
              Grid.Row="2"
              Margin="0"
              Padding="0"
              Background="#FFF2F2F2">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="*" />
            </Grid.ColumnDefinitions>
            <TextBox x:Name="_messageTextBox_"
                     HorizontalAlignment="Stretch"
                     TextWrapping="NoWrap"
                     VerticalAlignment="Center"
                     Margin="10"
                     Background="White"
                     KeyDown="_messageTextBox__KeyDown"/>
        </Grid>
    </Grid>
</Page>