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

目录

一、 本文目标
<https://blog.csdn.net/qq_41647999/article/details/83589001#%E4%B8%80%E3%80%81%20%E6%9C%AC%E6%96%87%E7%9B%AE%E6%A0%87>

二、 准备工作
<https://blog.csdn.net/qq_41647999/article/details/83589001#%E5%87%86%E5%A4%87%E5%B7%A5%E4%BD%9C>

1、 数据库
<https://blog.csdn.net/qq_41647999/article/details/83589001#1%E3%80%81%20%E6%95%B0%E6%8D%AE%E5%BA%93>

2、 材料
<https://blog.csdn.net/qq_41647999/article/details/83589001#2%E3%80%81%20%E6%9D%90%E6%96%99>

三、 界面布局
<https://blog.csdn.net/qq_41647999/article/details/83589001#%E7%95%8C%E9%9D%A2%E5%B8%83%E5%B1%80>

1、设置控件的属性值
<https://blog.csdn.net/qq_41647999/article/details/83589001#1%E3%80%81%E8%AE%BE%E7%BD%AE%E9%A1%B5%E9%9D%A2%E8%83%8C%E6%99%AF>

（1） 输入框
<https://blog.csdn.net/qq_41647999/article/details/83589001#%EF%BC%881%EF%BC%89%20%E8%BE%93%E5%85%A5%E6%A1%86>

（2） 图片属性
<https://blog.csdn.net/qq_41647999/article/details/83589001#%EF%BC%882%EF%BC%89%20%E5%9B%BE%E7%89%87%E5%B1%9E%E6%80%A7>

（3） HandElectricity的标题的label属性
<https://blog.csdn.net/qq_41647999/article/details/83589001#%EF%BC%883%EF%BC%89%20HandElectricity%E7%9A%84%E6%A0%87%E9%A2%98%E7%9A%84label%E5%B1%9E%E6%80%A7>

（4）登录按钮
<https://blog.csdn.net/qq_41647999/article/details/83589001#%EF%BC%884%EF%BC%89%E7%99%BB%E5%BD%95%E6%8C%89%E9%92%AE>

（5）版权申明
<https://blog.csdn.net/qq_41647999/article/details/83589001#%EF%BC%885%EF%BC%89%E7%89%88%E6%9D%83%E7%94%B3%E6%98%8E>

 （6） 记住密码
<https://blog.csdn.net/qq_41647999/article/details/83589001#%C2%A0%EF%BC%886%EF%BC%89%20%E8%AE%B0%E4%BD%8F%E5%AF%86%E7%A0%81>

2、 事件代码
<https://blog.csdn.net/qq_41647999/article/details/83589001#2%E3%80%81%20%E4%BA%8B%E4%BB%B6%E4%BB%A3%E7%A0%81>

（1） 登录按钮
<https://blog.csdn.net/qq_41647999/article/details/83589001#%EF%BC%881%EF%BC%89%20%E7%99%BB%E5%BD%95%E6%8C%89%E9%92%AE>

（2）  使用验证码登录
<https://blog.csdn.net/qq_41647999/article/details/83589001#%EF%BC%882%EF%BC%89%C2%A0%20%E4%BD%BF%E7%94%A8%E9%AA%8C%E8%AF%81%E7%A0%81%E7%99%BB%E5%BD%95>

（3） 其它的按钮
<https://blog.csdn.net/qq_41647999/article/details/83589001#%EF%BC%883%EF%BC%89%20%E5%85%B6%E5%AE%83%E7%9A%84%E6%8C%89%E9%92%AE>

一、 本文目标



初级版，请看我的上一篇博文 <https://blog.csdn.net/qq_41647999/article/details/83587444>
自行补脑哦，这里就不在赘述了。

二、 准备工作

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数据库，这里需要打开数据库远程连接的权限，把这个问题解决了在执行代码测试！）
/// <summary> /// 验证用户名和密码 /// </summary> /// <param name="userName"></param>
/// <param name="passWord"></param> 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（三）
<https://blog.csdn.net/qq_41647999/article/details/83626267>

 

• « 上一篇：数据离散化 - 等宽&等频&聚类离散 - Python代码
• » 下一篇：【C语言开发】通讯录管理系统