WPF登录界面

WPF登录界面

1.前端代码

<Window 
      x:Class="GetMarried.LoginWindow"
      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:GetMarried"
      mc:Ignorable="d" 
      ResizeMode="NoResize" 
      Background="Transparent" 
      AllowsTransparency="True"
      WindowStyle="None" 
      WindowStartupLocation="CenterScreen"
      Height="300" Width="400"
      Title="LoginWindow">

    <!--窗口资源-->
    <Window.Resources>
        <!--定义按钮样式-->
        <Style TargetType="Button">
            <Setter Property="Foreground" Value="Black"/>
            <!--修改模板属性-->
            <Setter Property="Template">
                <Setter.Value>
                    <!--控件模板-->
                    <!--(1)其实WPF的每一个控件都有一个默认的模板，该模板描述了控件的外观以及外观对外界刺激所做出的反应。
                        我们可以自定义一个模板来替换掉控件的默认模板以便打造个性化的控件
                    (2)与Style不同，Style只能改变控件的已有属性值（比如颜色字体）来定制控件，
                        但控件模板可以改变控件的内部结构（VisualTree，视觉树）来完成更为复杂的定制，
                        比如我们可以定制这样的按钮：在它的左办部分显示一个小图标而它的右半部分显示文本。
                    (3)要替换控件的模板，我们只需要声明一个ControlTemplate对象，并对该ControlTemplate对象做相应的配置，
                        然后将该ControlTemplate对象赋值给控件的Template属性就可以了
                    (4)ControlTemplate包含两个重要的属性： 
                        1，VisualTree，该模板的视觉树，其实我们就是使用这个属性来描述控件的外观的 
                        2，Triggers，触发器列表，里面包含一些触发器Trigger，我们可以定制这个触发器列表来使控件对外界的刺激发生反应，比如鼠标经过时文本变成粗体等。-->
                    <ControlTemplate TargetType="Button">
                        <!--定义视觉树-->
                        <!--背景色-->
                        <Border x:Name="back" Opacity="0.8" CornerRadius="3">
                            <Border.BitmapEffect>
                                <DropShadowBitmapEffect  
                                    Color="{
   Binding 
                                    RelativeSource={
   RelativeSource TemplatedParent}, 
                                    Path=(Button.Background).(SolidColorBrush.Color)}"  
                                    Direction="20" ShadowDepth="0"  Opacity="2" Softness="0"></DropShadowBitmapEffect>
                            </Border.BitmapEffect>
                            <Border.Background>
                                <!--使用LinearGradientBrush渐变画刷：定义一个渐变画刷，然后需要定义渐变颜色，颜色已直线形式渐变-->
                                <LinearGradientBrush StartPoint="0,0" EndPoint="0,1.5">
                                    <GradientBrush.GradientStops>
                                        <GradientStopCollection>
                                            <!--GradientStop:定义渐变颜色与颜色渐变始点-->
                                            <GradientStop Color="{Binding RelativeSource={RelativeSource TemplatedParent},  Path=(Button.Background).(SolidColorBrush.Color)}" Offset="0"/>
                                            <GradientStop Color="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=(Button.Background).(SolidColorBrush.Color)}" Offset="0.4"/>
                                            <GradientStop Color="#FFF" Offset="1"/>
                                        </GradientStopCollection>
                                    </GradientBrush.GradientStops>
                                </LinearGradientBrush>
                            </Border.Background>
                            <!--前景色及边框-->
                            <Border x:Name="fore" BorderThickness="1" CornerRadius="3" BorderBrush="#5555">
                                <Border.Background>
                                    <LinearGradientBrush StartPoint="0,0" EndPoint="0,1">
                                        <GradientBrush.GradientStops>
                                            <!--<GradientStop Color="#6FFF" Offset="0.5"/>
                                            <GradientStop Color="#1111" Offset="0.51"/>-->
                                            <GradientStop Color="#FF5D88C7" Offset="0.5"/>
                                            <GradientStop Color="#FF4375BD" Offset="0.51"/>
                                        </GradientBrush.GradientStops>
                                    </LinearGradientBrush>
                                </Border.Background>
                                <!--按钮内容-->
                                <ContentPresenter x:Name="content" HorizontalAlignment="Center" VerticalAlignment="Center">
                                    <ContentPresenter.BitmapEffect>
                                        <DropShadowBitmapEffect Color="#000" Direction="-90" ShadowDepth="2" Softness="0.1" Opacity="0.3" />
                                    </ContentPresenter.BitmapEffect>
                                </ContentPresenter>
                            </Border>
                        </Border>
                        <!--定义视觉树_end-->
                        <!--定义触发器-->
                        <ControlTemplate.Triggers>
                            <!--属性触发器： 鼠标移入移出-->
                            <Trigger Property="IsMouseOver" Value="True">
                                <Trigger.EnterActions>
                                    <BeginStoryboard>
                                        <Storyboard>
                                            <