Commit 5c65112e authored by Margaux Clerc's avatar Margaux Clerc

Rework chat view

parent 0b136390
......@@ -4,14 +4,14 @@
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:linphone="using:Linphone.Controls"
mc:Ignorable="d"
d:DesignHeight="100" d:DesignWidth="420">
mc:Ignorable="d">
<UserControl.Resources>
<Style TargetType="TextBlock" x:Key="TimestampStyle">
<Setter Property="Foreground" Value="White"/>
<Setter Property="FontSize" Value="14"/>
<Setter Property="Opacity" Value="0.5"/>
<Setter Property="Margin" Value="5"/>
<Setter Property="Margin" Value="0,0,5,5"/>
</Style>
<Style TargetType="TextBlock" x:Key="MessageStyle">
......
......@@ -6,19 +6,19 @@
xmlns:linphone="using:Linphone.Controls"
xmlns:custom="using:Linphone.Controls"
xmlns:controls="Linphone.Controls"
mc:Ignorable="d"
d:DesignHeight="100" d:DesignWidth="420">
mc:Ignorable="d">
<UserControl.Resources>
<Style TargetType="TextBlock" x:Key="TimestampStyle">
<Setter Property="Foreground" Value="White"/>
<Setter Property="Opacity" Value="0.5"/>
<Setter Property="Margin" Value="0,0,5,3"/>
<Setter Property="FontSize" Value="14"/>
<Setter Property="Margin" Value="0,0,5,5"/>
</Style>
<Style TargetType="TextBlock" x:Key="MessageStyle">
<Setter Property="Foreground" Value="White"/>
<Setter Property="Margin" Value="5,5,5,3"/>
<Setter Property="Margin" Value="7,5,2,2"/>
</Style>
</UserControl.Resources>
......@@ -38,6 +38,7 @@
Grid.Row="0"
x:Name="Message"
Style="{StaticResource MessageStyle}"
TextWrapping="Wrap"
TextAlignment="Left"/>
<Image
......@@ -53,7 +54,7 @@
<Image
x:Name="Status"
Source="/Assets/AppBar/next.png"
Height="25"
Height="15"
Stretch="Uniform"/>
<TextBlock
......
......@@ -7,93 +7,59 @@
xmlns:controls="Linphone.Controls"
mc:Ignorable="d"
d:DesignHeight="150" d:DesignWidth="420">
<UserControl.Resources>
<Style x:Key="ChatTextBox" TargetType="TextBox">
<Setter Property="Background" Value="Transparent"/>
<Setter Property="BorderThickness" Value="0"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="TextBox">
<Grid Background="Transparent">
<VisualStateManager.VisualStateGroups>
<VisualStateGroup x:Name="CommonStates">
<VisualState x:Name="Normal"/>
<VisualState x:Name="MouseOver"/>
<VisualState x:Name="Disabled">
<Storyboard>
<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background" Storyboard.TargetName="MainBorder">
<DiscreteObjectKeyFrame KeyTime="0" Value="Transparent"/>
</ObjectAnimationUsingKeyFrames>
<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="BorderBrush" Storyboard.TargetName="MainBorder">
<DiscreteObjectKeyFrame KeyTime="0"/>
</ObjectAnimationUsingKeyFrames>
<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" Storyboard.TargetName="ContentElement">
<DiscreteObjectKeyFrame KeyTime="0"/>
</ObjectAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
</VisualStateGroup>
<VisualStateGroup x:Name="FocusStates">
<VisualState x:Name="Focused">
<Storyboard>
<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background" Storyboard.TargetName="MainBorder">
<DiscreteObjectKeyFrame KeyTime="0" Value="Transparent"/>
</ObjectAnimationUsingKeyFrames>
<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="BorderBrush" Storyboard.TargetName="MainBorder">
<DiscreteObjectKeyFrame KeyTime="0"/>
</ObjectAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
<VisualState x:Name="Unfocused"/>
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
<Border x:Name="MainBorder" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" />
<Border x:Name="ReadonlyBorder" BorderThickness="{TemplateBinding BorderThickness}" Background="Transparent" Visibility="Collapsed"/>
<Border BorderBrush="Transparent" BorderThickness="{TemplateBinding BorderThickness}" Background="Transparent" >
<ContentControl x:Name="ContentElement" BorderThickness="0" HorizontalContentAlignment="Stretch" Padding="{TemplateBinding Padding}" VerticalContentAlignment="Stretch"/>
</Border>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</UserControl.Resources>
<Grid Margin="60,5,5,5">
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>
<Rectangle Fill="WhiteSmoke" Grid.RowSpan="2" Grid.Row="0"/>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="40"></ColumnDefinition>
<ColumnDefinition Width="*"></ColumnDefinition>
<ColumnDefinition Width="40"></ColumnDefinition>
</Grid.ColumnDefinitions>
<Image
Grid.Row="0"
x:Name="Image"
Stretch="Uniform"
Margin="10"
Visibility="Collapsed">
Grid.Row="1"
x:Name="Image"
Stretch="Uniform"
Margin="10"
Visibility="Collapsed">
</Image>
<TextBox
Grid.Row="1"
x:Name="Message"
TextChanged="Message_TextChanged"
InputScope="Chat"
TextAlignment="Left"
TextWrapping="Wrap"
AcceptsReturn="True"
Style="{StaticResource ChatTextBox}"/>
<Path
Grid.Row="2"
Data="m 0,0 l 8,0 l 0,16 l -16,-16"
Fill="WhiteSmoke"
Margin="0,-1,10,0"
HorizontalAlignment="Right"/>
<Button
x:Name="SendFile"
BorderThickness="0"
Style="{StaticResource ButtonStyle}"
Click="SendFile_Click"
Background="Transparent">
<Button.ContentTemplate>
<DataTemplate>
<FontIcon x:Name="SendFile" FontFamily="Segoe MDL2 Assets" Glyph="&#xE723;" RenderTransformOrigin="0.5,0.5"/>
</DataTemplate>
</Button.ContentTemplate>
</Button>
<TextBox
x:Name="Message"
TextChanged="Message_TextChanged"
InputScope="Chat"
x:Uid="ChatMessageHint"
TextAlignment="Left"
TextWrapping="Wrap"
AcceptsReturn="True"
BorderThickness="0"
Grid.Column="1"/>
<Button
x:Name="SendMessage"
BorderThickness="0"
Grid.Column="2"
Style="{StaticResource ButtonStyle}"
Click="SendMessage_Click"
Background="Transparent"
IsEnabled="False">
<Button.ContentTemplate>
<DataTemplate>
<FontIcon Grid.Column="2" FontFamily="Segoe MDL2 Assets" Glyph="&#xE724;" RenderTransformOrigin="0.5,0.5"/>
</DataTemplate>
</Button.ContentTemplate>
</Button>
</Grid>
</UserControl>
\ No newline at end of file
......@@ -13,54 +13,39 @@ You should have received a copy of the GNU General Public License
along with this program; if not, write to the Free Software
Foundation, Inc., 59 Temple Place - Suite 330, Boston, MA 02111-1307, USA.
*/
using System;
using System.Collections.Generic;
using System.Linq;
using System.Net;
using System.Windows;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;
using Windows.UI.Xaml.Media.Imaging;
namespace Linphone.Controls
{
/// <summary>
/// Custom TextBox to look like a chat bubble.
/// </summary>
public partial class TextBoxChatBubble : UserControl
{
/// <summary>
/// Public accessor to this control text.
/// </summary>
public string Text { get; set; }
/// <summary>
/// Sets the filename associated with the image to send
/// </summary>
public string ImageName { get; set; }
/// <summary>
/// Sets the local path where the image is stored
/// </summary>
public string ImageLocalPath { get; set; }
/// <summary>
/// Public constructor.
/// </summary>
public delegate void SendFileClickEventHandler(object sender);
public event SendFileClickEventHandler SendFileClick;
public delegate void SendMessageClickEventHandler(object sender);
public event SendMessageClickEventHandler SendMessageClick;
public TextBoxChatBubble()
{
InitializeComponent();
}
/// <summary>
/// Empty the content of the textbox.
/// </summary>
public void Reset()
{
Message.Text = "";
Text = null;
ImageName = null;
ImageLocalPath = null;
SendMessage.IsEnabled = false;
Message.Visibility = Visibility.Visible;
Image.Visibility = Visibility.Collapsed;
}
......@@ -68,16 +53,13 @@ namespace Linphone.Controls
private void Message_TextChanged(object sender, TextChangedEventArgs e)
{
Text = Message.Text;
SendMessage.IsEnabled = Text.Length > 0 ? true : false;
if (TextChanged != null)
{
TextChanged(this, Message.Text);
{
TextChanged(this, Message.Text);
}
}
/// <summary>
/// Sets and displays the BitmapImage that will be sent we the user clicks on the send button
/// </summary>
/// <param name="image">the BitmapImage to display</param>
public void SetImage(BitmapImage image)
{
// Image.SourceProperty = image;
......@@ -91,17 +73,21 @@ namespace Linphone.Controls
string previousText = Text;
Reset();
Text = previousText;
Message.Text = Text;
Message.Text = Text;
}
/// <summary>
/// Delegate for text changed event.
/// </summary>
public delegate void TextChangedEventHandler(object sender, string text);
/// <summary>
/// Handler for text changed event.
/// </summary>
public event TextChangedEventHandler TextChanged;
private void SendFile_Click(object sender, RoutedEventArgs e)
{
}
private void SendMessage_Click(object sender, RoutedEventArgs e)
{
SendMessageClick(this);
}
}
}
......@@ -712,4 +712,10 @@ To enjoy the best experience with Linphone WP8, we recommend that you use the SI
<data name="AdvancedSettingsTitle.Title" xml:space="preserve">
<value>ADVENCED SETTINGS</value>
</data>
<data name="Call.Label" xml:space="preserve">
<value>Call</value>
</data>
<data name="ChatMessageHint.PlaceholderText" xml:space="preserve">
<value>Enter your message</value>
</data>
</root>
\ No newline at end of file
This diff is collapsed.
......@@ -6,21 +6,10 @@
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="using:Linphone"
xmlns:controls="using:Linphone.Controls"
Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"
mc:Ignorable="d">
<Page.Resources>
<Style x:Key="TextStyle"
TargetType="TextBlock">
<Setter Property="FontSize"
Value="16" />
<Setter Property="FontFamily"
Value="{ThemeResource PhoneFontFamilySemiLight}" />
<Setter Property="FontWeight"
Value="ExtraLight"/>
</Style>
</Page.Resources>
<Grid x:Name="LayoutRoot" Background="{StaticResource ApplicationPageBackgroundThemeBrush}">
<Grid x:Name="LayoutRoot">
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
......@@ -30,7 +19,7 @@
<StackPanel Grid.Row="0" Margin="12,17,0,10">
<TextBlock
x:Name="ContactName"
Style="{StaticResource HeaderTextStyle}"
Style="{StaticResource StatusBarTextStyle}"
Margin="9,0,0,0" />
<Border x:Name="NewChat" BorderThickness="0,0,0,0">
......@@ -71,18 +60,22 @@
<Grid.RowDefinitions>
<RowDefinition Height="*"></RowDefinition>
<RowDefinition Height="Auto"></RowDefinition>
<RowDefinition Height="Auto"></RowDefinition>
<RowDefinition Height="Auto"></RowDefinition>
<RowDefinition Height="Auto"></RowDefinition>
</Grid.RowDefinitions>
<ScrollViewer x:Name="MessagesScroll" Grid.Row="0">
<StackPanel
<StackPanel
x:Name="MessagesList"
Orientation="Vertical"
VerticalAlignment="Bottom">
<controls:TextBoxChatBubble x:Name="MessageBox"/>
</StackPanel>
VerticalAlignment="Bottom"/>
</ScrollViewer>
<TextBlock x:Name="RemoteComposing" Grid.Row="1" Visibility="Collapsed"/>
<controls:TextBoxChatBubble x:Name="MessageBox" Grid.Row="2" Margin="10"/>
<Border
x:Name="ProgressPopup"
Grid.Row="1"
......@@ -99,15 +92,9 @@
Text="" />
</StackPanel>
</Border>
<TextBlock
x:Name="RemoteComposing"
Visibility="Collapsed"
Grid.Row="1"/>
</Grid>
<CommandBar Grid.Row="2" VerticalAlignment="Bottom">
<AppBarButton Icon="Send" Click="send_Click_1"/>
<AppBarButton Icon="Back" Click="back_click"/>
<AppBarButton Icon="Phone" Label="Call" x:Uid="Call" Click="Call_Click"/>
</CommandBar>
</Grid>
......
This diff is collapsed.
......@@ -34,7 +34,7 @@
</ListView.ItemContainerStyle>
<ListView.ItemTemplate>
<DataTemplate >
<Grid Tapped="conversation_Click_1">
<Grid Tapped="conversation_Click_1" Margin="0,10,0,0">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="Auto"/>
......
......@@ -35,6 +35,7 @@
PlaceholderText="Search"
VerticalAlignment="Top"
Margin="12,12,12,0"
Visibility="Collapsed"
TextChanged="ContactSearchBox_TextChanged" />
<ListView x:Name="ContactListView"
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment