Android——实现登录和注册功能
前言
自学Android有段时间了，觉得是时候尝试写一些小demo尝试一下。这次尝试写了一个登录注册功能，大概涉及以下几个知识点：使用LitePal操作数据库、颜色渐变、嵌套布局。其他的皆是比较正常的知识。话不多说，进入正题。
正文
UI界面
登录
先来说说登录界面的实现。
在布局上最外层我使用了LinearLayout，这也是我在布局中使用最多也是最熟悉的布局，所以我首选这个，比较方便，里面我嵌套了两个LinearLayout和一个RelativeLayout。算是比较简单吧，也是经过我多次尝试之后选出的最佳方案。上面有的东西就是平常大家常见的功能，头像显示，记住密码忘记密码这些东西，我还特意加了三个其他登陆方式，当然这个没有实现，知识UI上有而已，不过后续完善的时候可以实现。同样的记住密码和忘记密码功能我也没来得及实现。最近比较忙，还要上其他课。话不多说给大家放出登陆界面代码。可结合效果图进行参考。
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:background="@drawable/background_gradient">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="100dp"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp">
<ImageView
android:id="@+id/lg_userIcon"
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_centerHorizontal="true"
android:scaleType="fitCenter"
android:src="@drawable/headportrait"/>
<EditText
android:id="@+id/lg_username"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="@id/lg_userIcon"
android:layout_marginTop="30dp"
android:drawableLeft="@drawable/user"
android:theme="@style/myedittext_color"
android:drawablePadding="5dp"
android:hint="账号"
android:maxLines="1"/>
<EditText
android:id="@+id/lg_password"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="@id/lg_username"
android:layout_marginTop="10dp"
android:theme="@style/myedittext_color"
android:drawableLeft="@drawable/psd"
android:drawablePadding="5dp"
android:hint="密码"
android:maxLines="1"
android:inputType="textPassword"/>
<LinearLayout
android:id="@+id/ly"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="@id/lg_password">
<CheckBox
android:id="@+id/lg_rememberPsd"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="5"
android:text="记住密码"
android:theme="@style/cb_color"
android:textColor="#1E90FF"/>
<TextView
android:id="@+id/lg_forgetPsd"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="忘记密码"
android:textColor="#1E90FF"/>
</LinearLayout>
<Button
android:id="@+id/lg_login"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="@id/ly"
android:layout_centerHorizontal="true"
android:layout_marginTop="30dp"
android:text="登录"
android:textSize="18sp"
android:textColor="#FFFFFF"
android:background="#1E90FF "/>
</RelativeLayout>
<TextView
android:id="@+id/lg_register"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="9dp"
android:layout_gravity="right"
android:layout_marginRight="20dp"
android:text="没有账号？立即注册"
android:textColor="#1E90FF"/>
<TextView
android:id="@+id/lg_other"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="其他登录方式"
android:layout_centerHorizontal="true"
android:layout_marginTop="150dp"
android:layout_gravity="center_horizontal"/>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_marginTop="15dp">
<ImageView
android:id="@+id/lg_qq"
android:layout_width="30dp"
android:layout_height="30dp"
android:src="@drawable/qq"
android:layout_marginRight="15dp"/>
<ImageView
android:id="@+id/lg_wechat"
android:layout_width="30dp"
android:layout_height="30dp"
android:src="@drawable/wechat"/>
<ImageView
android:id="@+id/lg_weibo"
android:layout_width="30dp"
android:layout_height="30dp"
android:src="@drawable/weibo"
android:layout_marginLeft="15dp"/>
</LinearLayout>
</LinearLayout>
注册
注册界面实现和登录界面大同小异，这里就直接给出代码和效果图。
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@drawable/background_register">
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:layout_marginLeft="40dp"
android:layout_marginRight="40dp"
android:background="@color/colorWhite">
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="40dp"
android:layout_marginLeft="40dp"
android:layout_marginRight="40dp"
android:layout_marginBottom="40dp">
<EditText
android:id="@+id/re_username"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="@style/myedittext_color"
android:drawableLeft="@drawable/user"
android:drawablePadding="5dp"
android:hint="请输入账号"
android:maxLines="1"/>
<EditText
android:id="@+id/re_password"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:theme="@style/myedittext_color"
android:drawableLeft="@drawable/psd"
android:drawablePadding="5dp"
android:hint="请输入密码"
android:maxLines="1"
android:inputType="textPassword"/>
<EditText
android:id="@+id/re_affirm"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:theme="@style/myedittext_color"
android:drawableLeft="@drawable/psd"
android:drawablePadding="5dp"
android:hint="请确认密码"
android:maxLines="1"
android:inputType="textPassword"/>
<Button
android:id="@+id/re_register"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="40dp"
android:text="注册"
android:textSize="18sp"
android:textColor="@color/colorWhite"
android:background="@color/colorBlue"/>
</LinearLayout>
</LinearLayout>
</RelativeLayout>
注册功能的实现
注册功能其实非常简单，给注册按钮添加点击事件方法，在方法中获取EditText中输入的数据。然后进行两次密码的比较，如果一样则进行账号密码的存储并返回账号自动填充，然后销毁当前Activity，代码如下。
public class Register extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_register);
Button re_register = findViewById(R.id.re_register);
re_register.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
EditText username = findViewById(R.id.re_username);
EditText password = findViewById(R.id.re_password);
EditText passwordAffirm = findViewById(R.id.re_affirm);
String inputUsername = username.getText().toString();
String inputPassword = password.getText().toString();
String inputAffirm = passwordAffirm.getText().toString();
UserData user = new UserData();
if (inputAffirm.equals(inputPassword)) {
//存储账号密码
user.setUsername(inputUsername);
user.setPassword(inputPassword);
user.save();
//传回账号
Intent intent = new Intent();
intent.putExtra("username", inputUsername);
setResult(RESULT_OK, intent);
finish();
} else {
Toast.makeText(Register.this,"两次密码不一致", Toast.LENGTH_SHORT).show();
}
}
});
}
}
登录功能实现
从注册界面那里返回的账号自动进行填充，然后只需要用户填充密码即可进行登录，就不多赘述，代码如下。
public class MainActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
//创建数据库
Connector.getDatabase();
TextView register = findViewById(R.id.lg_register);
register.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
Intent intent = new Intent(MainActivity.this, Register.class);
startActivityForResult(intent, 1);
}
});
//登录
Button loginButton = findViewById(R.id.lg_login);
loginButton.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
List<UserData> users = LitePal.findAll(UserData.class);
EditText username = findViewById(R.id.lg_username);
EditText password = findViewById(R.id.lg_password);
//账号密码匹配
for (UserData user : users) {
if (user.getUsername().equals(username.getText().toString()) && user.getPassword().equals(password.getText().toString())) {
Intent intent = new Intent(MainActivity.this, HomeActivity.class);
startActivity(intent);
onDestroy();
} else {
Toast.makeText(MainActivity.this,"账号或密码错误！",Toast.LENGTH_SHORT).show();
}
}
}
});
}
@Override
protected void onDestroy() {
super.onDestroy();
}
//接受传回来的账号
@Override
protected void onActivityResult(int requestCode, int resultCode, @Nullable Intent data) {
super.onActivityResult(requestCode, resultCode, data);
switch (requestCode) {
case 1:
if (resultCode == RESULT_OK) {
final EditText loginUsername = findViewById(R.id.lg_username);
String returnUsername = data.getStringExtra("username");
loginUsername.setText(returnUsername);
loginUsername.setSelection(returnUsername.length());
}
break;
default:
}
}
}
这里之所以可以接受注册界面传回来的账号，是因为在启动实现注册功能的Activity时用到了startActivityForResult()方法，startActivityForResult()接受两个参数，第一个参数还是Intent，第二个参数是一个请求码。用于在之后的回调中判断数据的来源。由于我们使用的是startActivityForResult()方法来启动注册Activity，在销毁活动之后会回调上一个活动的onActivityResult()方法，因此需要在登录Activity中重写这个方法来得到返回的账号。
其中还使用到了其他功能，一一讲解如下。
数据库功能实现
数据库功能的使用过于繁杂，在这里详细讲解的话有点喧宾夺主，这里请参考我的另外一篇博文，博文中使用的代码就是基于本次登陆注册功能实现的。点击跳转
背景颜色渐变
在登录和注册中我都使用了渐变的背景，因为最近学到了，干脆直接拿来使用。首先在drawable下新建两个xml，一个用于登陆界面使用，一个用于注册界面使用，代码如下：
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<!-- 登录背景渐变 -->
<gradient
android:startColor="@color/colorLightcyan"
android:endColor="@color/colorAliceblue"
android:angle="270"
/>
</shape>
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<!-- 注册背景渐变 -->
<gradient
android:startColor="@color/colorBlue"
android:endColor="@color/colorDeepskyblue"
android:angle="0"
/>
</shape>
startColor为开始渐变颜色，endColor为结束渐变颜色，angle是渐变的角度。这里可以自行调试。然后就可以直接使用android:background="@drawable/background_gradient"进行添加。
所有内容都讲解完毕了，这其中有很多不足，希望各位大神看到可以指点一二。