mattuy/stormchat
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

UI设计

Browse Source
This commit is contained in:
Kaniu Tayou
2019-01-15 18:17:28 +08:00
parent 6cea1b61c7
commit 82b3f06a9d
12 changed files with 1267 additions and 98 deletions
Download Patch File Download Diff File Expand all files Collapse all files
stormchat-client-csharp/StormChatWPF/App.xaml
+5 -1
View File
@@ -4,6 +4,10 @@
xmlns:local="clr-namespace:StormChatWPF"
StartupUri="LogWindow.xaml">
<Application.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="UI/Style.xaml"/>
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</Application.Resources>
</Application>
stormchat-client-csharp/StormChatWPF/Chat.cs
+2 -2
View File
@@ -62,7 +62,7 @@ namespace StormChatWPF
{
if (MainWindow.Instence != null)
{
MainWindow.Instence.ShowMessage(message);
MainWindow.Instence.UI_ShowMessage(message);
}
}//接受到新消息
@@ -71,7 +71,7 @@ namespace StormChatWPF
Message msg = new Message(text,target);
Action<ResultHead> f = delegate (ResultHead head)
{
MainWindow.Instence.ShowMessage(msg);
MainWindow.Instence.UI_ShowMessage(msg);
};
StormClient.QueueSendMessage(msg,f);
}//发送消息
stormchat-client-csharp/StormChatWPF/LogWindow.xaml
+1 -1
View File
@@ -21,7 +21,7 @@
<RowDefinition Height="150*"/>
</Grid.RowDefinitions>
<Image x:Name="LogBackground" Grid.ColumnSpan="4" Height="268" Margin="10,10,10,0" Grid.RowSpan="2" VerticalAlignment="Top" Source="pack://application:,,,/UI/Resources/登录界面底.png"/>
<Button x:Name="Login_button" Content="LogIn" Click="Login_button_Click" Grid.ColumnSpan="2" Grid.Column="1" Grid.Row="2" Margin="160.6,69.6,160.6,44.6" Width="70" Height="25" HorizontalAlignment="Center"/>
<Button x:Name="Login_button" Content="LogIn" Click="Login_button_Click" Grid.ColumnSpan="2" Grid.Column="1" Grid.Row="2" Margin="165,72,166,42" Width="64" Height="25" HorizontalAlignment="Center"/>
<TextBox x:Name="AccountBox" TextWrapping="Wrap" Text="201701110203" Grid.Row="2" TextAlignment="Left" Margin="137.6,4.6,137.6,112.6" Grid.Column="1" Grid.ColumnSpan="2" Height="22" Width="122" HorizontalAlignment="Center" BorderThickness="0,0,0,1" VerticalAlignment="Top" />
<PasswordBox x:Name="passwordBox" Password="1233211234567" Margin="135,35,135,0" Grid.Column="1" Grid.Row="2" VerticalAlignment="Top" Grid.ColumnSpan="2" Height="22" Width="122" HorizontalAlignment="Center" BorderThickness="0,0,0,1" HorizontalContentAlignment="Left"/>
<Label x:Name="Account" Content="Account:" Grid.Column="1" Margin="0,138.8,70.2,0" Grid.Row="1" VerticalAlignment="Top" RenderTransformOrigin="0.415,0.379" Height="24" FontFamily="Comic Sans MS" FontStyle="Italic" Grid.RowSpan="2" HorizontalContentAlignment="Center" HorizontalAlignment="Right" Width="60"/>
stormchat-client-csharp/StormChatWPF/MainWindow.xaml
+24 -12
View File
@@ -6,30 +6,42 @@
xmlns:local="clr-namespace:StormChatWPF"
xmlns:my="clr-namespace:StormChatWPF.UI"
mc:Ignorable="d"
Title="StormChat" Height="450" Width="800"
WindowStartupLocation="CenterScreen">
<Grid>
Title="StormChat" Height="600" Width="850"
WindowStartupLocation="CenterScreen"
Icon="UI/Resources/闪电.png">
<Grid Margin="0,0,0,0">
<Grid.RowDefinitions>
<RowDefinition Height="60*"/>
<RowDefinition Height="300*"/>
<RowDefinition Height="90*"/>
<RowDefinition Height="100*"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="200*"/>
<ColumnDefinition Width="60*"/>
<ColumnDefinition Width="140*"/>
<ColumnDefinition Width="200*"/>
<ColumnDefinition Width="200*"/>
<ColumnDefinition Width="200*"/>
</Grid.ColumnDefinitions>
<ListView x:Name="UsersList" Margin="0,0,0,0" IsEnabled="True" SelectionChanged="UsersList_SelectionChanged" Grid.Row="1" Grid.RowSpan="2" HorizontalAlignment="Left" Width="198"/>
<TextBox x:Name="InputBox" Margin="200,0,0,0" TextWrapping="Wrap" Text="" Grid.Row="2" Grid.ColumnSpan="4" />
<Button Content="Send" HorizontalAlignment="Right" Margin="0,0,0,0" VerticalAlignment="Bottom" Width="75" Click="Button_Click" Height="20" Grid.Row="2" Grid.Column="3"/>
<ScrollViewer Grid.ColumnSpan="3" Grid.Column="1" Margin="0,0,0,0" Grid.Row="1" >
<ListView x:Name="UsersList" IsEnabled="True" SelectionChanged="UsersList_SelectionChanged" Grid.Row="1" Grid.RowSpan="2" HorizontalAlignment="Left" Width="206" Grid.ColumnSpan="2" Margin="0,10,0,0" />
<TextBox x:Name="InputBox" TextWrapping="Wrap" Text="" Grid.Row="2" Grid.ColumnSpan="3" Grid.Column="2" Height="109" VerticalAlignment="Bottom" Margin="10,0,10,5" />
<Button Content="Send" HorizontalAlignment="Right" VerticalAlignment="Bottom" Width="75" Click="Button_Click" Height="20" Grid.Row="2" Grid.Column="4" Margin="0,0,10,10"/>
<ScrollViewer Grid.ColumnSpan="3" Grid.Column="2" Grid.Row="1" BorderThickness="1">
<ScrollViewer.Content>
<StackPanel x:Name="OutBox" Margin="0,0,0,0" Grid.ColumnSpan="3" Grid.Column="1" Grid.Row="1" ScrollViewer.VerticalScrollBarVisibility="Hidden"/>
</ScrollViewer.Content>
</ScrollViewer>
<Image x:Name="User_HeadPicture" HorizontalAlignment="Left" Width="60" VerticalAlignment="Stretch"/>
<Label x:Name="User_NickNmae" Content="Label" Margin="0,10,0.4,0" HorizontalContentAlignment="Center" VerticalContentAlignment="Center" HorizontalAlignment="Right" Width="140" FontSize="18" Height="30" VerticalAlignment="Top"/>
<Label x:Name="User_motto" Content="人生很长，慢慢走。" Margin="0,40,0.4,0" VerticalContentAlignment="Top" HorizontalAlignment="Right" Width="138" FontSize="6"/>
<Image x:Name="User_HeadPicture" VerticalAlignment="Stretch" Margin="0,10,0,0"/>
<Label x:Name="User_NickNmae" Content="小施" HorizontalContentAlignment="Center" VerticalContentAlignment="Center" FontSize="18" Grid.Column="1" HorizontalAlignment="Left" Width="115" Margin="5,10,0,25"/>
<Label x:Name="User_motto" Content="别寻事惹非" Margin="5,54,0,0" VerticalContentAlignment="Center" FontSize="6" Grid.Column="1" HorizontalAlignment="Left" Width="143"/>
<Image x:Name="image" Grid.Column="2" Height="54" Margin="53,10,106,10" Width="51" Source="UI/Resources/闪电.png" Visibility="Visible" Stretch="Fill">
<Image.ContextMenu>
<ContextMenu x:Name="Menu" Initialized="Menu_Initialized" MouseLeftButtonUp="Menu_MouseLeftButtonDown">
<MenuItem Header="Settings" Click="MenuItem_Settings_Click"/>
<MenuItem Header="SignOut"/>
</ContextMenu>
</Image.ContextMenu>
</Image>
</Grid>
</Window>
stormchat-client-csharp/StormChatWPF/MainWindow.xaml.cs
+50 -24
View File
@@ -5,6 +5,7 @@ using System.IO;
using System.Linq;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Controls.Primitives;
using System.Windows.Media.Imaging;
namespace StormChatWPF
@@ -25,10 +26,10 @@ namespace StormChatWPF
}
void Window_Load(object sender, EventArgs e)
{
LoadContactsList();
LoadUserMe();
UI_LoadContactsList();
UI_LoadUserMe();
}
private void LoadUserMe()
private void UI_LoadUserMe()
{
BitmapImage image = new BitmapImage();
image.BeginInit();
@@ -38,9 +39,32 @@ namespace StormChatWPF
User_HeadPicture.Source = image;
User_NickNmae.Content = User.Me.NickName;
User_motto.Content = User.Me.Motto;
}
}//加载用当前用户UI显示信息
private void UI_LoadSettings()
{
private void LoadContactsList()
}
internal void UI_ShowMessage(Message message)
{
if (message.To == User.Me)
{
App.Current.Dispatcher.Invoke(
(Action)delegate ()
{
OutBox.Children.Add(new StormChatWPF.UI.ChatBubble(message, HorizontalAlignment.Left));
});
}//接受到的的消息
else
{
App.Current.Dispatcher.Invoke(
(Action)delegate ()
{
OutBox.Children.Add(new StormChatWPF.UI.ChatBubble(message, HorizontalAlignment.Right));
});
}//发送的的消息
}//将消息展现于UI界面
private void UI_LoadContactsList()
{
if (Chat.ContactsList.Any())
{
@@ -79,25 +103,7 @@ namespace StormChatWPF
}
}
internal void ShowMessage(Message message)
{
if (message.To == User.Me)
{
App.Current.Dispatcher.Invoke(
(Action)delegate ()
{
OutBox.Children.Add(new StormChatWPF.UI.ChatBubble(message, HorizontalAlignment.Left));
});
}//接受到的的消息
else
{
App.Current.Dispatcher.Invoke(
(Action)delegate ()
{
OutBox.Children.Add(new StormChatWPF.UI.ChatBubble(message, HorizontalAlignment.Right));
});
}//发送的的消息
}//将消息展现于UI界面
private void button_Click_1(object sender, RoutedEventArgs e)
{
@@ -108,5 +114,25 @@ namespace StormChatWPF
}
event LoadFinish MainWindowLoad;
private void MenuItem_Settings_Click(object sender, RoutedEventArgs e)
{
MessageBox.Show("Settings");
}
private void Menu_Initialized(object sender, EventArgs e)
{
this.image.ContextMenu = null;
}
private void Menu_MouseLeftButtonDown(object sender, System.Windows.Input.MouseButtonEventArgs e)
{
this.Menu.PlacementTarget = this.image;
//位置
this.Menu.Placement = PlacementMode.Top;
//显示菜单
this.Menu.IsOpen = true;
}
}
}
stormchat-client-csharp/StormChatWPF/Simple Styles.xaml
+1121
View File
File diff suppressed because it is too large Load Diff
stormchat-client-csharp/StormChatWPF/StormChatWPF.csproj
+7 -3
View File
@@ -70,8 +70,8 @@
<DependentUpon>Contacts.xaml</DependentUpon>
</Compile>
<Compile Include="UI\ContactsInfo.cs" />
<Compile Include="UI\UserMeHeadInfo.xaml.cs">
<DependentUpon>UserMeHeadInfo.xaml</DependentUpon>
<Compile Include="UI\DropDownMenu.xaml.cs">
<DependentUpon>DropDownMenu.xaml</DependentUpon>
</Compile>
<Compile Include="Window1.xaml.cs">
<DependentUpon>Window1.xaml</DependentUpon>
@@ -96,7 +96,11 @@
<SubType>Designer</SubType>
<Generator>MSBuild:Compile</Generator>
</Page>
<Page Include="UI\UserMeHeadInfo.xaml">
<Page Include="UI\DropDownMenu.xaml">
<SubType>Designer</SubType>
<Generator>MSBuild:Compile</Generator>
</Page>
<Page Include="UI\Style.xaml">
<SubType>Designer</SubType>
<Generator>MSBuild:Compile</Generator>
</Page>
stormchat-client-csharp/StormChatWPF/UI/UserMeHeadInfo.xaml → stormchat-client-csharp/StormChatWPF/UI/DropDownMenu.xaml
+4 -8
View File
@@ -1,17 +1,13 @@
<UserControl x:Class="StormChatWPF.UI.UserMeHeadInfo"
<UserControl x:Class="StormChatWPF.UI.DropDownMenu"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:local="clr-namespace:StormChatWPF.UI"
mc:Ignorable="d"
d:DesignHeight="60" d:DesignWidth="200">
d:DesignHeight="30" d:DesignWidth="30">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="60*"/>
<ColumnDefinition Width="120*"/>
</Grid.ColumnDefinitions>
<Image x:Name="image" Height="60" Margin="0,0,0,0" VerticalAlignment="Top"/>
<ComboBox x:Name="comboBox" Style="{StaticResource DropDownMenu}" Margin="-48,-7,37,-4"/>
<Image x:Name="image" HorizontalAlignment="Left" Height="30" Margin="-44,-40,0,0" VerticalAlignment="Top" Width="30"/>
</Grid>
</UserControl>
stormchat-client-csharp/StormChatWPF/UI/UserMeHeadInfo.xaml.cs → stormchat-client-csharp/StormChatWPF/UI/DropDownMenu.xaml.cs
+3 -3
View File
@@ -15,11 +15,11 @@ using System.Windows.Shapes;
namespace StormChatWPF.UI
{
/// <summary>
/// UserMeHeadInfo.xaml 的交互逻辑
/// DropDownMenu.xaml 的交互逻辑
/// </summary>
public partial class UserMeHeadInfo : UserControl
public partial class DropDownMenu : UserControl
{
public UserMeHeadInfo()
public DropDownMenu()
{
InitializeComponent();
}
stormchat-client-csharp/StormChatWPF/UI/Style.xaml
+16
View File
@@ -0,0 +1,16 @@
<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:StormChatWPF.UI">
<Style x:Key="DropDownMenu" TargetType="ComboBox">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="ComboBox">
<Grid Height="100" Width="100" Margin="0,0,0,0">
<ComboBox Width="Auto" Height="Auto" VerticalAlignment="Top" Margin="30,10,30,0" Visibility="Hidden"/>
<Image Width="Auto" Height="Auto" Source="pack://application:,,,/UI/Resources/闪电.png" Stretch="Fill" Margin="0" VerticalAlignment="Stretch"/>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</ResourceDictionary>
stormchat-client-csharp/StormChatWPF/Window1.xaml
+1 -6
View File
@@ -7,11 +7,6 @@
mc:Ignorable="d"
Title="Window1" Height="300" Width="300">
<Grid>
<StackPanel HorizontalAlignment="Left" Margin="187,0,0,10.4" Width="100">
<Image x:Name="image" Height="46" Source="UI/Resources/聊天气泡.png" Margin="0,0,10,0"/>
</StackPanel>
<Button x:Name="button" Content="Button" HorizontalAlignment="Left" Margin="90,108,0,0" VerticalAlignment="Top" Width="75" Click="Button_Click"/>
<ComboBox x:Name="comboBox" HorizontalAlignment="Left" Margin="75,85,0,0" VerticalAlignment="Top" Width="120" Style="{DynamicResource DropDownMenu}"/>
</Grid>
</Window>
stormchat-client-csharp/StormChatWPF/Window1.xaml.cs
-5
View File
@@ -26,11 +26,6 @@ namespace StormChatWPF
private void Button_Click(object sender, RoutedEventArgs e)
{
image.Source = new BitmapImage()
{
StreamSource = new FileStream(@"C:\Users\10568\Source\Repos\stormchat\stormchat-client-csharp\StormChatWPF\UI\Resources\闪电.png", FileMode.Open)
};
}
}
}