WPF实例系列一：登录、注册界面设计

WPF实例系列一：登录、注册界面设计

---

---

前言

本实例将展示利用WPF设计登录界面、注册界面，并实现相应的功能，其中账户数据将存储在excel表中（补充：增加Mysql数据库存储账户数据）。

---

一、实例演示

1. 登录界面展示

​​​

2. 注册界面展示

3. 数据存储

4. 效果演示

二、结构及源码

1.主界面跳转登录界面设计

MainWindow.xaml.cs跳转登录界面代码如下：

using System;
using System.Windows;
using System.Windows.Threading;

namespace sample5
{
   
    /// <summary>
    /// MainWindow.xaml 的交互逻辑
    /// </summary>
    public partial class MainWindow : Window
    {
   
        //public int play_state = 1;  
        public MainWindow()
        {
   
            InitializeComponent();

            #region 登录界面加载及验证
            //显示登陆界面，验证后返回。
            LoginWindow loginWindow = new LoginWindow();
            loginWindow.ShowDialog();
            if (loginWindow.DialogResult != Convert.ToBoolean(1))
            {
   
                this.Close();
            }
            //显示登陆界面 结束
            #endregion 
         }
     }
 }     

2.登录界面设计

Xaml代码如下（添加1个Nuget库：MaterialDesignThemes.3.1.0-ci981 ；可参考）：

<Window x:Class="sample5.LoginWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:materialDesign="http://materialdesigninxaml.net/winfx/xaml/themes"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:sample5"
        mc:Ignorable="d"
        Title="用户登录" Height="500" Width="350" 
        ResizeMode="NoResize" 
        WindowStartupLocation="CenterScreen" 
        WindowStyle="None" 
        MouseLeftButtonDown="MoveWindow_MouseLeftButtonDown"
        FontFamily="Segoe UI Emoji">

    <Grid>
        <Rectangle Height="280" VerticalAlignment="Top">
            <Rectangle.Fill>
                <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                    <GradientStop Color="#FF2281D1"/>
                    <GradientStop Color="#FF34268A" Offset="1"/>
                    <GradientStop Color="#FF33288B" Offset="0.546"/>
                </LinearGradientBrush>
            </Rectangle.Fill>
        </Rectangle>
        <Rectangle Height=" 220" VerticalAlignment="Bottom" >
            <Rectangle.Fill>
                <SolidColorBrush Color="Snow" />
            </Rectangle.Fill>
        </Rectangle>

        <Rectangle Width="280" Height="240" VerticalAlignment="Bottom" Margin="0,80" RadiusY="10" RadiusX="10" Fill="White">
            <Rectangle.Effect>
                <DropShadowEffect BlurRadius="15" Direction="0" RenderingBias="Quality" ShadowDepth="1" Color="#FFBBBBBB"/>
            </Rectangle.Effect>
        </Rectangle>
        
        <Grid VerticalAlignment="Bottom" Margin="35,80" Height="240">
            <Label Content="登录" HorizontalAlignment="Center" VerticalAlignment="Top" Margin="5" Foreground="Gray" FontSize="18"/>
            <StackPanel VerticalAlignment="Center" Margin="15">
                <TextBox x:Name="Account" Margin="0,5" materialDesign:HintAssist.Hint="账号" Style="{
       StaticResource MaterialDesignFloatingHintTextBox}" FontFamily="Champagne &amp; Limousines" FontSize="16"/>
                <PasswordBox x:Name="Password" Margin="0,5" materialDesign:HintAssist.Hint="密码" Style="{
       StaticResource MaterialDesignFloatingHintPasswordBox}" FontFamily="Champagne &amp; Limousines" FontSize="16"/>
            </StackPanel>
        </Grid>

        <Button Width="150" HorizontalAlignment="Center" VerticalAlignment="Bottom" Margin=