Android登录界面的实现代码分享

最近由于项目需要,宝宝好久没搞Android啦,又是因为项目需要,现在继续弄Android,哎,说多了都是泪呀,别的不用多说,先搞一个登录界面练练手,登录界面可以说是Android项目中最常用也是最基本的,如果这个都搞不定,那可以直接去跳21世纪楼啦。

废话不多说,先上效果图了,如果大家感觉还不错,请参考实现代码吧。

相信这种渣渣布局对很多人来说太简单啦,直接上布局:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:custom="http://schemas.android.com/apk/res-auto"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:fitsSystemWindows="true" >
<RelativeLayout
android:id="@+id/login_layout"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"
android:gravity="center" >
<FrameLayout
android:id="@+id/username_layout"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginTop="55dp"
android:gravity="center" >
<!-- android:inputType="number" -->
<EditText
android:id="@+id/username"
android:layout_width="fill_parent"
android:layout_height="40dp"
android:layout_marginTop="5dp"
android:maxLength="20"
android:paddingLeft="55dp"
android:paddingRight="60dp" >
</EditText>
<ImageView
android:layout_width="22dp"
android:layout_height="21dp"
android:layout_gravity="left|center_vertical"
android:layout_marginStart="10dp"
android:background="@drawable/username"
android:visibility="visible" />
<TextView
android:id="@+id/contry_sn"
android:layout_width="40dp"
android:layout_height="50dp"
android:layout_gravity="left|center_vertical"
android:layout_marginTop="4dp"
android:gravity="center"
android:text="+62"
android:textColor="@android:color/black"
android:textSize="18sp"
android:visibility="invisible" />
<Button
android:id="@+id/bt_username_clear"
android:layout_width="35dp"
android:layout_height="35dp"
android:layout_gravity="right|center_vertical"
android:layout_marginRight="10dp"
android:background="@drawable/email_delete_pressed"
android:visibility="invisible" />
</FrameLayout>
<FrameLayout
android:id="@+id/usercode_layout"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="@id/username_layout"
android:layout_marginTop="6dp"
android:gravity="center" >
<EditText
android:id="@+id/password"
android:layout_width="fill_parent"
android:layout_height="40dp"
android:inputType="textPassword"
android:maxLength="20"
android:paddingLeft="55dp"
android:paddingRight="60dp" >
</EditText>
<ImageView
android:layout_width="18dp"
android:layout_height="21dp"
android:layout_gravity="left|center_vertical"
android:layout_marginStart="10dp"
android:background="@drawable/password" />
<Button
android:id="@+id/bt_pwd_eye"
android:layout_width="40dp"
android:layout_height="40dp"
android:layout_gravity="right|center_vertical"
android:layout_marginRight="10dp"
android:background="@drawable/password_close" />
<Button
android:id="@+id/bt_pwd_clear"
android:layout_width="35dp"
android:layout_height="35dp"
android:layout_gravity="right|center_vertical"
android:layout_marginRight="45dp"
android:background="@drawable/email_delete_pressed"
android:visibility="invisible" />
</FrameLayout>
<Button
android:id="@+id/login"
android:layout_width="fill_parent"
android:layout_height="40dp"
android:layout_below="@id/usercode_layout"
android:layout_marginTop="30dp"
android:background="@drawable/login_selector"
android:gravity="center"
android:text="登录"
android:textColor="@android:color/white" />
<Button
android:id="@+id/forgive_pwd"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignRight="@id/login"
android:layout_below="@id/login"
android:background="#00000000"
android:text="忘记密码?"
android:textColor="@drawable/text_color_selector"
android:textSize="16sp" />
<Button
android:id="@+id/register"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="@id/login"
android:layout_below="@id/login"
android:background="#00000000"
android:gravity="left|center_vertical"
android:text="注册"
android:textColor="@drawable/text_color_selector"
android:textSize="16sp"
android:visibility="visible" />
</RelativeLayout>
</RelativeLayout> 

MainActivity如下:

package com.example.logindemo;
import android.support.v7.app.ActionBarActivity;
import android.text.Editable;
import android.text.TextWatcher;
import android.text.method.HideReturnsTransformationMethod;
import android.text.method.PasswordTransformationMethod;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.Button;
import android.widget.EditText;
import android.widget.Toast;
import android.os.Bundle;
/**
* 登录界面Demo
*
* @author ZHY
*
*/
public class MainActivity extends ActionBarActivity implements OnClickListener {
private EditText username, password;
private Button bt_username_clear;
private Button bt_pwd_clear;
private Button forgive_pwd;
private Button bt_pwd_eye;
private Button login;
private Button register;
private boolean isOpen = false;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initView();
}
private void initView() {
username = (EditText) findViewById(R.id.username);
// 监听文本框内容变化
username.addTextChangedListener(new TextWatcher() {
@Override
public void onTextChanged(CharSequence s, int start, int before,
int count) {
// 获得文本框中的用户
String user = username.getText().toString().trim();
if ("".equals(user)) {
// 用户名为空,设置按钮不可见
bt_username_clear.setVisibility(View.INVISIBLE);
} else {
// 用户名不为空,设置按钮可见
bt_username_clear.setVisibility(View.VISIBLE);
}
}
@Override
public void beforeTextChanged(CharSequence s, int start, int count,
int after) {
}
@Override
public void afterTextChanged(Editable s) {
}
});
password = (EditText) findViewById(R.id.password);
// 监听文本框内容变化
password.addTextChangedListener(new TextWatcher() {
@Override
public void onTextChanged(CharSequence s, int start, int before,
int count) {
// 获得文本框中的用户
String pwd = password.getText().toString().trim();
if ("".equals(pwd)) {
// 用户名为空,设置按钮不可见
bt_pwd_clear.setVisibility(View.INVISIBLE);
} else {
// 用户名不为空,设置按钮可见
bt_pwd_clear.setVisibility(View.VISIBLE);
}
}
@Override
public void beforeTextChanged(CharSequence s, int start, int count,
int after) {
}
@Override
public void afterTextChanged(Editable s) {
}
});
bt_username_clear = (Button) findViewById(R.id.bt_username_clear);
bt_username_clear.setOnClickListener(this);
bt_pwd_clear = (Button) findViewById(R.id.bt_pwd_clear);
bt_pwd_clear.setOnClickListener(this); 

bt_pwd_eye = (Button) findViewById(R.id.bt_pwd_eye);
bt_pwd_eye.setOnClickListener(this);
login = (Button) findViewById(R.id.login);
login.setOnClickListener(this);
egister = (Button) findViewById(R.id.register);
register.setOnClickListener(this);
forgive_pwd = (Button) findViewById(R.id.forgive_pwd);
forgive_pwd.setOnClickListener(this);
}
@Override
public void onClick(View v) {
switch (v.getId()) {
case R.id.bt_username_clear:
// 清除登录名
username.setText("");
break;
case R.id.bt_pwd_clear:
// 清除密码
password.setText("");
break;
case R.id.bt_pwd_eye:
// 密码可见与不可见的切换
if (isOpen) {
isOpen = false;
} else {
isOpen = true;
}
// 默认isOpen是false,密码不可见
changePwdOpenOrClose(isOpen);
break;
case R.id.login:
// TODO 登录按钮
break;
case R.id.register:
// 注册按钮
Toast.makeText(MainActivity.this, "注册", 0).show();
break;
case R.id.forgive_pwd:
// 忘记密码按钮
Toast.makeText(MainActivity.this, "忘记密码", 0).show();
break;
default:
break;
}
}
/**
* 密码可见与不可见的切换
*
* @param flag
*/
private void changePwdOpenOrClose(boolean flag) {
// 第一次过来是false,密码不可见
if (flag) {
// 密码可见
bt_pwd_eye.setBackgroundResource(R.drawable.password_open);
// 设置EditText的密码可见
password.setTransformationMethod(HideReturnsTransformationMethod
.getInstance());
} else {
// 密码不接见
bt_pwd_eye.setBackgroundResource(R.drawable.password_close);
// 设置EditText的密码隐藏
password.setTransformationMethod(PasswordTransformationMethod
.getInstance());
}
}
} 

Ok,就是这么简单,效果完成。

以上所述是小编给大家介绍的Android登录界面的实现代码分享,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对我们网站的支持!

(0)

相关推荐

  • Android实现简洁的APP登录界面

    今天需求要做一个所有app都有的登录界面,正好巩固一下我们之前学的基础布局知识. 先来看下效果图 1.布局的xml文件 <?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent&qu

  • Android属性动画实现炫酷的登录界面

    我们聊聊我们常写的登录界面,这个界面我相信很多人都写过,而且也没什么难度,但是如果要实现比较不一般的效果,那就要花点心思了,先看看项目的效果吧: 我一直都不知道怎么在编辑框连设置图片大小,所以这个图不怎么样适配编辑框了,大家先凑合着看看. 我先讲讲思路,当我们输入完账号跟密码之后,点击登录,那这个输入框就慢慢的消失,在消失后,紧接着就出现这个进度的界面. 思路有了,那我们就开始编码了: 新建一个项目,然后系统生成了一个MainActivity.java文件和activity_main.xml文件

  • 功能强大的登录界面Android实现代码

    前言 一个好的应用需要一个有良好的用户体验的登录界面,现如今,许多应用的的登录界面都有着用户名,密码一键删除,用户名,密码为空提示,以及需要输入验证码的功能.看着csdn上的大牛们的文章,心里想着也写一个登录界面学习学习,许多东西都是参考别的文章,综合起来的.废话少说,接下来看看是如何实现的. ps:由于懒得抠图.所以程序的图标很难看. 程序运行时的图示: 首先是布局文件没有什么难度. <RelativeLayout xmlns:android="http://schemas.androi

  • Android实现QQ登录界面遇到问题及解决方法

    先给大家炫下效果图: 首先过程中碰到的几个问题: 1.对 EditText 进行自定义背景 2.运行时自动 EditText 自动获得焦点 3.在获得焦点时即清空 hint ,而不是输入后清空 4.清空按钮的出现时机(在得到焦点并且有输入内容时) ......... --- 这些问题都有一一解决 --- 以下是代码: 布局 fragment_main(问题2) <!-- android:focusable="true" android:focusableInTouchMode=&

  • Android设计登录界面、找回密码、注册功能

    本文实例为大家分享了Android 登录.找回密码.注册功能的实现代码,供大家参考,具体内容如下 1.数据库的设计 我在数据库中添加了两张表,一张表用来存储用户信息,诸如用户名,密码,手机号等,可任意添加.另一张表用来存储上一个登录用户的账户信息,我是为了方便才另外创建了一张表去存储,而且这张表我设计了它只能存储一条信息,每次的存储都是对上一条记录的覆盖.事实上,我尝试过在存储用户信息的那张表内添加一个标识,用来标记上一次登录的是哪一个帐号,但是这样做的话,每次改变标识都需要遍历整张表,十分的麻

  • Android miniTwitter登录界面开发实例

    本文要演示的Android开发实例是如何完成一个Android中的miniTwitter登录界面,下面将分步骤讲解怎样实现图中的界面效果,让大家都能轻松的做出美观的登录界面. 先贴上最终要完成的效果图: miniTwitter登录界面的布局分析 首先由界面图分析布局,基本可以分为三个部分,下面分别讲解每个部分. 第一部分是一个带渐变色背景的LinearLayout布局,关于背景渐变色就不再贴代码了,效果如下图所示: 第二部分,红色线区域内,包括1,2,3,4 如图所示: 红色的1表示的是一个带圆

  • Android实现闪屏及注册和登录界面之间的切换效果

    在没给大家介绍正文之前先给大家说下实现思路: 先分别实现闪屏.注册界面.登录界面的活动,再用Intent将相关的活动连接起来,实现不同活动之间的跳转.此次试验代码较多,我只列出主要代码,详细的代码可用底部的下载链接下载. 一.实验效果图: 二.主要代码: (1)WelcomeActivity.Java(这部分代码实现的是第一页的欢迎页面) package com.example.flashscreendemo; import android.app.Activity; import androi

  • Android SharedPreferences实现记住密码和自动登录界面

    SharedPreferences介绍: SharedPreferences是Android平台上一个轻量级的存储类,主要是保存一些常用的配置参数,它是采用xml文件存放数据的,文件存放在"/data/data<package name>/shared_prefs"目录下. SharedPreferences的用法: 由于SharedPreferences是一个接口,而且在这个接口里没有提供写入数据和读取数据的能力.但它是通过其Editor接口中的一些方法来操作Shared

  • Android开发实例之登录界面的实现

    本文要演示的Android开发实例是如何完成一个Android中的miniTwitter登录界面,下面将分步骤讲解怎样实现图中的界面效果,让大家都能轻松的做出美观的登录界面.        miniTwitter登录界面效果图 先贴上最终要完成的效果图:   miniTwitter登录界面的布局分析 首先由界面图分析布局,基本可以分为三个部分,下面分别讲解每个部分. 第一部分是一个带渐变色背景的LinearLayout布局,关于背景渐变色就不再贴代码了,效果如下图所示: 第二部分,红色线区域内,

  • Android QQ登录界面绘制代码

    先看看效果图: 首先过程中碰到的几个问题: 1.对 EditText 进行自定义背景 2.运行时自动 EditText 自动获得焦点 3.在获得焦点时即清空 hint ,而不是输入后清空 4.清空按钮的出现时机(在得到焦点并且有输入内容时) ---  这些问题都有一一解决 --- 以下是代码: 布局 fragment_main(问题2) <!-- android:focusable="true" android:focusableInTouchMode="true&qu

随机推荐