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 = "00000";
                m.Msg = "Success";
            }
            else
            {
                m.Code = "00001";
                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 == 1 ? 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 == "00000")
                       {
                           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