75
Help us understand the problem. What are the problem?

More than 5 years have passed since last update.

posted at

updated at

Android のチャットUIライブラリを作ってみた

新しくチャット機能のあるアプリを開発しようと思って、iOSだとJSQMessagesViewControllerとかでチャットのUIが作れるライブラリがあって便利なんだけど、Androidでも同じように作ろうと思ったらいい感じのライブラリを見つけられなかったので、ないなら作ろうと思って作ってみた。

ChatMessageView

今回作ったライブラリはChatMessageViewというライブラリで完成形はこんな感じ。

数行のコードで使えます!

レイアウトファイルに追加する。

activity_main.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">

    <jp.bassaer.chatmessageview.MessageView
        android:id="@+id/message_view"
        android:layout_width="match_parent"
        android:layout_height="match_parent"/>

</LinearLayout>

あとはメッセージクラスに必要なパラメータを設定して

messageView.init(messages);

MesseageViewにセットすればOK!

サンプルコード

MainActivity.java

public class MainActivity extends Activity {

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        Bitmap icon1 = BitmapFactory.decodeResource(getResources(), jp.bassaer.chatmessageview.R.drawable.face_1);

        Message message1 = new Message();
        message1.setUserIcon(icon1);
        message1.setUserName("Michael");
        message1.setMessageText("hey! how are you?");
        message1.setRightMessage(true);

        ArrayList<Message> messages = new ArrayList<>();

        messages.add(message1);

        MessageView messageView  = (MessageView) findViewById(R.id.message_view);

        messageView.init(messages);
    }
}

リポジトリ

最後に

今回作成したライブラリはメッセージ部分のUIを作りましたが、今後はJSQMessagesViewControllerのように、入力部分もセットで実装予定です。
よかったら使ってみてください!
改善の余地が多々あるのでコメント・フィードバック等頂けると幸いです。

追記

コメントでご指摘いただいたスクロールの問題の修正とJSQMessagesViewControllerのような入力部分もセットにしたViewも追加しました。

screens.png

これからもアップデートしていきます!

Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
Sign upLogin
75
Help us understand the problem. What are the problem?