chatgpt 设计用户注册界面 基于eclipse的android项目实战—博学谷（二）注册界面

本项目是用软件编写，经过我的亲自实践，其真实有效，希望能给您有所帮助

项目版本：.1.1

AVD建议：.4.2及以上

源码资源下载链接：

图片资源下载（免费）：

注册页面主要用于输入注册信息，在注册页面中用户需要输入用户名、密码、再次输入密码（确保密码输入无误），当点击“注册”按钮时进行注册。

效果图：

1.标题栏.xml

在res/文件夹中，创建一个.xml文件，采用布局。

代码如下：.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/title_bar"
    android:layout_width="match_parent"
    android:layout_height="50dp" 
    android:background="@android:color/transparent">
    
    <TextView
        android:id="@+id/tv_back"
        android:background="@drawable/go_back_selector"
        android:layout_width="50dp"
        android:layout_height="50dp"
        android:layout_alignParentLeft="true"/>
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/tv_main_title"
        android:textColor="@android:color/white"
        android:textSize="20sp"
        android:text="@string/boxuegu"
        android:layout_centerInParent="true"/>
</RelativeLayout>

2.创建背景选择器

（1）返回按钮背景选择器

将图片.png、.png导入文件夹中。

在文件夹中，右击并选择“New”–“other”–“”–“ XML File”，创建一个背景选择器.xml，根据按钮按下和弹起的状态来切换它的背景图片，由此实现动态效果。

具体代码如下：.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
    
    <item android:state_pressed="true" android:drawable="@drawable/iv_back_selected">
    </item>
    <item android:drawable="@drawable/iv_back"></item>
</selector>

（2）注册按钮背景选择器

将图片ed.png、.png导入文件夹中。

在文件夹中，右击并选择“New”–“other”–“”–“ XML File”，创建一个背景选择器.xml。具体代码如下：

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
    
    <item android:state_pressed="true" android:drawable="@drawable/register_inco_selected">
    </item>
    <item android:drawable="@drawable/register_icon_normal"></item>
</selector>

3.注册界面的布局文件

（1）导入图片

将注册界面所需图片.png、.png、.png、.png导入res/文件夹中

（2）创建注册界面的布局文件.xml。在res/文件夹中，右击并选择“New”–“other”–“”–“ XML File”。

具体代码如下：.xml

<?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:id="@+id/activity_register"
    android:background="@drawable/register_bg"
    android:orientation="vertical" >
    
    <include layout="@layout/main_title_bar" />
    
    <ImageView
        android:layout_marginTop="25dp"
        android:layout_gravity="center_horizontal"
        android:src="@drawable/default_icon"
        android:contentDescription="@null"
        android:layout_width="70dp"
        android:layout_height="70dp" />
    <EditText
        android:singleLine="true"
        android:id="@+id/et_user_name"
        android:layout_width="fill_parent"
        android:layout_height="48dp"
        android:background="@drawable/register_psw"
        android:layout_marginTop="35dp"
        android:layout_marginLeft="35dp"
        android:layout_marginRight="35dp"
        android:drawableLeft="@drawable/user_name_icon"
        android:paddingLeft="8dp"
        android:drawablePadding="10dp"
        android:hint="@string/name"
        android:gravity="center_vertical"
        android:textColorHint="#a3a3a3"
        android:textColor="#000000"
        android:textSize="14sp"/>
    <EditText
        android:singleLine="true"
        android:id="@+id/et_pwd"
        android:layout_width="fill_parent"
        android:layout_height="48dp"
        android:background="@drawable/register_psw"
        android:layout_marginLeft="35dp"
        android:layout_marginRight="35dp"
        android:drawableLeft="@drawable/psw_icon"
        android:paddingLeft="8dp"
        android:inputType="textPassword"
        android:drawablePadding="10dp"
        android:hint="@string/pwd"
        android:gravity="center_vertical"
        android:textColorHint="#a3a3a3"
        android:textColor="#000000"
        android:textSize="14sp"/>
    <EditText
        android:singleLine="true"
        android:id="@+id/et_pwd_again"
        android:layout_width="fill_parent"
        android:layout_height="48dp"
        android:background="@drawable/register_psw"
        android:layout_marginLeft="35dp"
        android:layout_marginRight="35dp"
        android:drawableLeft="@drawable/psw_icon"
        android:paddingLeft="8dp"
        android:drawablePadding="10dp"
        android:inputType="textPassword"
        android:hint="@string/pwd_again"
        android:gravity="center_vertical"
        android:textColorHint="#a3a3a3"
        android:textColor="#000000"
        android:textSize="14sp"/>
    <Button
        android:text="@string/btn_register"
        android:id="@+id/btn_register"
        android:layout_gravity="center_horizontal"
        android:layout_marginTop="15dp"
        android:layout_marginLeft="35dp"
        android:layout_marginRight="35dp"
        android:textColor="@android:color/white"
        android:textSize="20sp"
        android:textStyle="bold"
        android:layout_width="fill_parent"
        android:layout_height="50dp"
        android:background="@drawable/register_selector"/>
</LinearLayout>

文本信息在文件夹下的.xml文件里面：

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <string name="app_name">BoXueGu</string>
    <string name="hello_world">Hello world!</string>
    <string name="boxuegu">博学谷</string>
    <string name="name">请输入用户名</string>
    <string name="pwd">请输入密码</string>
    <string name="pwd_again">请再次输入密码</string>
    <string name="btn_register">注册</string>
    
</resources>

4.MD5加密算法

创建类：在src文件夹中，右击并选择“New”–“class”，创建.java文件，包名填china.ynyx..utils

MD5加密算法的具体代码如下：.java

package china.ynyx.heyunhui.utils;
import java.security.MessageDigest;
import java.security.NoSuchAlgorithmException;
public class MD5Utils {
	 /**
     * md5加密的算法
     * @param text
     * @return
     */
	public static String MD5(String text){
		try {
            MessageDigest digest = MessageDigest.getInstance("md5");
            byte[] result = digest.digest(text.getBytes());
            StringBuffer sb=new StringBuffer();
            for (byte b:result){
                int number =b & 0xff;
                String hex=Integer.toHexString(number);
                if (hex.length()==1){//如果0xff为一个字节
                    sb.append("0"+hex);
                }else {
                    sb.append(hex);
                }
            }
            return sb.toString();
        } catch (NoSuchAlgorithmException e) {
            e.printStackTrace();
            return "";//如果发生异常
        }
	}
}

5.注册界面逻辑代码

新建类：在Java包china.ynyx..中，右击并选择“New”→“class”，创建.java文件

具体代码如下：.java

package china.ynyx.heyunhui.activity;
import android.support.v7.app.AppCompatActivity;
import android.content.Intent;
import android.content.SharedPreferences;
import android.graphics.Color;
import android.os.Bundle;
import android.text.TextUtils;
import android.view.View;
import android.widget.Button;
import android.widget.EditText;
import android.widget.RelativeLayout;
import android.widget.TextView;
import android.widget.Toast;
import china.ynyx.heyunhui.R;
import china.ynyx.heyunhui.utils.MD5Utils;
import china.ynyx.heyunhui.activity.RegisterActivity;
public class RegisterActivity extends AppCompatActivity {
	private TextView tv_main_title;//标题
    private TextView tv_back;		//返回按钮
    private RelativeLayout rl_title_bar;//标题布局
    private Button btn_register;	//注册按钮
    private EditText et_user_name,et_pwd,et_pwd_again;//用户名、密码、再次输入的密码的控件
    private String username,pwd,pwd_again;//用户名、密码、再次输入的密码的控件的获取值
    
    @Override
    protected void onCreate(Bundle savedInstanceState) {
    	// TODO Auto-generated method stub
    	super.onCreate(savedInstanceState);
    	setContentView(R.layout.activity_register);
        init();
    }
	private void init() {
		// TODO Auto-generated method stub
		//从main_title_bar.xml页面布局中获取对应的UI控件
        //抽取成员变量ctrl+alt+F
        tv_main_title = (TextView) findViewById(R.id.tv_main_title);
        tv_main_title.setText("注册");
        tv_back = ((TextView) findViewById(R.id.tv_back));
        rl_title_bar = (RelativeLayout) findViewById(R.id.title_bar);
        rl_title_bar.setBackgroundColor(Color.TRANSPARENT);
        //从activity_register.xml页面布局中获取对应的UI控件
        btn_register = (Button) findViewById(R.id.btn_register);
        et_user_name = (EditText) findViewById(R.id.et_user_name);
        et_pwd = (EditText) findViewById(R.id.et_pwd);
        et_pwd_again = (EditText) findViewById(R.id.et_pwd_again);
        tv_back.setOnClickListener(new View.OnClickListener() {
            @Override//关闭页面的点击事件
            public void onClick(View view) {//设置按钮可以关闭当前页面
                RegisterActivity.this.finish();
            }
        });
        //注册按钮点击事件
        btn_register.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                //点击后获取输入在响应控件中的字符串
                getEditstring();
                //判断字符串是否为空
                if(TextUtils.isEmpty(username)){
                    Toast.makeText(RegisterActivity.this, "请输入用户名", Toast.LENGTH_SHORT).show();
                    return;
                }else if (TextUtils.isEmpty(pwd)){
                    Toast.makeText(RegisterActivity.this, "请输入密码", Toast.LENGTH_SHORT).show();
                    return;
                }else if (TextUtils.isEmpty(pwd_again)){
                    Toast.makeText(RegisterActivity.this, "请再次输入密码", Toast.LENGTH_SHORT).show();
                    return;
                }else if (!pwd.equals(pwd_again)){
                    Toast.makeText(RegisterActivity.this, "两次输入的密码不一样", Toast.LENGTH_SHORT).show();
                    return;
                } else if (isExistUserName(username)){
                    Toast.makeText(RegisterActivity.this, "此用户已经存在", Toast.LENGTH_SHORT).show();
                    return;
                }else {
                    Toast.makeText(RegisterActivity.this, "注册成功", Toast.LENGTH_SHORT).show();
                    //把用户名和密码保存到SharedPreferences里面
                    saveRegisterInfo(username,pwd);
                    //注册成功后通过Intent把用户名传递到LoginActivity.java中
                    Intent data=new Intent();
                    data.putExtra("username",username);
                    setResult(RESULT_OK,data);//setResult为OK，关闭当前页面
                    RegisterActivity.this.finish();//在登录的时候，如果用户还没有注册则注册。注册成功后把注册成功后的用户名返回给前一个页面
                    }
            }
        });
    }
    private void saveRegisterInfo(String username, String pwd) {
        String md5Pwd= MD5Utils.MD5(pwd);//把密码用MD5加密
        //loginInfo是sp的文件名
        SharedPreferences sp=getSharedPreferences("loginInfo",MODE_PRIVATE);//通过getSharedPreferences传入loginInfo注册登录相关的信息
        SharedPreferences.Editor editor = sp.edit();//通过sp.edit()获取到sp的编辑器对象
        //username作为key，密码作为value
        editor.putString(username,md5Pwd);
        editor.commit();//提交修改
    }
    /**
     	* 从SharedPreferences中读取输入的用户名，判断SharedPreferences中是否有用户名
     */
    private boolean isExistUserName(String username) {
        boolean has_userName=false;//表示是否有用户名
        SharedPreferences sp=getSharedPreferences("loginInfo",MODE_PRIVATE);
        String spPwd = sp.getString(username,""); //通过sp.getString传值用户名获取到密码
        if (!TextUtils.isEmpty(spPwd)){ //判断这个密码是否为空
            has_userName=true;//该用户是否保存了这一个密码
        }
        return has_userName;
    }
    /**
               * 获取控件中的字符串
     */
    private void getEditstring() {
        username=et_user_name.getText().toString().trim();
        pwd = et_pwd.getText().toString();
        pwd_again = et_pwd_again.getText().toString().trim();
	}
}

6.清单文件.xml中注册

<activity android:name="china.ynyx.heyunhui.activity.RegisterActivity"></activity>

7.完善功能

欢迎界面跳转到注册界面：在欢迎界面.java文件中修改跳转代码

Intent intent=new Intent(SplashActivity.this,MainActivity.class);

改为

Intent intent=new Intent(SplashActivity.this,RegisterActivity.class);

参考资料：《项目实战——博学谷》（黑马程序员著）

基于的项目实战—博学谷（一）欢迎界面

基于的项目实战—博学谷（二）注册界面

基于的项目实战—博学谷（三）登录界面

基于的项目实战—博学谷（四）底部导航栏

基于的项目实战—博学谷（五）“我”的模块

基于的项目实战—博学谷（六）设置界面

基于的项目实战—博学谷（七）修改密码

基于的项目实战—博学谷（八）设置密保和找回密码

基于的项目实战—博学谷（九）个人资料界面

基于的项目实战—博学谷（十）个人资料修改

基于的项目实战—博学谷（十 一）习题界面

基于的项目实战—博学谷（十 二）习题详情界面

基于的项目实战—博学谷（十 三）水平滑动广告栏界面

基于的项目实战—博学谷（十 四）课程界面

基于的项目实战—博学谷（十 五）课程详情界面

基于的项目实战—博学谷（十 六）视频播放界面

基于的项目实战—博学谷（十 七）播放记录界面

基于的项目实战—博学谷（十 八）播放不同视频(网络视频)

基于的项目实战—博学谷（十 九）播放不同视频(本地视频)