android实现登录，Login姿势对不对？

最新推荐文章于 2024-04-03 08:45:49 发布
最新推荐文章于 2024-04-03 08:45:49 发布
阅读量3.8k 收藏 11
点赞数
分类专栏： Android Base 文章标签： android login android-登录
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/dzsw0117/article/details/51362653
版权

android最常见的UI之一，登录遍布各大APP，这么easy的东西还是要写写，主要是介绍下：密码的显示与隐藏，用户名和密码表单的网络请求和提交方式等细节问题。看一个简单的效果：
登录效果

一，乾言

界面元素，logo，用户名，密码，登录按钮，底部两个按钮，访问有loading效果。
点击登录，获取用户和密码，简单校验，发送网络请求，然后校验请求结果，有异常做响应处理。

二，xml布局，view

布局代码，有点多，直接贴出来。需要的对应改吧改吧。

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:layout_gravity="center"
    android:background="@drawable/login_bg">

    <!--main content-->
    <LinearLayout
        android:id="@+id/ll_login_body"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:layout_centerVertical="true"
        android:orientation="vertical">
        <!--logo-->
        <ImageView
            android:id="@+id/iv_logo"
            android:layout_width="150dp"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:layout_marginBottom="30dp"
            android:src="@drawable/logo_oair" />
        <!--login username-->
        <LinearLayout
            android:id="@+id/ll_login_user"
            android:layout_width="wrap_content"
            android:layout_height="50dp"
            android:background="@drawable/input_bg"
            android:layout_gravity="center"
            android:orientation="horizontal"
            android:layout_marginLeft="30dp"
            android:layout_marginRight="30dp"
            android:layout_marginTop="20dp">

            <ImageView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:layout_marginLeft="15dp"
                android:background="@drawable/icon_user" />

            <EditText
                android:id="@+id/et_username"
                android:layout_width="0dp"
                android:layout_height="40dp"
                android:layout_weight="5"
                android:layout_gravity="center"
                android:layout_marginLeft="15dp"
                android:singleLine="true"
                android:ellipsize="middle"
                android:background="@android:color/transparent"
                android:text="@string/login_username_default"
                android:editable="false"
                android:textColor="@color/white" />
            <ImageView
                android:id="@+id/iv_show_name"
                android:layout_width="50dp"
                android:layout_height="50dp"
                android:layout_gravity="center"
                android:layout_marginLeft="5dp"
                android:layout_marginRight="2dp"
                android:scaleType="center"
                android:clickable="true"
                android:src="@drawable/icon_down" />
        </LinearLayout>
        <!--login password-->
        <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="50dp"
            android:background="@drawable/input_bg"
            android:layout_gravity="center"
            android:orientation="horizontal"
            android:layout_marginLeft="30dp"
            android:layout_marginRight="30dp"
            android:layout_marginTop="15dp">

            <ImageView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:layout_marginLeft="15dp"
                android:background="@drawable/icon_pwd"
                />

            <EditText
                android:id="@+id/et_password"
                android:layout_width="0dp"
                android:layout_height="40dp"
                android:layout_weight="5"
                android:layout_gravity="center"
                android:layout_marginLeft="15dp"
                android:focusable="true"
                android:inputType="textPassword"
                android:background="@android:color/transparent"
                android:textColor="@color/white" />

            <ImageView
                android:id="@+id/iv_hidden_pwd"
                android:layout_width="50dp"
                android:layout_height="50dp"
                android:layout_gravity="center"
                android:layout_marginLeft="5dp"
                android:layout_marginRight="2dp"
                android:scaleType="center"
                android:clickable="true"
                android:src="@drawable/icon_hidden" />

        </LinearLayout>
        <!--login btn-->
        <Button
            android:id="@+id/btn_login"
            android:layout_width="wrap_content"
            android:layout_height="50dp"
            android:layout_gravity="center"
            android:layout_marginTop="40dp"
            android:text="@string/login_btn"
            android:textSize="20sp"
            android:textColor="@drawable/text_select"
            android:layout_marginLeft="30dp"
            android:layout_marginRight="30dp"
            android:background="@drawable/btn_login_bg" />

    </LinearLayout>
    <!--bottom btn-->
    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:layout_marginLeft="30dp"
        android:layout_marginRight="30dp"
        android:layout_alignParentBottom="true"
        android:layout_marginBottom="20dp"
        android:layout_below="@id/ll_login_body">

        <TextView
            android:id="@+id/tv_login_contactus"
            android:text="@string/login_about"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentLeft="true"
            android:layout_alignParentBottom="true"
            android:textSize="16sp"
            android:padding="10dp"
            android:clickable="true"
            android:textColor="#FFF" />

        <TextView
            android:id="@+id/tv_login_guest"
            android:text="@string/login_guest"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentRight="true"
            android:layout_alignParentBottom="true"
            android:textSize="16sp"
            android:padding="10dp"
            android:clickable="true"
            android:textColor="#FFF" />
    </RelativeLayout>

    <ProgressBar
        android:id="@+id/pb_login"
        style="@style/MyCircleProgressBar"
        android:layout_width="50dp"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:visibility="gone"
        android:indeterminateDuration="700"/>
</RelativeLayout>
注册view和事件

findViewById的事情就别自己一个个复制了，使用ButterKnife依赖注入view和事件，类似的框架很多。例如：

    @Bind(R.id.et_username)
    public EditText et_username;
    @Bind(R.id.et_password)
    public EditText et_password;

在onCreate方法中，注入：

 ButterKnife.bind(this);

之前犯过错误，@Bind view需要使用public修饰属性。

Error:(68, 23) 错误: @Bind fields must not be private or static. (com.oair.oair_client.LoginActivity.iv_logo)

三，activity登录逻辑

获取edittext中的value，判断用户名，密码是否为空，如果ok就进行网络请求，post后台登录接口。我用retrofit＋okhttp+RxJava/RxAndroid实现登录，json用内部封装的gson解析。

 @OnClick(R.id.btn_login)
    public void LoginOair(){
        Login();
    }
    //Login 管理员登录
    public void Login() {
        // 点击登录的时候 拿到用户名和密码的值
        username = et_username.getText().toString();
        password = et_password.getText().toString();
        //判断密码是否为空
        if (StringUtils.isEmpty(password)) {
            showDialog(context.getResources().getString(R.string.dialog_pwd_empty));
        } else {
            //验证登录是否成功
            postLogin();
        }
    }
    private void postLogin() {
        pb_login.setVisibility(View.VISIBLE);
        MyRetrofitUtils.init().loginOair(password, new Subscriber<OairResponse>() {
            @Override
            public void onCompleted() {
                pb_login.setVisibility(View.GONE);
            }
            @Override
            public void onError(Throwable e) {
                checkLocalPwd();
                LogUtils.debug(TAG,"error "+e.toString());
                pb_login.setVisibility(View.GONE);
            }
            @Override
            public void onNext(OairResponse oairResponse) {
                LogUtils.debug(TAG,oairResponse.toString());
                if (oairResponse.result == MyConstant.RESULT_SUCCESS){
                    enterMainActivity();
                }else{       showDialog(context.getResources().getString(R.string.dialog_pwd_error));
                }
            }
        });
    }

不会用？可以使用你喜欢的网络访问方式，OKHTTP，HTTPUrlConnection，xUtils，volley都行。或者请看我的另外一篇文章，点击打开：
RxJava＋Retrofit＋Gson实现网络请求

四，隐藏和显示密码

EditText控件本身就封装好了显示与隐藏的方法，可以方便地将文本置为可见，或者隐藏。

 //切换输入密码的模式，明文or密文显示
    private boolean isHidden=true;
    @OnClick(R.id.iv_hidden_pwd)
    public void hiddenPassword() {
        if (isHidden) {
            //设置EditText文本为可见的
            et_password.setTransformationMethod(HideReturnsTransformationMethod.getInstance());
        } else {
            //设置EditText文本为隐藏的
            et_password.setTransformationMethod(PasswordTransformationMethod.getInstance());
        }
        isHidden = !isHidden;
        et_password.postInvalidate();
        //切换后将EditText光标置于末尾
        CharSequence charSequence = et_password.getText();
        if (charSequence!=null) {
            Spannable spanText = (Spannable) charSequence;
            Selection.setSelection(spanText, charSequence.length());
        }
    }

五，输入法弹出，布局调整

有时候手机频幕小，弹出输入法框，可能会将edittext控件挡住，影响输入。这时候我们可以配置下activity。

 <activity
            android:name="com.xx.client.LoginActivity"
            android:configChanges="keyboardHidden|orientation"
            android:label="@string/title_activity_login"
            android:launchMode="singleTask"
            android:screenOrientation="portrait"
            android:windowSoftInputMode="adjustResize"/>

重点就是android:configChanges和android:windowSoftInputMode的属性，让activity自动调整界面，输入法位于输入框的下方。

六，总结

看似简单的一个功能，细看起来，知识点还是挺多的。这里面还有很多东西没有列出，比如用户名下拉选择一个用户登录，登录保存状态下次免登录，cookie的使用等。
未完待续，欢迎交流，杜乾，Dusan，Q 291902259。

Dusan_杜小菜
关注
专栏目录
Android入门第59天-进入MVVM
lifetragedy的专栏
01-22 1750
MVVM并不存在，只是xml里找控件找了太多了，自然而然就“找”出了一套共性。从今天开始我们Android教程经历了一次里程碑，你其实已经可以开发东西了，自己照着微博留言做一个小论坛、小商城，前面我们学习到的这些知识足够用了。但是，如果你想去正规化团队、好点的团队、公司工作肯定不能这么“作坊”，那么后面我们就会集中火力讲在jetpack即MVVM模式下的各种开发了
整理 酷炫 Android 开源UI框架 其他
TS的博客
06-15 2916
1.OriSim3D-Android opengl 实现了各种折纸效果，模拟了从一张纸折叠成一条船的整个过程 项目地址： https://github.com/RemiKoutcherawy/OriSim3D-Android 项目Demo：OriSim3D-Android 2.Matisse Matisse是知乎开源的一个本地选择照片和视频的库，UI设计得非常精美。有如特性： 可以在Fragment/Activity 中使用 选择照片的格式包括：PNG、JPEG 、GIF.视频格式包括：MPEG, MP
androidlogin:一个简单的android应用程序，允许注册和登录。 它利用php和mysql数据库以及laravel php框架开发的json网络服务
05-20
androidlogin
Android入门之login设计
http://kingim.cn/
09-03 1649
效果图： MainActivity.java package jk.quickpay.login; import jk.quickpay.login.FileService; import java.util.Map; import android.app.Activity; import android.os.Bundle; import android.text.TextUtil
android layout login,Android——Login用户登陆的设计实现
weixin_42350544的博客
05-27 679
我们生活中会遇到各种各样的登录界面，需要输入你的账号和密码，像登陆QQ呀，各种软件都需要这种设计，那我们今天来实现一下吧~~首先，界面的设计如下：可以看出，我们需要两个可编辑文本框，用来输入用户名和密码，同时，我们要提示出要输入的类型，用hint来提示；我们需要一个checkbox来判断我们是否选择保存密码，还需要一个登陆button；由于整个线性布局是垂直的，因此两个可编辑文本框，一个check...
android login
qq 117791303
07-09 611
package com.example.jsonandroid; import java.io.IOException; import org.apache.http.HttpEntity; import org.apache.http.HttpResponse; import org.apache.http.client.ClientProtocolException; import org
android 登录页面布局,Android开发登陆界面布局
weixin_36476970的博客
05-26 1294
如果上图所示，就是简单的登录界面了。andord的布局真的是，真的是，哪个。难以掌握的东西，哈，不过一旦了解深入点，又让人爽的不行，流式布局总是比起windows mobile的绝对布局简单而且容易控制。我是越来越倾向于流式布局的方式了，它的一点好处是适应设备时比较灵巧，wm使用了自适应dpi的方式，哪叫一个复杂啊，切不易于控制。布局的属性 android:layout_width="fill_p...
Android基于JsBridge封装的高效带加载进度的WebView
热门推荐
Tamic （大白）
09-01 1万+
Tamic http://blog.csdn.net/sk719887916/article/details/52402470 概述从去年4月项目就一直用起了JsBridge,前面也针对jsBridge使用姿势介绍过一篇入门篇，《Android JsBridge实战 打造专属你的Hybrid APP》，本篇接着继续深入，通过再次优化封装，大大优化了部分代码，简化上层调用流程，快速部署你的Hyb
Android框架源码分析——以Arouter为例谈谈学习开源框架的最佳姿势
浅谈Android
01-03 1845
得意于众多项目和第三方库的开源，开发中使用几行代码即可实现复杂的功能，但使用只是源码库的搬运工，源码中真正牛逼的技术并不属于我们，所以对源码和开源库的学习成了Android开发者提升技能的必经之路，笔者也曾经认真学习了常用开源框架的原理和实现，足以在开发和面试中的问题，就此以为掌握了源码（有没有同道？），直到有一天自己去编写库，当面对框架设计、任务调度、任务并发、线程切换、缓存、文件等系列问题时，...
Android进阶知识树——必须会的组件化技术
浅谈Android
08-27 475
1、概述 笔者从事智能家具行业的开发工作，也是从公司创业团队工作到现在，对于公司的项目从1.0版本开始接手一直到现在，虽说项目不是很大但麻雀虽小五脏俱全，在项目和团队的不断扩大、暴露出的问题也不段增多，组件化势在必行，本文就根据整个项目的发展，总结下组件化的实践流程； 在最初的1.0版本中只是针对一个智能设备的操控和数据交互，项目本身就很简单此时也基本单人开发，所以所有的功能代码都直接在app中...
AndroidLoginDemo
05-04
用于Android端的登录界面，添加了登录效果，可以下载试试，萌萌哒的登录界面，你值得拥有
android login example
01-30
android login example android login example android login exampleandroid login example
Android代码-LoginUI-Android
08-06
LoginUI-Android Login User Interface in android with innovative, beautiful and creative background
安卓登陆界面ui源码 android studio
10-15
安卓清新简约登陆界面源码 （圆角处理）android studio版本2.2.2
Android登录界面的实现
文明的小流氓的博客
11-03 1万+
最近由于项目需要，宝宝好久没搞Android啦，又是因为项目需要，现在继续弄Android，哎，说多了都是泪呀，别的不用多说，先搞一个登录界面练练手，登录界面可以说是Android项目中最常用也是最基本的，如果这个都搞不定，那可以直接去跳21世纪楼啦。废话不多说，先上效果图
Android Studio制作简单登录界面
最新发布
m0_62409036的博客
04-03 7016
应用线性布局设计登录界面，要求点击输入学号时弹出数字键盘界面，点击输入密码时弹出字母键盘，出现的文字、数字、尺寸等全部在values文件夹下相应.xml文件中设置好，使用时直接引用。当用户名或密码为空，显示一个提示信息“用户名与密码不能为空！”，当用户名和密码匹配，显示“登录成功”。
android布局实践（二）login界面
乌龟赛跑
02-25 750
1、主界面login.xml <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"     android:layout_width="match_parent"     android:layout_height="match_parent"     android:background=
用android登录界面,Android 用户登录界面
weixin_39874809的博客
06-02 207
【实例简介】Android 用户登录界面UI界面 Demo【实例截图】【核心代码】LoginLayout└── LoginLayout├── AndroidManifest.xml├── bin│ ├── AndroidManifest.xml│ ├── classes│ │ └── com│ │ └── example│ │ └── log...
Android实现简单的登陆页面（最新版2023详细图文教程
Alphamilk的博客
04-23 1万+
表示控件的宽度会根据其内部内容的宽度自适应调整，即控件的宽度由其内部的内容而定。则会让控件的宽度自适应其内部的内容宽度。同时，也可以通过设置具体的数值来控制控件的宽度，如。android:layout_gravity="center" --设置标签位置。android:textAlignment="center"--文字排列 居中。表示控件的宽度与其父容器的宽度相同，充满整个父容器；android:id="@+id/"--设置id。设置背景，可填入需要颜色的16进制。会让控件的宽度填充满父容器，而。
Android SharedPreferences：实现密码记忆与自动登录详解
在Android开发中，实现记住密码和自动登录功能通常依赖于SharedPreferences，这是一种轻量级的存储机制，特别适合存储简单的用户配置信息。SharedPreferences主要通过XML文件存储数据，这些文件存放在应用的内部存储...
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值