上一节主要讲了数据库的数据访问层,逻辑业务层以及贯穿始终的模型层从而访问数据源。这届通过表示层来讲述C#中WPF界面的设计以及表示层如何与逻辑业务层互相传递数据。
界面主要有如下七个:登录界面;个人主页;修改个人信息界面;头像选择界面;聊天窗口界面;陌生人查询界面;注册个人信息界面
登录界面
实现功能:账号密码的验证(提示错误或跳转到个人主页),登录,退出登录,注册账号(跳转到注册界面),以及顶部动画的显示
编辑界面代码:
<Window x:Class="MyQQTest5.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="QQ" Height="480" Width="550" ResizeMode="CanMinimize" Icon="image/icon/1.bmp" WindowStartupLocation="CenterScreen" Loaded="Window_Loaded" WindowStyle="None" AllowsTransparency="True" Background="Transparent"> <Canvas Margin="0,110">
<Image Height="370" Width="550" Source="image/backimg/bg4.jpg" Stretch="Fill" Opacity="0.8"/>
<Label Content="账 号:" Canvas.Left="84" Canvas.Top="116" Width="86" FontFamily="kaiti" FontSize="20" VerticalContentAlignment="Center"/>
<Label Content="密 码:" Canvas.Left="84" Canvas.Top="202" Width="86" FontFamily="kaiti" FontSize="20" VerticalContentAlignment="Center"/>
<Label Content="Q Q" Canvas.Left="183" Canvas.Top="27" Width="131" FontFamily="kaiti" FontSize="60" HorizontalContentAlignment="Center" Height="66" Foreground="Blue"/>
<TextBox Height="33" Canvas.Left="183" TextWrapping="Wrap" Canvas.Top="116" Width="201" FontFamily="20" VerticalContentAlignment="Center" Name="IdText"/>
<PasswordBox Height="33" Canvas.Left="183" Canvas.Top="202" Width="201" FontFamily="20" VerticalContentAlignment="Center" Name="PwdText"/>
<Label Content="注册账号" Canvas.Left="397" Canvas.Top="314" Width="133" FontFamily="kaiti" FontSize="20" HorizontalContentAlignment="Center" Foreground="Red" MouseEnter="Label_MouseEnter" MouseLeave="Label_MouseLeave" MouseLeftButtonDown="Label_MouseLeftButtonDown" Name="RegisterButton"/>
<Button Content="登 录" Foreground="Black" FontSize="20" Background="YellowGreen" FontFamily="kaiti" Canvas.Left="157" Canvas.Top="271" Width="206" Height="34" Click="Button_Click"/>
<Label Content="退出登录" Canvas.Left="10" Canvas.Top="323" Width="133" FontFamily="kaiti" FontSize="15" HorizontalContentAlignment="Center" Foreground="Green" MouseEnter="RegisterButton_Copy_MouseEnter" MouseLeave="RegisterButton_Copy_MouseLeave" MouseLeftButtonDown="RegisterButton_Copy_MouseLeftButtonDown" x:Name="RegisterButton_Copy"/>
<Image Height="100" Canvas.Top="-43" Width="550" Source="image/backimg/yezi2.png" Stretch="Fill"/>
<Image Height="100" Canvas.Top="-109" Width="550" Source="image/backimg/cloud.png" Stretch="Fill" Name="Cloud" Canvas.Left="-550"/>
<Image Height="166" Width="112" Source="image/backimg/yezi3.png" Stretch="Fill" Canvas.Left="84" Canvas.Top="-17" RenderTransformOrigin="0.491,0.006" Name="Leaf">
</Image>
</Canvas> </Window>
后台代码:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;
using System.Data;
using System.Data.SqlClient;
using BLL;
using System.Windows.Media.Animation;
namespace MyQQTest5
{
///
/// MainWindow.xaml 的交互逻辑
///
public partial class MainWindow : Window
{
public MainWindow()
{
InitializeComponent();
}
private void Label_MouseEnter(object sender, MouseEventArgs e)
{
RegisterButton.Foreground = Brushes.Blue;
}
private void Label_MouseLeave(object sender, MouseEventArgs e)
{
RegisterButton.Foreground = Brushes.Red;
}
private void Label_MouseLeftButtonDown(object sender, MouseButtonEventArgs e)
{
Register rs = new Register();
rs.ShowDialog();
}
private void Button_Click(object sender, RoutedEventArgs e)
{
try
{
if (um.CheckLogin(int.Parse(IdText.Text), PwdText.Password) == 1)
{
UserView uv = new UserView();
uv.id = int.Parse(IdText.Text);
this.Close();
uv.ShowDialog();
}
else
{
MessageBox.Show("账号或密码不正确!请重新输入!");
PwdText.Clear();
}
}
catch (Exception)
{
MessageBox.Show("账号或密码格式不正确!");
IdText.Clear();
}
}
UserManager um = new UserManager();
/// <summary>
/// 用户登录
/// </summary>
/// <param name="sender"></param>
/// <param name="e"></param>
private void Window_Loaded(object sender, RoutedEventArgs e)
{
RotateTransform rt = new RotateTransform();
Leaf.RenderTransformOrigin = new Point(0,0);
Leaf.RenderTransform = rt;
DoubleAnimation da = new DoubleAnimation();
da.Duration = new Duration(TimeSpan.FromSeconds(2));
da.From = 45;
da.To = 0;
da.RepeatBehavior = RepeatBehavior.Forever;
da.AutoReverse = true;
Storyboard sb = new Storyboard();
sb.Children.Add(da);
Storyboard.SetTarget(da, Leaf);
Storyboard.SetTargetProperty(da, new PropertyPath("RenderTransform.Angle"));
sb.Begin();
DoubleAnimation da1 = new DoubleAnimation();
da1.Duration = new Duration(TimeSpan.FromSeconds(8));
da1.RepeatBehavior = RepeatBehavior.Forever;
da1.From = -550;
da1.To = 550;
Storyboard sb1 = new Storyboard();
sb1.Children.Add(da1);
Storyboard.SetTarget(da1, Cloud);
Storyboard.SetTargetProperty(da1, new PropertyPath("(Canvas.Left)"));
DoubleAnimation da2 = new DoubleAnimation();
da2.Duration = new Duration(TimeSpan.FromSeconds(8));
da2.RepeatBehavior = RepeatBehavior.Forever;
da2.From = 1;
da2.To = 0;
sb1.Children.Add(da2);
Storyboard.SetTarget(da2,Cloud);
Storyboard.SetTargetProperty(da2,new PropertyPath("Opacity"));
sb1.Begin();
}
private void RegisterButton_Copy_MouseEnter(object sender, MouseEventArgs e)
{
RegisterButton_Copy.Foreground = Brushes.Black;
}
private void RegisterButton_Copy_MouseLeave(object sender, MouseEventArgs e)
{
RegisterButton_Copy.Foreground = Brushes.Green;
}
private void RegisterButton_Copy_MouseLeftButtonDown(object sender, MouseButtonEventArgs e)
{
this.Close();
}
}
}
个人主页
实现功能:好友的相应信息显示(账号,性别,昵称等),个人的相应信息显示,搜索陌生人(跳转到搜索界面),修改个人资料(跳转到修改个人信息界面),好友消息提醒并向好友发送消息(跳转到聊天窗口界面)
编辑界面代码:
<Window x:Class="MyQQTest5.UserView"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="我的QQ" Height="609" Width="300" Icon="image/icon/1.bmp" ResizeMode="CanMinimize" Left="1450" Top="250" Loaded="Window_Loaded">
<Canvas Background="HotPink">
<Image Height="30" Canvas.Top="538" Width="100" Source="image/icon/button.bmp" Stretch="Fill"/>
<Image Height="30" Canvas.Top="538" Width="100" Source="image/icon/button.bmp" Stretch="Fill" Canvas.Left="185"/>
<Image Height="154" Width="294" Source="image/backimg/bg1.jpg" Stretch="Fill" />
<Image Height="98" Canvas.Left="10" Canvas.Top="29" Width="95" Name="picTitle" Stretch="Fill"/>
<Label Canvas.Top="542" RenderTransformOrigin="0.1,3.1" Height="29" Width="100" Content="QQ搜索" HorizontalContentAlignment="Center" FontFamily="kaiti" FontSize="15" Foreground="Red" MouseLeftButtonDown="Label_MouseLeftButtonDown_1"/>
<Label Canvas.