Smobiler实现美观登录界面——C# 或.NET Smobiler实例开发手机app（二）

目录

一、 本文目标

二、 准备工作

1、 数据库

2、 材料

三、 界面布局

1、设置控件的属性值

（1） 输入框

（2） 图片属性

（3） HandElectricity的标题的label属性

（4）登录按钮

（5）版权申明

 （6） 记住密码

2、 事件代码

（1） 登录按钮

（2）  使用验证码登录

（3） 其它的按钮

---

一、 本文目标

初级版，请看我的上一篇博文自行补脑哦，这里就不在赘述了。

二、 准备工作

1、 数据库

本文采用的是SqlSever2008的数据库，暂时的数据表设计如下：

表名为：HE_User       用于保存用户的账号密码等信息，其它的表现在还用不上，暂时不讲。

下表为登录的账号密码，这里会涉及到一个知识点，就是如何设置sqlsever的id自增。

这里用到了identity关键字：indentity(a,b)，a b均为正整数，a表示开始数，b表示步长，indentity(1,1)就代表从1开始，每次增加1 。下面是我创建id字段的代码。

id int IDENTITY(1,1) not null CONSTRAINT pk_id PRIMARY KEY

 

2、 材料

一张背景图片，一张背景透明的LOGO。

在ElectricityAPP下新建窗体，命名为frmLogin。

把背景图命名为bg，LOGO的图片命名为LOGO（命名不要为中文都行）放到Image这个文件夹里面。

三、 界面布局

1、设置控件的属性值

再次基础操作返回上一篇博客视频讲解。这里主要讲一些细节和美观的问题。

先往界面中拖入一个panel设置dock属性为fill。

（1） 输入框

输入框的name设置为txtUerName和ytxtPassword（这是账号和密码的输入框）。

（2） 图片属性

（3） HandElectricity的标题的label属性

（4）登录按钮

（5）版权申明

Text的内容为：Copyright ©2018-2018 DJun. All rights reserved.

 （6） 记住密码

这里只能帮到这里了。要我的素材的话，你可以评论或邮箱[email protected]联系我发给你。

2、 事件代码

（1） 登录按钮

我在这里写一个函数IsConnectDB来返回登录状态的。

登录按钮的Press事件：

a. 需要判断是否勾选保存密码的checkbox。

b. 连接数据库（我使用的是Sqlsever数据库，这里需要打开数据库远程连接的权限，把这个问题解决了在执行代码测试！）

 /// 

        /// 验证用户名和密码
        /// 
        /// 
        /// 
        private int IsConnetDB(string userName, string passWord)
        {
            try
            {
                SqlConnection conn = new SqlConnection("server=服务器的ip地址;database=HandElectricity; uid=sa;pwd=123");
                conn.Open();
                string sqlcmd = "select count(*) from [HE_User] where username= '" + userName + "' and password='" + passWord + "'";
                SqlCommand cmd = new SqlCommand();
                cmd.Connection = conn;
                cmd.CommandText = sqlcmd;
                int result = Convert.ToInt32(cmd.ExecuteScalar());
                conn.Close();
                if (result == 1)
                {
                    //登录成功
                    MessageBox.Show("登录成功!");
                    //frm_Main fm = new frm_Main();
                    //Show(fm);
                }
                else
                {
                    MessageBox.Show("账号或密码错误！");
                    return 0;
                }
            }
            catch (Exception ex)
            {
                Toast(ex.Message);
            }
            return 1;
        }
        private void btnLogon_Click(object sender, EventArgs e)
        {
            try
            {
                string userName = txtUserName.Text.Trim();
                string passWord = txtPassword.Text.Trim();
                if (string.IsNullOrEmpty(userName) || string.IsNullOrEmpty(passWord))
                {
                    throw new Exception("用户名或密码不能为空！");
                }

                int result = IsConnetDB(userName, passWord);

                LoadClientData(MobileServer.ServerID + "user", userName);
                //登录成功才记住密码
                if (result == 1 && chkRememberPwd.Checked == true)
                {
                    LoadClientData(MobileServer.ServerID + "pwd", passWord);
                }

            }
            catch (Exception ex)
            {
                Toast(ex.Message);
            }
        }

（2）  使用验证码登录

如果需要真正的验证码，需要另行购买短信的API接口。

这里把发送了的手机号码保存在了一个记事本里面，按理来说这是需要加密处理的，我这里没有加密。

 private void btnVerify_Click(object sender, EventArgs e)
        {
            try
            {
                string userID = txtUserName.Text.Trim();
                if (userID.Length != 11)
                {
                    MessageBox.Show("请输入正确的手机号码！");
                }
                else
                {
                    FileStream fs;
                    if (File.Exists("./logMobile.txt"))
                    {
                        fs = new FileStream("./logMobile.txt", FileMode.Open);
                    }
                    else
                    {
                        fs = new FileStream("./logMobile.txt", FileMode.CreateNew);
                    }
                    StreamWriter sw = new StreamWriter(fs);
                    sw.WriteLine(userID);
                    fs.Close();
                    MessageBox.Show("验证码发送成功，注意接收！");
                }
               
            }

（3） 其它的按钮

都是打开其它的窗体，手机上自带返回功能和窗体覆盖功能的。

四、 运行工作

有的朋友运行的时候发现问题了，就是如何把启动项设置成frmLogin这个登录界面。右键点击查看frmMain的代码。然后请看下图，更改即可。

本文到此就结束了，如果您有问题可以评论或者邮箱[email protected]联系我哦~

下一篇文章：Smobiler实现主界面(上)——C# 或.NET Smobiler实例开发手机app（三）