[移动开发]Android基于环信实现聊天功能（三）——登录注册界面

一、标题栏控件 EaseTitleBar 使用

在 xml 中声明标题栏控件，可以在 xml 直接设置标题内容，左右图片，在 Java 文件中亦可以设置这些属性以及相关的点击事件。

<com.hyphenate.easeui.widget.EaseTitleBar
    android:id="@+id/title_bar"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:titleBarLeftImage="@drawable/ease_mm_title_back" 
    //该控件在xml中也有很多属性（图片、文本、toolbar）
/> 

titleBar = (EaseTitleBar) findViewById(R.id.title_bar);
titleBar.setTitle("张建国");
titleBar.setRightImageResource(R.drawable.ease_mm_title_remove);

可以调用 fragment 里的 hideTitleBar() 隐藏标题栏

二、环信异常的错误码

本文介绍环信即时通讯 Android SDK 中接口调用或者回调中的错误码。可以根据具体错误码判断具体错误原因。

Android 中错误码的类为 EMError。

三、登录注册界面

效果演示：

?

登录界面主要分为四个步骤：

• 页面布局
• 环信注册
• 创建用户账号信息数据库
• 环信登录

3.1 登录界面布局：activity_login.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context=".controller.activity.LoginActivity">

    <com.hyphenate.easeui.widget.EaseTitleBar
        android:id="@+id/login_titleBar"
        android:layout_width="wrap_content"
        android:layout_height="60dp"
        android:background="@color/blue"
        app:titleBarTitleTextSize="30dp"
        app:titleBarTitleTextColor="@color/black"
        app:titleBarTitle="登录"
        >
    </com.hyphenate.easeui.widget.EaseTitleBar>

    <TextView
        android:layout_marginTop="40dp"
        android:layout_marginBottom="40dp"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="环信 SDK"
        android:textSize="40sp"
        android:layout_gravity="center"
        />

     <LinearLayout
         android:layout_margin="20dp"
         android:layout_width="match_parent"
         android:layout_height="wrap_content"
         android:orientation="horizontal">
         <TextView
             android:layout_width="wrap_content"
             android:layout_height="wrap_content"
             android:textSize="25sp"
             android:text="用户名："/>

         <EditText
             android:id="@+id/login_name"
             android:layout_width="match_parent"
             android:layout_height="wrap_content"/>

     </LinearLayout>

    <LinearLayout
        android:layout_marginLeft="20dp"
        android:layout_marginRight="20dp"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal">
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textSize="25sp"
            android:text="密    码："/>

        <EditText
            android:id="@+id/login_password"
            android:inputType="textPassword"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"/>

    </LinearLayout>


    <CheckBox
        android:id="@+id/checkbox_password"
        android:layout_marginEnd="20dp"
        android:layout_gravity="end"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="显示密码"/>

    <LinearLayout
        android:layout_margin="20dp"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal">

        <Button
            android:id="@+id/bt_register"
            android:text="注册"
            android:layout_marginEnd="10dp"
            android:layout_weight="1"
            android:layout_width="0dp"
            android:layout_height="wrap_content"/>

        <Button
            android:id="@+id/bt_login"
            android:text="登录"
            android:layout_marginStart="10dp"
            android:layout_weight="1"
            android:layout_width="0dp"
            android:layout_height="wrap_content"/>

    </LinearLayout>

</LinearLayout>

一些简单的说明：?

1. EaseTitleBar 在最开始就有讲解，就是一个简单的标题列使用。
2. 如何设置密码的 EditText 显示加密：

• 早期：使用android:password="true"? 已经弃用
• 目前：使用android:inputType="textPassword"

//EditText控件inputType的使用

//文本类型，多为大写、小写和数字符号。  
android:inputType="none"//输入普通字符 
android:inputType="text"//输入普通字符 
android:inputType="textCapCharacters"//输入普通字符 
android:inputType="textCapWords"//单词首字母大小 
android:inputType="textCapSentences"//仅第一个字母大小 
android:inputType="textAutoCorrect"//前两个自动完成 
android:inputType="textAutoComplete"//前两个自动完成 
android:inputType="textMultiLine"//多行输入 
android:inputType="textImeMultiLine"//输入法多行（不一定支持） 
android:inputType="textNoSuggestions"//不提示 
android:inputType="textUri"//URI格式 
android:inputType="textEmailAddress"//电子邮件地址格式 
android:inputType="textEmailSubject"//邮件主题格式 
android:inputType="textShortMessage"//短消息格式 
android:inputType="textLongMessage"//长消息格式 
android:inputType="textPersonName"//人名格式 
android:inputType="textPostalAddress"//邮政格式 
android:inputType="textPassword"//密码格式 
android:inputType="textVisiblePassword"//密码可见格式 
android:inputType="textWebEditText"//作为网页表单的文本格式 
android:inputType="textFilter"//文本筛选格式 
android:inputType="textPhonetic"//拼音输入格式 

//数值类型 
android:inputType="number"//数字格式 
android:inputType="numberSigned"//有符号数字格式 
android:inputType="numberDecimal"//可以带小数点的浮点格式 
android:inputType="phone"//拨号键盘 
android:inputType="datetime"//日期+时间格式 
android:inputType="date"//日期键盘 
android:inputType="time"//时间键盘

3.2 登录注册功能实现：LoginActivity.java

主要实现了一下四个功能：

• 浅试了一下EaseTitleBar
• 实现点击ChecBox显示密码的功能
• 注册的业务逻辑
• 登录的业务逻辑

public class LoginActivity extends Activity {

    private EaseTitleBar easeTitleBar;
    private EditText et_name,et_pwd;
    private CheckBox checkBox;
    private Button bt_register,bt_login;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_login);

        //初始化控件
        initView();
        //初始化监听
        initListener();
        //尝试玩弄一下EaseTitleBar
        initEaseTitleBar();
        //实现点击显示密码功能
        initPwdShow();
    }

    //实现点击显示密码功能
    private void initPwdShow() {

        checkBox.setOnCheckedChangeListener((buttonView, isChecked) -> {
            if(checkBox.isChecked()){
                et_pwd.setTransformationMethod(HideReturnsTransformationMethod.getInstance()); //如果被选中则显示密码
            }else {

                et_pwd.setTransformationMethod(PasswordTransformationMethod.getInstance()); //如果没选中CheckBox则隐藏密码
            }
            et_pwd.setSelection(et_pwd.getText().length());   //TextView默认光标在最左端，这里控制光标在最右端
        });

    }

    //尝试玩弄一下EaseTitleBar
    private void initEaseTitleBar() {
        //可以看具体的文档
        easeTitleBar.setTitle("杨文杰");
    }

    //初始化控件
    private void initView() {
        easeTitleBar = (EaseTitleBar) findViewById(R.id.login_titleBar);
        et_name = (EditText) findViewById(R.id.login_name);
        et_pwd = (EditText) findViewById(R.id.login_password);
        checkBox = (CheckBox) findViewById(R.id.checkbox_password);
        bt_register = (Button) findViewById(R.id.bt_register);
        bt_login = (Button) findViewById(R.id.bt_login);
    }

    //初始化监听
    private void initListener() {
        bt_register.setOnClickListener(v -> {
            //注册的业务逻辑
            regist();
        });


        bt_login.setOnClickListener(v->{
            //登录的业务逻辑
            login();
        });
    }


    //登录的业务逻辑
    private void login() {
        // 1.获取输入的用户名和密码
        String loginName = et_name.getText().toString();
        String loginPwd = et_pwd.getText().toString();


        // 2.校验输入的用户名和密码
        if(TextUtils.isEmpty(loginName)||TextUtils.isEmpty(loginPwd)){
            Toast.makeText(LoginActivity.this,"输入的用户名和密码不可以为空",Toast.LENGTH_SHORT).show();
            return;
        }
        // 3.登录逻辑处理
        Model.getInstance().getGlobalThreadPool().execute(() -> {
            //去环信服务器登录
            EMClient.getInstance().login(loginName, loginPwd, new EMCallBack() {
                //登录成功后的处理

                @Override
                public void onSuccess() {
                    //对模型层数据的处理
                    Model.getInstance().loginSuccess();
                    //保存用户账户信息到本地数据库
                    Model.getInstance().getUserAccountDao().addAccount(new UserInfo(loginName));

                    runOnUiThread(() -> {
                        //提示登录成功
                        Toast.makeText(LoginActivity.this, "登录成功", Toast.LENGTH_SHORT).show();
                        //跳转到主界面
                        Intent intent = new Intent(LoginActivity.this,MainActivity.class);
                        startActivity(intent);
                        //登录成功后，登录界面就可以销毁了。
                        finish();
                    });
                    
                }

                //登录失败的处理
                @Override
                public void onError(int code, String error) {
                    runOnUiThread(() -> {
                        //提示登录失败
                        Toast.makeText(LoginActivity.this, "登录失败"+error+code, Toast.LENGTH_SHORT).show();

                    });

                }

                //登录过程中的处理
                @Override
                public void onProgress(int progress, String status) {

                }
            });
        });
    }

    //注册的业务逻辑
    private void regist() {
        // 1.获取输入的用户名和密码
        String registName = et_name.getText().toString();
        String registPwd = et_pwd.getText().toString();
        // 2.校验输入的用户名和密码
        if(TextUtils.isEmpty(registName)||TextUtils.isEmpty(registPwd)){
            Toast.makeText(LoginActivity.this,"输入的用户名和密码不可以为空",Toast.LENGTH_SHORT).show();
            //防止进行以下逻辑
            return;
        }

        // 3.去服务器去注册账号（目前直接去环信的服务器,后期会使用app的服务器）
        Model.getInstance().getGlobalThreadPool().execute(() -> {
            try {
                //去环信服务器注册账号
                EMClient.getInstance().createAccount(registName,registPwd);
                //注册成功，更新UI弹出吐司（显然要去子线程中更新UI）
                runOnUiThread(() -> {
                    Toast.makeText(LoginActivity.this, "注册成功", Toast.LENGTH_SHORT).show();
                });
            } catch (HyphenateException e) {
                e.printStackTrace();
                runOnUiThread(() -> {
                    Toast.makeText(LoginActivity.this, "注册失败"+e, Toast.LENGTH_SHORT).show();
                });
            }
        });
    }
}

上面的注释细节说的清楚，说点其他需要了解的。

1. 注册失败后：通过返回的异常 HyphenateException e 来进行相应的提醒操作
2. 登录失败后：会返回一个 int 的状态码和一个 String 的错误信息（详情看本章第二节）

3.3 创建用户账号信息数据库

目的是为了：用户登录成功后将用户信息保存到本地

主要分为以下四个步骤：

1. 创建用户bean类
2. 创建用户账号数据库
3. 创建表类
4. 创建数据库操作类

3.3.1?创建用户bean类 UserInfo.java

//用户账号信息的bean
public class UserInfo {

    private String name;// 用户名称
    private String huanxingID;// 环信ID
    private String nick;// 用户的名称
    private String photo;// 用户头像

    //无参构造器
    public UserInfo() {
    }

    //构造器
    public UserInfo(String name) {
        this.name = name;
        this.huanxingID = name;
        this.nick = name;
    }

    public String getName() {
        return name;
    }

    public void setName(String name) {
        this.name = name;
    }

    public String getHuanxingID() {
        return huanxingID;
    }

    public void setHuanxingID(String huanxingID) {
        this.huanxingID = huanxingID;
    }

    public String getNick() {
        return nick;
    }

    public void setNick(String nick) {
        this.nick = nick;
    }

    public String getPhoto() {
        return photo;
    }

    public void setPhoto(String photo) {
        this.photo = photo;
    }

    @Override
    public String toString() {
        return "UserInfo{" +
                "name='" + name + '\'' +
                ", huanxingID='" + huanxingID + '\'' +
                ", nick='" + nick + '\'' +
                ", photo='" + photo + '\'' +
                '}';
    }
}

这里很粗糙的传入了一个name参数的构造器，是为了方便之后的操作。

3.3.2?创建用户账号数据库 UserAccountDB.java

public class UserAccountDB extends SQLiteOpenHelper {
    //构造
    public UserAccountDB(@Nullable Context context) {
        super(context, "account.db", null, 1);
    }

    //数据库创建的时候调用
    @Override
    public void onCreate(SQLiteDatabase db) {
        //创建创建数据库表的语句
        db.execSQL(UserAccountTable.CREATE_TAB);
    }

    //数据库更新的时候调用（版本号）
    @Override
    public void onUpgrade(SQLiteDatabase db, int oldVersion, int newVersion) {

    }
}

3.3.3?创建表类 UserAccountTable.java

这里创建一个表类：在后面你就会发现有大大地好处。

public class UserAccountTable {
    public static final String TAB_NAME = "tab_account";
    public static final String COL_NAME = "name";
    public static final String COL_HXID = "huanxingID";
    public static final String COL_NICK = "nick";
    public static final String COL_PHOTO = "photo";

    public static final String CREATE_TAB = "create table "
            + TAB_NAME +" ("
            + COL_HXID +" text primary key,"
            + COL_NAME +" text,"
            + COL_NICK +" text,"
            + COL_PHOTO +" text);";

}

注意这里的CREATE_TAB代表的是一个sql语句，不要在写的时候出错。

3.3.3?创建数据库操作类 UserAccountDao.java

//用户账号数据的操作类
public class UserAccountDao {

    private final UserAccountDB mHelper;

    public UserAccountDao(Context context) {
        mHelper =  new UserAccountDB(context);
    }

    //添加用户到数据库
    public void addAccount(UserInfo user){
        //获取数据库对象
        SQLiteDatabase db = mHelper.getWritableDatabase();
        //执行添加操作
        ContentValues values=new ContentValues();
        values.put(UserAccountTable.COL_HXID,user.getHuanxingID());
        values.put(UserAccountTable.COL_NAME,user.getName());
        values.put(UserAccountTable.COL_NICK,user.getNick());
        values.put(UserAccountTable.COL_PHOTO,user.getPhoto());

        db.replace(UserAccountTable.TAB_NAME,null,values);
    }

    //根据环信id获取所有用户信息
    public UserInfo getAccountByHxId(String huanxingID){
        //获取数据库对象
        SQLiteDatabase db= mHelper.getReadableDatabase();
        //执行查询语句
        String sql = "select * from " + UserAccountTable.TAB_NAME+" where "+UserAccountTable.COL_HXID+"=?";
        Cursor cursor = db.rawQuery(sql, new String[]{huanxingID});

        UserInfo  userInfo=null;
        if(cursor.moveToNext()){
            userInfo = new UserInfo();

            //封装对象
            userInfo.setHuanxingID(cursor.getString(cursor.getColumnIndex(UserAccountTable.COL_HXID)));
            userInfo.setName(cursor.getString(cursor.getColumnIndex(UserAccountTable.COL_NAME)));
            userInfo.setNick(cursor.getString(cursor.getColumnIndex(UserAccountTable.COL_NICK)));
            userInfo.setPhoto(cursor.getString(cursor.getColumnIndex(UserAccountTable.COL_PHOTO)));
        }

        //关闭资源
        cursor.close();
        //返回数据
        return userInfo;
    }

}

创作打卡挑战赛

赢取流量/现金/CSDN周边激励大奖