C# WPF开发可以仿照的多款登陆窗体,总有一个你喜欢

概述

    日常开发过程中，登陆窗体是我们经常会用到的，但是时常自己开发的登陆窗体有很丑陋，实际上我们常用的app每个都有登陆界面，有很多值得我们借鉴的漂亮登陆界面，我们只要参考一下，就很容易做出适合我们自己的。下面小编就展示十几款很常见的登陆界面截图，希望能帮到大家.同时文末展示一款我自己开发的登陆界面以及源码.

登陆窗体展示

款式1：腾讯会议

款式二：百度网盘

款式三:金蝶云星空

款式四:酷狗音乐

款式五:12306

款式六:easy connect

款式七:来源自网络

款式八:摄图网

款式九:知识管理协同办公平台

款式十:新榜官网

款式十一：知乎平台

款式十一：博客园

款式十二：csdn专业it技术社区

登陆界面开发

样式截图：

前台xaml代码：

<Window x:Class="AccountingSystem.Views.LoginView"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:dxe="http://schemas.devexpress.com/winfx/2008/xaml/editors"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        mc:Ignorable="d"
        WindowStyle="None" AllowsTransparency="True" Background="{x:Null}" Foreground="Blue"
        Title="LoginWindow" Height="320" Width="300" WindowStartupLocation="CenterScreen">
    <!--<Window.Background>
        <ImageBrush ImageSource="/Images/loginimage.jpg"/>
    </Window.Background>-->
    <Grid  Width="{Binding Width, ElementName=w}" Height="{Binding Height, ElementName=w}">
        <Grid.RowDefinitions>
            <RowDefinition Height="150"/>
            <RowDefinition Height="50" />
            <RowDefinition Height="50" />
            <RowDefinition  />
        </Grid.RowDefinitions>
        <!--<Image Source="/Images/loginimage.jpg" Stretch="UniformToFill" Grid.RowSpan="4"/>-->
        <Border Grid.RowSpan="4" BorderBrush="Gray" BorderThickness="3" CornerRadius="20" Margin="10"  Opacity="1" Background="Thistle"></Border>
        <Button  Name="BtnClose"  Grid.Row="0" Margin="20" 
                 Width="48" Height="48"  BorderBrush="{x:Null}" Background="{x:Null}"
                 HorizontalAlignment="Right" VerticalAlignment="Top">
            <Image Source="/Images/exit1.png"/>
        </Button>
        <Image Grid.Row="0"  VerticalAlignment="Center" Width="120"  Height="120" Source="/Images/login.png" />


        <TextBox x:Name="UserTextBox" Text="{Binding UserInformation.UserName}"  Grid.Row="1"  Width="200" VerticalAlignment="Bottom" BorderThickness="0,0,0,1" Height="25"></TextBox>
        <TextBlock Foreground="DarkGray"  Grid.Row="1"  IsHitTestVisible="False" HorizontalAlignment="Center" Height="25" Text="请输入用户名" VerticalAlignment="Bottom" Width="90" FontFamily="Microsoft YaHei">
            <TextBlock.Style>
                <Style TargetType="{x:Type TextBlock}">
                    <Setter Property="Visibility" Value="Collapsed"/>
                    <Style.Triggers>
                        <DataTrigger Binding="{Binding Text, ElementName=UserTextBox}" Value="">
                            <Setter Property="Visibility" Value="Visible"/>
                        </DataTrigger>
                    </Style.Triggers>
</Style>
            </TextBlock.Style>
        </TextBlock>
        <dxe:PasswordBoxEdit  x:Name="PwdTextBox" Text="{Binding UserInformation.Password}"  
                              Grid.Row="2"  Width="200" 
                              VerticalAlignment="Bottom" BorderThickness="0,0,0,1" Height="25"></dxe:PasswordBoxEdit>
        <TextBlock Foreground="DarkGray" Grid.Row="2"  IsHitTestVisible="False" HorizontalAlignment="Center" Height="25" Text="请输入密码" VerticalAlignment="Bottom" Width="90" FontFamily="Microsoft YaHei">
            <TextBlock.Style>
                <Style TargetType="{x:Type TextBlock}">
                    <Setter Property="Visibility" Value="Collapsed"/>
                    <Style.Triggers>
                        <DataTrigger Binding="{Binding Text, ElementName=PwdTextBox}" Value="">
                            <Setter Property="Visibility" Value="Visible"/>
                        </DataTrigger>
                    </Style.Triggers>
</Style>
            </TextBlock.Style>
        </TextBlock>


        <Button Name="BtnLogin"  Grid.Row="2"  Width="48" Margin="10,10,10,0"
                BorderBrush="{x:Null}" Background="{x:Null}" 
                Height="48"   HorizontalAlignment="Right" VerticalAlignment="Top" >
            <Image Source="/Images/userlogin.png"/>
        </Button>
    </Grid>
</Window>

后台代码：

using AccountingSystem.Models;
using Caliburn.Micro;
using PropertyChanged;
using System.Text;
using System.Windows;


namespace AccountingSystem.ViewModels
{
    [AddINotifyPropertyChangedInterface]
    public class LoginViewModel :Screen
    {
        private static readonly log4net.ILog loginfo = log4net.LogManager.GetLogger("LoginViewModel");
        public UserInformation UserInformation { get; set; }
        public LoginViewModel()
        {
            loginfo.Debug($"Enter [LoginViewModel].");
            UserInformation = new UserInformation();
            loginfo.Debug($"Leave [LoginViewModel].");
        }
        public void BtnLogin()
        {
            var str = ValidateLoginData();
            if(!string.IsNullOrEmpty(str))
            {
                MessageBox.Show(str);
 
            }
            else 
            {
                var loginWindow = (Window)this.GetView();
                loginWindow.Hide();


                var mainWindowViewModel = IoC.Get<MainWindowViewModel>();
                IWindowManager windowManager = IoC.Get<IWindowManager>();
                windowManager.ShowDialogAsync(mainWindowViewModel);
                this.TryCloseAsync();
            }


        }


       
        public void BtnClose()
        {
            this.TryCloseAsync();
        }


        public string ValidateLoginData()
        {
            StringBuilder sb = new StringBuilder();
            if (UserInformation.UserName == "zls20210502"
                    && UserInformation.Password == "12345678")
            {
                sb.Append("");
            }
            else
            {
                sb.AppendLine("账号或者密码输入有误,请检查！");
            }
            return sb.ToString();
        }
    }
}

技术群：添加小编微信并备注进群
小编微信：mm1552923   
公众号：Dotnet讲堂