Xamarin.Android再体验之简单的登录Demo

一、前言

在空闲之余，学学新东西

二、服务端的代码编写与部署

这里采取的方式是MVC+EF返回Json数据，(本来是想用Nancy来实现的，想想电脑太卡就不开多个虚拟机了，用用IIS部署也好)

主要是接受客户端的登陆请求，服务器端返回请求的结果

这里的内容比较简单不在啰嗦，直接上代码了：

 using System.Linq;
 using System.Web.Mvc;
 namespace Catcher.AndroidDemo.EasyLogOn.Service.Controllers
 {
     public class UserController : Controller
     {
         public ActionResult LogOn(string userName, string userPwd)
         {
             bool result = IsAuth(userName,userPwd);
             ReturnModel m = new ReturnModel();
             if (result)
             {
                 m.Code = "";
                 m.Msg = "Success";
             }
             else
             {
                 m.Code = "";
                 m.Msg = "Failure";
             }
             return Json(m, JsonRequestBehavior.AllowGet);
         }
         public bool IsAuth(string name, string pwd)
         {
             using (Models.DBDemo db = new Models.DBDemo())
             {
                 int count = db.UserInfo.Count(u=>u.UserName==name&&u.UPassword==pwd);
                 return count ==  ? true : false;
             }
         }
     }
     public class ReturnModel
     {
         public string Code { get; set; }
         public string Msg { get; set; }
     }
 }  

发布，测试一下是否可行

OK

三、客户端(Android)的编码实现

既然是登录，肯定有两个文本框和一个登陆按钮啦~

登录之后又要有什么呢，显示一下欢迎就够了，放一个TextView

下面就来布局一下(左边是Main.axml，右边是User.axml)

      

具体的布局代码如下：

Main.axml

 <?xml version="1.0" encoding="utf-8"?>
 <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
     android:orientation="vertical"
     android:layout_width="fill_parent"
     android:layout_height="fill_parent">
     <LinearLayout
         android:orientation="horizontal"
         android:minWidth="25px"
         android:minHeight="80px"
         android:layout_marginTop="20dp"
         android:layout_width="match_parent"
         android:layout_height="wrap_content"
         android:id="@+id/linearLayoutForName">
         <TextView
             android:text="姓名："
             android:layout_width="81.5dp"
             android:layout_height="match_parent"
             android:id="@+id/textViewName"
             android:textAllCaps="true"
             android:textSize="25dp"
             android:textStyle="bold"
             android:gravity="center" />
         <EditText
             android:layout_width="291.0dp"
             android:layout_height="match_parent"
             android:id="@+id/txtName" />
     </LinearLayout>
     <LinearLayout
         android:orientation="horizontal"
         android:minWidth="25px"
         android:minHeight="80px"
         android:layout_width="match_parent"
         android:layout_height="wrap_content"
         android:layout_below="@id/linearLayoutForName"
         android:layout_marginTop="20dp"
         android:id="@+id/linearLayoutForPwd">
         <TextView
             android:text="密码："
             android:layout_width="81.5dp"
             android:layout_height="match_parent"
             android:id="@+id/textViewPwd"
             android:textAllCaps="true"
             android:textSize="25dp"
             android:textStyle="bold"
             android:gravity="center" />
         <EditText
             android:layout_width="291.0dp"
             android:layout_height="match_parent"
             android:id="@+id/txtPwd"
             android:inputType="textPassword" />
     </LinearLayout>
     <Button
         android:text="登录"
         android:layout_width="match_parent"
         android:layout_height="wrap_content"
         android:layout_marginTop="20dp"
         android:layout_below="@id/linearLayoutForPwd"
         android:id="@+id/btnLogin"
         android:textAllCaps="true"
         android:textSize="25dp"
         android:textStyle="bold"
         android:gravity="center" />
 </RelativeLayout>  

User.axml

 <?xml version="1.0" encoding="utf-8"?>
 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
     android:orientation="vertical"
     android:layout_width="match_parent"
     android:layout_height="match_parent"
     android:minWidth="25px"
     android:minHeight="25px">
     <TextView
         android:text="Text"
         android:layout_width="match_parent"
         android:layout_height="wrap_content"
         android:id="@+id/tvInfo"
         android:minHeight="60dp"
         android:gravity="center"
         android:textSize="20dp" />
 </LinearLayout>  

主要是是相对布局与线性布局的结合

布局好了，就该编写实现代码了！！

MainActivity.cs

主要就是接收用户的输入，进行判断和校验，通过的就跳转到下一页面。这里面还用到了一点网络请求。

因为是演示，所以是一大堆代码。。。

里面有用到json的解析，用的是Newtonsoft.Joson，当然，写法不规范，不要吐槽。

 using Android.App;
 using Android.Content;
 using Android.OS;
 using Android.Widget;
 using Newtonsoft.Json;
 using System;
 using System.IO;
 using System.Net;
 namespace Catcher.AndroidDemo.EasyLogOn
 {
     [Activity(Label = "简单的登录Demo", MainLauncher = true, Icon = "@drawable/icon")]
     public class MainActivity : Activity
     {
         protected override void OnCreate(Bundle bundle)
         {
             base.OnCreate(bundle);
             // Set our view from the "main" layout resource
             SetContentView(Resource.Layout.Main);
             EditText myName = FindViewById<EditText>(Resource.Id.txtName);
             EditText myPwd = FindViewById<EditText>(Resource.Id.txtPwd);
             Button login = FindViewById<Button>(Resource.Id.btnLogin);
             login.Click += delegate
            {
                string name = myName.Text;
                string pwd = myPwd.Text;
                if (string.IsNullOrEmpty(name) || string.IsNullOrEmpty(pwd))
                {
                    Toast.MakeText(this, "请输入用户名和密码！！", ToastLength.Long).Show();
                    return;
                }
                else
                {
                    string loginUrl = string.Format("http://192.168.1.102:8077/User/LogOn?userName={0}&userPwd={1}", name, pwd);
                    var httpReq = (HttpWebRequest)HttpWebRequest.Create(new Uri(loginUrl));
                    var httpRes = (HttpWebResponse)httpReq.GetResponse();
                    if (httpRes.StatusCode == HttpStatusCode.OK)
                    {
                        string result = new StreamReader(httpRes.GetResponseStream()).ReadToEnd();
                        result = result.Replace("\"", "'");
                        ReturnModel s = JsonConvert.DeserializeObject<ReturnModel>(result);
                        if (s.Code == "")
                        {
                            var intent = new Intent(this, typeof(UserActivity));
                            intent.PutExtra("name", name);
                            StartActivity(intent);
                        }
                        else
                        {
                            Toast.MakeText(this, "用户名或密码不正确！！", ToastLength.Long).Show();
                            return;
                        }
                    }
                }
            };
         }
     }
     public class ReturnModel
     {
         public string Code { get; set; }
         public string Msg { get; set; }
     }
 }

下面就是跳转之后的页面了，就是从MainActivity传过来的用户名显示在TextView那里。

 using Android.App;
 using Android.Content;
 using Android.OS;
 using Android.Widget;
 namespace Catcher.AndroidDemo.EasyLogOn
 {
     [Activity(Label = "用户首页")]
     public class UserActivity : Activity
     {
         protected override void OnCreate(Bundle savedInstanceState)
         {
             base.OnCreate(savedInstanceState);
             // Create your application here
             SetContentView(Resource.Layout.User);
             TextView info = FindViewById<TextView>(Resource.Id.tvInfo);
             string name = Intent.GetStringExtra("name");
             info.Text = name + "欢迎您的到来！" ;
         }
     }
 }  

然后就OK了，是不是也很Easy呢。

下面来看看效果

什么都不输入的时候，输入错误的时候，输入正确的时候

         

如果想生成apk文件的话，需要将模式调整为Release模式！！！

四、总结对比

跟原生的Android开发(Java)相比，有很多相似的地方也有很多细节区别，适应就好。

做这个Demo的时候，编写界面的时候貌似没发现有智能提示，不知道有没有处理的好办法！

需要注意的是，这个Demo在数据的传输过程中并没有进行加解密的处理，这是不可取的！

其他的话，就两个字的感觉，方便。

最后附上这个Demo的代码：

https://github.com/hwqdt/Demos/tree/master/src/Catcher.AndroidDemo