Android+JavaEE實現登錄註冊(2)——Android登錄界面設計

Android登錄界面設計

利用XML文件實現對Android佈局的編寫,然後將XMl文件與java類綁定,通過java類來對XML登錄限制的一些實現,真正的登錄功能,在後面的文章中將會提到。





知識點

01

利用XML文件佈局Android登錄操作:

第一步:新建XML文件

在Android studio的左邊欄中左上角選中android視圖,這裏就是寫Android的目錄樹:

QQ截圖20180304123041.jpg

我們找到app->res->layout這個目錄下,這裏是你所有的活動界面存放的地方。然後我們右鍵單擊layout->New->XML->Layout XML File,點擊之後就會出現新建窗口,我們取名爲activity_login.xml,點擊Finish,這樣我們的登錄佈局XML文件就新建好了。

第二步:編寫XML文件

新建完XML文件我們就開始寫佈局了。

在這裏面我們採用ScrollView佈局,它繼承自FrameLayout,它可以使用用戶滾動顯示一個佔據的空間大於物理顯示的視圖列表,但是要注意,ScrollView只能包含一個自視圖和視圖組,在項目中一般包含一個垂直的LinearLayout。

在新建的XML文件中修改代碼:QQ截圖20180304131024.jpg

然後在這裏面寫一個LinearLayout,在裏面寫佈局,我們直接上代碼;

QQ截圖20180304175637.jpg

這是LinearLayout的佈局代碼;

QQ截圖20180304175643.jpg

在LinearLayout裏面寫一個ImageView用來放我們的圖標,這裏各位自行放置圖標

QQ截圖20180304175649.jpg

這是賬號輸入文件,這裏用到的TextInputLayout是用到了一個庫;各位在build.gradle(app)中的dependencies中加入這麼一句話

implementation 'com.android.support:appcompat-v7:26.0.0'

implementation 'com.android.support:design:26.0.0'

QQ截圖20180304175656.jpg

這裏用同樣的方法實現密碼輸入;

QQ截圖20180304175709.jpg

剩下的是一個跳轉按鈕和轉入註冊界面的一段文字;

到現在,我們的登錄界面XML代碼寫完。

知識點

02

JAVA實現XML佈局功能:

第一步:新建Java類

在app->java->自己的包名,然後鼠標右鍵新建,右鍵->New->java Class,然後輸入類名就好了,這裏我起名爲LoginActivity

第二步:編寫Java類實現功能

首先我們讓類繼承自AppCompatActivity這個父類,記得導包,或按住鍵盤Alt+enter添加包,

我們定義幾個變量:

QQ截圖20180304194829.jpg

@BindVoew註解的作用相當於findviewbyid這個函數功能,將變量與XML中的佈局相關聯;

QQ截圖20180304195154.jpg

登錄函數。

QQ截圖20180304195356.jpg

判斷控件中輸入的是否合法,思路就是獲取到控件中的字符串然後進行判斷,如果合法返回true否則返回false;

QQ截圖20180304195731.jpg

登錄成功函數;至此基本函數寫完;

QQ截圖20180304200004.jpg

這是兩個控件的點擊函數,overridePendingTransition是activity的界面轉換動畫,裏面的參數是兩個界面轉換的動畫XML

這裏就不粘出來了~

到現在爲止,我們的java類關於界面功能就實現了,出了網絡連接部分我們都實現了,界面效果是這樣的QQ截圖20180302210747.jpg

至於顏色問題是自己的style風格的問題啦~

知識點

03

利用okHttp庫進行登錄功能客戶端實現:

第一步:加載OkHttp庫

在build.gradle(app)的dependencies中加入

QQ截圖20180304200431.jpg

大家也可以去他們的官網查看最新的版本;

第二步:編寫OkHttp函數

之前大家看java類中是不是有一個connection函數我們沒有實現,現在我們實現一下~

QQ截圖20180304200751.jpg

我們來看一下他們的基本步驟,其餘的大家可以自由發揮,我用哈希數組來存的數據,然後工具類去分解的數據,大家可以隨意;

第一步:實例化OkHttpClient類;

OkHttpClient okHttpClient = new OkHttpClient();

第二步:實例化FormBody.Builder builder = new FormBody.Builder();

然後用builder.add()的方式去實現數據的加載,前面是key,後面是value

第三步:將數據裝載進request中

RequestBody requestBody = builder.build();
final Request request = new Request.Builder().url(getString(R.string.urla1001)).post(requestBody).build();

第四步:設置回調函數:

final Request request = new Request.Builder().url(getString(R.string.urla1001)).post(requestBody).build();
Call call = okHttpClient.newCall(request);
call.enqueue(new Callback() {
    @Override

   public void onFailure(Call call, IOException e) {

這裏是回調失敗的地方

}
@Override

public void onResponse(Call call, Response response) throws IOException {

這裏回調成功

    }

});

這裏相當於一個異步的傳輸,如果用Android原生的話就要開一個線程去寫,這樣相對複雜。對新手不友好。

第五步:在回調的地方我們設置一個Handler去接收消息然後修改界面:

String reslut = response.body().string();
Message message = new Message();
message.obj = reslut;
handler.sendMessage(message);

第六步:Handler的編寫:

private Handler handler = new Handler()
{
    public void handleMessage(Message msg)
    {
        String obj = (String)msg.obj;
        PicUri = ArrayTools.StringToArray(obj)[2];
        Uesrid = ArrayTools.StringToArray(obj)[1];
        if(ArrayTools.StringToArray(obj)[0].equals("1"))
        {
            new android.os.Handler().postDelayed(
                    new Runnable() {
                        public void run() {
                            saveUserName();
                            onLoginSuccess();
                           progressDialog.dismiss();
                        }
                    }, 1000);
        }
        else if(ArrayTools.StringToArray(obj)[0].equals("0"))
        {
            progressDialog.dismiss();
            Toast.makeText(getBaseContext(), "用戶名或密碼錯誤", Toast.LENGTH_LONG).show();
            _loginButton.setEnabled(true);
        }
        else
        {
            progressDialog.dismiss();
            Toast.makeText(getBaseContext(), "網絡故障", Toast.LENGTH_LONG).show();
        }
    }
};

至於if語句裏面要寫什麼取決於你的服務器傳回的什麼數據;

現在我們的okhttp數據上傳我們也寫完了;

第三步:測試客戶端上傳功能是否實現

至於我們如何測試數據;我們在開發網絡程序的時候要學會抓包,但是抓包有很多軟件實現起來太複雜,所以!在這裏給大家安利一個app,實現抓取我們的app的數據包!

公衆號回覆抓包即可獲取!!

看看我抓取到的數據:

Screenshot_2018-03-04-20-35-09.png

看到那個username和password沒有!!我們成功了!!當然我的密碼是經過md5加密的!


到現在爲止我們的登錄客戶端寫完!

qrcode_for_gh_90501824918a_258 (2).jpg微信公衆號,求關注!


發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章