WPF项目入门1-简单登录页面的设计和开发

  先看效果

  

上代码

   1 默认启动页面代码

<Application x:Class="WpfApp2.App"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:local="clr-namespace:WpfApp2"
             StartupUri="MainWindow.xaml">
    <Application.Resources>
         
    </Application.Resources>
</Application>

 

2  前端布局，设置，控件使用，和按钮双击，添加事件代码

<Window x:Class="WpfApp2.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        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:WpfApp2"
        mc:Ignorable="d"
        Title="登录页面" Height="294.5" Width="374.5" ShowInTaskbar="False" 
        WindowStartupLocation="CenterScreen" WindowState="Maximized" Topmost="True" Icon="Imgs/logoyun.png"
      
        >
    <!--网格类型的 行和列 布局控件 Grid Window的Content 内容  -->
    <Grid Margin="0,0,-91,-67">
        <!--Content属性设置文本内容 1 Content="登录" 设置文本值内容的2种方式，2 写在文本之间。3 label控件写入方式 实现 -->
        <Button Name="btnLogin" HorizontalAlignment="Left" Margin="104,172,0,0" VerticalAlignment="Top" 
                 Width="50" Content="登录" Click="btnLogin_Click">
            <!--<Label Content="登录" HorizontalAlignment="Left"  VerticalAlignment="Top" RenderTransformOrigin="0.5,0.5">
                <Label.RenderTransform>
                    <TransformGroup>
                        <ScaleTransform/>
                        <SkewTransform/>
                        <RotateTransform Angle="-0.464"/>
                        <TranslateTransform/>
                    </TransformGroup>
                </Label.RenderTransform>
            </Label>-->
        </Button>
        <Label Name="lbluName" Content="账号:" HorizontalAlignment="Left" 
               Margin="93,88,0,0" VerticalAlignment="Top" Width="108"/>
        <TextBox Name="txtUName" HorizontalAlignment="Left" Height="23" Margin="139,90,0,0"
                 TextWrapping="NoWrap" 
                 Text="admin" VerticalAlignment="Top" Width="120"/>

        <Label Content="密码:" HorizontalAlignment="Left" 
               Margin="93,118,0,0" VerticalAlignment="Top" Width="108"/>
        <PasswordBox Name="txtUPwd" HorizontalAlignment="Left" Height="23" Margin="139,122,0,0"
                 Password="123456" PasswordChar="*" VerticalAlignment="Top" Width="120"/>
        <Button Name="btnConcel"
                Content="取消" HorizontalAlignment="Left"
                Margin="184,172,0,0" VerticalAlignment="Top" Width="50" 
                Click="BtnCancel_Click"/>


    </Grid>

    <!--根节点 window-->
</Window>

 3 C#类代码，按钮事件的注册

  

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;

namespace WpfApp2
{
    /// <summary>
    /// MainWindow.xaml 的交互逻辑
    /// </summary>
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
        }

        private void btnLogin_Click(object sender, RoutedEventArgs e)
        {
            //控件的事件注册

        }

        private void BtnCancel_Click(object sender, RoutedEventArgs e)
        {

        }
    }
}

启动效果