diff --git a/README.md b/README.md
index 2df2f8ed..ccd54bad 100644
--- a/README.md
+++ b/README.md
@@ -1,44 +1,51 @@
 # Agora chat demo
 
-This repository will help you learn how to use Agora chat SDK to implement a simple chat android application, like whatsapp or wechat.
+This repository will help you learn how to use Agora chat SDK to implement a simple android chat app, like whatsapp or wechat.
 
 With this sample app, you can:
 
-- Login chat server
+- Log in to the chat server
 - Start a chat
-- Manage conversation list
+- Manage the conversation list
 - Add contacts
 - Join group chats
-- Join chat rooms
-- Add your contacts to your blacklist
-- Send various types of messages, Such as: text, expression, picture, voice, file and so on
-- Logout
+- Add your contacts to your block list
+- Send various types of messages, such as text, emoji, image, voice and file messages
+- Log out of the chat server
 
 ## Prerequisites
-* Make sure you have made the preparations mentioned in the [Agora Chat SDK quickstart](https://docs.agora.io/en/agora-chat/get-started/get-started-sdk?platform=android).
-* Prepare the development environment:
-    * Java Development Kit (JDK)
-    * Android Studio 3.6 or later
+
+- Make sure you have made the preparations mentioned in the [Agora Chat SDK quickstart](https://docs.agora.io/en/agora-chat/get-started/get-started-sdk?platform=android).
+- Prepare the development environment:
+  - Java Development Kit (JDK)
+  - Android Studio Flamingo | 2022.2.1 or later
+
 ## Run the sample project
 
-Follow these steps to run the sample project:\
-### 1. Clone the repository to your local machine.
+Follow these steps to run the sample project:
+
+### 1. Clone the repository to your local device
+
 ```java
     git clone git@github.com:AgoraIO-Usecase/AgoraChat-android.git
 ```
 
-### 2. Open the Android project with Android Studio.
+### 2. Open the Android project with Android Studio
 
-### 3. Configure keys.
-Set your appkey applied from [Agora Developer Console](https://console.agora.io/) before calling ChatClient#init().
-```java
-ChatOptions options = new ChatOptions();
-// Set your appkey
-options.setAppKey("Your appkey");
-...
-//initialization
-ChatClient.getInstance().init(applicationContext, options);
+### 3. Configure keys
+
+Set your appkey obtained from the [Agora Console](https://console.agora.io/) before calling ChatClient#init().
+
+```kotlin
+val chatOptions = ChatOptions().apply {
+    // Set your appkey
+    appKey = "Your appkey"
+    ...
+}
+// initialization
+ChatClient.getInstance().init(context, chatOptions)
 ```
+
 For details, see the [prerequisites](https://docs.agora.io/en/agora-chat/get-started/get-started-sdk?platform=android) in Agora Chat SDK Guide.
 
 ## Precautions
@@ -50,8 +57,10 @@ For details, see the [prerequisites](https://docs.agora.io/en/agora-chat/get-sta
     ```
 
 ## Contact Us
+
 - You can find full API document at [Document Center](https://docs.agora.io/en/agora-chat/overview/product-overview?platform=android)
 - You can file bugs about this demo at [issue](https://github.com/AgoraIO-Usecase/AgoraChat-android/issues)
 
 ## License
+
 The MIT License (MIT).
diff --git a/app-kotlin/.gitignore b/app-kotlin/.gitignore
new file mode 100644
index 00000000..b61e41ab
--- /dev/null
+++ b/app-kotlin/.gitignore
@@ -0,0 +1,2 @@
+/build
+/src/google-services.json
\ No newline at end of file
diff --git a/app-kotlin/README.md b/app-kotlin/README.md
new file mode 100644
index 00000000..68ad2da3
--- /dev/null
+++ b/app-kotlin/README.md
@@ -0,0 +1,292 @@
+# 快速开始
+
+利用环信单群聊 UIKit，你可以轻松实现单群和群聊。本文介绍如何快速实现在单聊会话中发送消息。
+
+## 前提条件
+
+### 开发环境要求
+
+- Android Studio 4.0 及以上
+- Gradle 4.10.x 及以上
+- targetVersion 26 及以上
+- Android SDK API 21 及以上
+- JDK 11 及以上
+
+## 项目准备
+
+下面将介绍将单群聊 UIKit 引入项目中的必要环境配置。
+
+1. 用 **Android Studio** 创建一个[新的项目](https://developer.android.com/studio/projects/create-project)，在 **Phone and Tablet** 标签选择 **Empty Views Activity**，**Minimum SDK** 选择 **API 21: Android 5.0 (Lollipop)**，**Language** 选择 **Kotlin**。创建项目成功后，请确保项目同步完成。
+
+2. 检查工程是否引入 **mavenCentral** 仓库。
+
+    a. Gradle 7.0 之前
+    在 `/Gradle Scripts/build.gradle.kts(Project: <projectname>)`文件内，检查是否有 **mavenCentral** 仓库。
+    ```kotlin
+    buildscript {
+       repositories {
+           mavenCentral()
+       }
+    }
+    ```
+    b. Gradle 7.0 之后
+    在 `/Gradle Scripts/settings.gradle.kts(Project Settings)`文件内，检查是否有 **mavenCentral** 仓库。
+    ```kotlin
+    dependencyResolutionManagement {
+        repositoriesMode.set(RepositoriesMode.FAIL_ON_PROJECT_REPOS)
+        repositories {
+            mavenCentral()
+        }
+    }
+    ```
+3. 在项目中引入单群聊 UIKit
+
+从 GitHub 获取[单群聊 UIKit](https://github.com/easemob/chatuikit-android) 源码，按照下面的方式集成：
+
+- 在根目录 `settings.gradle.kts` 文件（/Gradle Scripts/settings.gradle.kts）中添加如下代码：
+
+```kotlin
+include(":ease-im-kit")
+project(":ease-im-kit").projectDir = File("../chatuikit-android/ease-im-kit")
+```
+
+- 在 app 的 `build.gradle.kts` 文件（/Gradle Scripts/build.gradle）中添加如下代码：
+
+```kotlin
+//chatuikit-android
+implementation(project(mapOf("path" to ":ease-im-kit")))
+```
+
+4. 防止代码混淆
+
+在 `/Gradle Scripts/proguard-rules.pro` 文件中添加如下代码：
+
+	```
+	-keep class com.hyphenate.** {*;}
+    -dontwarn  com.hyphenate.**
+	```
+## 实现单聊发消息
+
+这部分将介绍如何通过单群聊 UIKit 一步一步的实现单聊发送消息的。
+
+### 创建页面相关
+
+1. 打开 `app/res/values/strings.xml` 文件，并替换为如下内容：
+
+```xml
+<resources>
+    <string name="app_name">quickstart</string>
+
+    <string name="app_key">[您申请的appkey]</string>
+</resources>
+
+```
+这里需要注意的是，需要将 **app_key** 替换为您申请的 appkey。
+
+2. 打开 `app/res/layout/activity_main.xml` 文件，并替换为如下内容：
+
+```xml
+<?xml version="1.0" encoding="utf-8"?>
+<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:tools="http://schemas.android.com/tools"
+    android:layout_width="match_parent"
+    android:layout_height="match_parent"
+    android:orientation="vertical"
+    tools:context=".MainActivity">
+
+    <EditText
+        android:id="@+id/et_userId"
+        android:layout_width="match_parent"
+        android:layout_height="50dp"
+        android:layout_margin="20dp"
+        android:hint="UserId"/>
+
+    <EditText
+        android:id="@+id/et_password"
+        android:layout_width="match_parent"
+        android:layout_height="50dp"
+        android:layout_margin="20dp"
+        android:hint="Password"/>
+
+    <Button
+        android:id="@+id/btn_login"
+        android:layout_width="match_parent"
+        android:layout_height="50dp"
+        android:layout_margin="20dp"
+        android:onClick="login"
+        android:text="Login"/>
+
+    <Button
+        android:id="@+id/btn_logout"
+        android:layout_width="match_parent"
+        android:layout_height="50dp"
+        android:layout_margin="20dp"
+        android:onClick="logout"
+        android:text="Logout"/>
+
+    <EditText
+        android:id="@+id/et_peerId"
+        android:layout_width="match_parent"
+        android:layout_height="50dp"
+        android:layout_margin="20dp"
+        android:hint="PeerId"/>
+
+    <Button
+        android:id="@+id/btn_chat"
+        android:layout_width="match_parent"
+        android:layout_height="50dp"
+        android:layout_margin="20dp"
+        android:onClick="startChat"
+        android:text="Start Chat"/>
+
+</LinearLayout>
+```
+
+### 实现代码逻辑
+
+1. 实现登录和退出页面。
+
+打开 `MainActivity` 文件，并替换为如下代码：
+
+```kotlin
+package com.easemob.quickstart
+
+import android.content.Context
+import androidx.appcompat.app.AppCompatActivity
+import android.os.Bundle
+import android.view.View
+import android.widget.Toast
+import com.easemob.quickstart.databinding.ActivityMainBinding
+import com.hyphenate.easeui.EaseIM
+import com.hyphenate.easeui.common.ChatConnectionListener
+import com.hyphenate.easeui.common.ChatLog
+import com.hyphenate.easeui.common.ChatOptions
+import com.hyphenate.easeui.feature.messages.EaseChatType
+import com.hyphenate.easeui.feature.messages.activities.EaseChatActivity
+import kotlinx.coroutines.CoroutineScope
+import kotlinx.coroutines.Dispatchers
+import kotlinx.coroutines.launch
+
+class MainActivity : AppCompatActivity(), ChatConnectionListener {
+    private val binding: ActivityMainBinding by lazy { ActivityMainBinding.inflate(layoutInflater) }
+    override fun onCreate(savedInstanceState: Bundle?) {
+        super.onCreate(savedInstanceState)
+        setContentView(binding.root)
+        initSDK()
+        initListener()
+    }
+
+    private fun initSDK() {
+        val appkey = getString(R.string.app_key)
+        if (appkey.isNullOrEmpty()) {
+            showToast("You should set your AppKey first!")
+            ChatLog.e(TAG, "You should set your AppKey first!")
+            return
+        }
+        ChatOptions().apply {
+            // Set your own appkey here
+            this.appKey = appkey
+            // Set not to log in automatically
+            this.autoLogin = false
+            // Set whether confirmation of delivery is required by the recipient. Default: false
+            this.requireDeliveryAck = true
+        }.let {
+            EaseIM.init(applicationContext, it)
+        }
+    }
+
+    private fun initListener() {
+        EaseIM.subscribeConnectionDelegates(this)
+    }
+
+    fun login(view: View) {
+        val username = binding.etUserId.text.toString().trim()
+        val password = binding.etPassword.text.toString().trim()
+        if (username.isEmpty() || password.isEmpty()) {
+            showToast("Username or password cannot be empty!")
+            ChatLog.e(TAG, "Username or password cannot be empty!")
+            return
+        }
+        if (!EaseIM.isInited()) {
+            showToast("Please init first!")
+            ChatLog.e(TAG, "Please init first!")
+            return
+        }
+        EaseIM.login(username, password
+            , onSuccess = {
+                showToast("Login successfully!")
+                ChatLog.e(TAG, "Login successfully!")
+            }, onError = { code, message ->
+                showToast("Login failed: $message")
+                ChatLog.e(TAG, "Login failed: $message")
+            }
+        )
+    }
+
+    fun logout(view: View) {
+        if (!EaseIM.isInited()) {
+            showToast("Please init first!")
+            ChatLog.e(TAG, "Please init first!")
+            return
+        }
+        EaseIM.logout(false
+            , onSuccess = {
+                showToast("Logout successfully!")
+                ChatLog.e(TAG, "Logout successfully!")
+            }
+        )
+    }
+
+    fun startChat(view: View) {
+        val username = binding.etPeerId.text.toString().trim()
+        if (username.isEmpty()) {
+            showToast("Peer id cannot be empty!")
+            ChatLog.e(TAG, "Peer id cannot be empty!")
+            return
+        }
+        if (!EaseIM.isLoggedIn()) {
+            showToast("Please login first!")
+            ChatLog.e(TAG, "Please login first!")
+            return
+        }
+        EaseChatActivity.actionStart(this, username, EaseChatType.SINGLE_CHAT)
+    }
+
+    override fun onConnected() {}
+
+    override fun onDisconnected(errorCode: Int) {}
+
+    override fun onLogout(errorCode: Int, info: String?) {
+        super.onLogout(errorCode, info)
+        showToast("You have been logged out, please log in again!")
+        ChatLog.e(TAG, "")
+    }
+
+    override fun onDestroy() {
+        super.onDestroy()
+        EaseIM.unsubscribeConnectionDelegates(this)
+    }
+
+    companion object {
+        private const val TAG = "MainActivity"
+    }
+}
+
+fun Context.showToast(msg: String) {
+    CoroutineScope(Dispatchers.Main).launch {
+        Toast.makeText(this@showToast, msg, Toast.LENGTH_SHORT).show()
+    }
+}
+```
+
+2. 点击 `Sync Project with Gradle Files` 同步工程。现在可以测试你的应用了。
+
+## 测试应用
+
+1. 在 Android Studio 中，点击 `Run ‘app’` 按钮，将应用运行到您的设备或者模拟器上。
+
+2. 输入用户名和密码，点击 `Login` 按钮进行登录，登录成功或者失败有 `Toast` 提示，或者通过 Logcat 查看。
+
+3. 在另一台设备或者模拟器上登录另一个账号。
+
+4. 两台设别或者模拟器分别输入对方的账号，并点击 `Start Chat` 按钮，进入聊天页面。现在你可以在两个账号间进行聊天了。
\ No newline at end of file
diff --git a/app-kotlin/build.gradle.kts b/app-kotlin/build.gradle.kts
new file mode 100644
index 00000000..c60f306a
--- /dev/null
+++ b/app-kotlin/build.gradle.kts
@@ -0,0 +1,160 @@
+import java.util.Properties
+plugins {
+    id("com.android.application")
+    id("org.jetbrains.kotlin.android")
+    // Add the Google services Gradle plugin
+    id("com.google.gms.google-services")
+    // Add the ksp plugin when using Room
+    id("com.google.devtools.ksp")
+}
+
+val properties = Properties()
+val inputStream = project.rootProject.file("local.properties").inputStream()
+properties.load( inputStream )
+
+android {
+    namespace = "io.agora.chatdemo"
+    compileSdk = 34
+
+    defaultConfig {
+        applicationId = "io.agora.chatdemo"
+        minSdk = 21
+        targetSdk = 34
+        versionCode = 13
+        versionName = "1.3.0"
+
+        testInstrumentationRunner = "androidx.test.runner.AndroidJUnitRunner"
+
+        // Set app server info from local.properties
+        buildConfigField ("String", "APP_SERVER_PROTOCOL", "\"https\"")
+        buildConfigField ("String", "APP_SERVER_DOMAIN", "\"${properties.getProperty("APP_SERVER_DOMAIN")}\"")
+        buildConfigField ("String", "APP_SERVER_URL", "\"${properties.getProperty("APP_SERVER_URL")}\"")
+        buildConfigField ("String", "APP_SERVER_REGISTER", "\"${properties.getProperty("APP_SERVER_REGISTER")}\"")
+        buildConfigField ("String", "APP_BASE_USER", "\"${properties.getProperty("APP_BASE_USER")}\"")
+        buildConfigField ("String", "APP_UPLOAD_AVATAR", "\"${properties.getProperty("APP_UPLOAD_AVATAR")}\"")
+        buildConfigField ("String", "APP_BASE_GROUP", "\"${properties.getProperty("APP_BASE_GROUP")}\"")
+        buildConfigField ("String", "APP_GROUP_AVATAR", "\"${properties.getProperty("APP_GROUP_AVATAR")}\"")
+        buildConfigField ("String", "APP_RTC_TOKEN_URL", "\"${properties.getProperty("APP_RTC_TOKEN_URL")}\"")
+        buildConfigField ("String", "APP_RTC_CHANNEL_MAPPER_URL", "\"${properties.getProperty("APP_RTC_CHANNEL_MAPPER_URL")}\"")
+
+        // Set appkey from local.properties
+        buildConfigField("String", "AGORA_CHAT_APPKEY", "\"${properties.getProperty("AGORA_CHAT_APPKEY")}\"")
+        // Set push info from local.properties
+        buildConfigField("String", "FCM_SENDERID", "\"${properties.getProperty("FCM_SENDERID")}\"")
+        // Set RTC appId from local.properties
+        buildConfigField("String", "AGORA_APPID", "\"${properties.getProperty("AGORA_APPID")}\"")
+
+        //指定room.schemaLocation生成的文件路径  处理Room 警告 Schema export Error
+        javaCompileOptions {
+            annotationProcessorOptions {
+                arguments(mapOf(
+                    "room.schemaLocation" to "$projectDir/schemas",
+                    "room.incremental" to "true",
+                    "room.expandProjection" to "true"
+                ))
+            }
+        }
+
+        ndk {
+            abiFilters.addAll(mutableSetOf("arm64-v8a","armeabi-v7a"))
+        }
+        //用于设置使用as打包so时指定输出目录
+        externalNativeBuild {
+            ndkBuild {
+                abiFilters("arm64-v8a","armeabi-v7a")
+                arguments("-j8")
+            }
+        }
+
+
+    }
+
+    signingConfigs {
+        getByName("debug") {
+            storeFile = file(properties.getProperty("DEBUG_STORE_FILE_PATH", "./keystore/sdkdemo.jks"))
+            storePassword = properties.getProperty("DEBUG_STORE_PASSWORD", "123456")
+            keyAlias = properties.getProperty("DEBUG_KEY_ALIAS", "easemob")
+            keyPassword = properties.getProperty("DEBUG_KEY_PASSWORD", "123456")
+        }
+        create("release") {
+            storeFile = file(properties.getProperty("RELEASE_STORE_FILE_PATH", "./keystore/sdkdemo.jks"))
+            storePassword = properties.getProperty("RELEASE_STORE_PASSWORD", "123456")
+            keyAlias = properties.getProperty("RELEASE_KEY_ALIAS", "easemob")
+            keyPassword = properties.getProperty("RELEASE_KEY_PASSWORD", "123456")
+        }
+    }
+
+    buildTypes {
+        debug {
+            signingConfig = signingConfigs.getByName("debug")
+        }
+        release {
+            signingConfig = signingConfigs.getByName("release")
+            isMinifyEnabled = false
+            proguardFiles(
+                getDefaultProguardFile("proguard-android-optimize.txt"),
+                "proguard-rules.pro"
+            )
+        }
+    }
+
+    buildFeatures{
+        viewBinding = true
+        buildConfig = true
+    }
+    compileOptions {
+        sourceCompatibility = JavaVersion.VERSION_1_8
+        targetCompatibility = JavaVersion.VERSION_1_8
+    }
+    kotlinOptions {
+        jvmTarget = "1.8"
+    }
+    // Set toolchain version
+    kotlin {
+        jvmToolchain(8)
+    }
+
+    //打开注释后，可以直接在studio里查看和编辑emclient-linux里的代码
+//    externalNativeBuild {
+//        ndkBuild {
+//            path = File("jni/Android.mk")
+//        }
+//    }
+}
+
+dependencies {
+    implementation("androidx.core:core-ktx:1.10.1")
+    implementation("androidx.appcompat:appcompat:1.6.1")
+    implementation("com.google.android.material:material:1.9.0")
+    implementation("androidx.constraintlayout:constraintlayout:2.1.4")
+    // lifecycle
+    implementation("androidx.lifecycle:lifecycle-runtime-ktx:2.6.2")
+    // lifecycle viewmodel
+    implementation("androidx.lifecycle:lifecycle-viewmodel-ktx:2.6.2")
+    // Coil: load image library
+    implementation("io.coil-kt:coil:2.5.0")
+    // image corp library
+    implementation("com.github.yalantis:ucrop:2.2.8")
+    implementation("androidx.swiperefreshlayout:swiperefreshlayout:1.1.0")
+    implementation("io.github.scwang90:refresh-layout-kernel:2.1.0")
+    implementation("io.github.scwang90:refresh-header-material:2.1.0")
+    implementation("io.github.scwang90:refresh-header-classics:2.1.0")
+    implementation("pub.devrel:easypermissions:3.0.0")
+    // Room
+    implementation("androidx.room:room-runtime:2.5.1")
+    ksp("androidx.room:room-compiler:2.5.1")
+    // optional - Kotlin Extensions and Coroutines support for Room
+    // To use Kotlin Flow and coroutines with Room, must include the room-ktx artifact in build.gradle file.
+    implementation("androidx.room:room-ktx:2.5.1")
+    // Import the BoM for the Firebase platform
+    implementation(platform("com.google.firebase:firebase-bom:32.7.4"))
+    // Declare the dependencies for the Firebase Cloud Messaging and Analytics libraries
+    // When using the BoM, you don't specify versions in Firebase library dependencies
+    implementation("com.google.firebase:firebase-messaging")
+    implementation("com.google.firebase:firebase-analytics")
+
+    implementation("io.agora.rtc:chat-uikit:1.3.0")
+//    implementation(project(mapOf("path" to ":chat-uikit")))
+    implementation("io.agora.rtc:chat-callkit:1.3.0")
+//    implementation(project(mapOf("path" to ":chat-callkit")))
+}
\ No newline at end of file
diff --git a/app-kotlin/google-services.json b/app-kotlin/google-services.json
new file mode 100644
index 00000000..1fd93cfb
--- /dev/null
+++ b/app-kotlin/google-services.json
@@ -0,0 +1,39 @@
+{
+  "project_info": {
+    "project_number": "142290967082",
+    "project_id": "chatim-9b3ae",
+    "storage_bucket": "chatim-9b3ae.appspot.com"
+  },
+  "client": [
+    {
+      "client_info": {
+        "mobilesdk_app_id": "1:142290967082:android:fa1734c82786f78184c153",
+        "android_client_info": {
+          "package_name": "io.agora.chatdemo"
+        }
+      },
+      "oauth_client": [
+        {
+          "client_id": "142290967082-kffai4lca6v8f70lbku18hquh72747qa.apps.googleusercontent.com",
+          "client_type": 3
+        }
+      ],
+      "api_key": [
+        {
+          "current_key": "AIzaSyDE682uNgGqIfEL7o6BkShzx5Pi2nuIIS0"
+        }
+      ],
+      "services": {
+        "appinvite_service": {
+          "other_platform_oauth_client": [
+            {
+              "client_id": "142290967082-kffai4lca6v8f70lbku18hquh72747qa.apps.googleusercontent.com",
+              "client_type": 3
+            }
+          ]
+        }
+      }
+    }
+  ],
+  "configuration_version": "1"
+}
\ No newline at end of file
diff --git a/app-kotlin/jni/Android.mk b/app-kotlin/jni/Android.mk
new file mode 100644
index 00000000..f094fe4e
--- /dev/null
+++ b/app-kotlin/jni/Android.mk
@@ -0,0 +1,24 @@
+# Copyright (C) 2009 The Android Open Source Project
+#
+# Licensed under the Apache License, Version 2.0 (the "License");
+# you may not use this file except in compliance with the License.
+# You may obtain a copy of the License at
+#
+#      http://www.apache.org/licenses/LICENSE-2.0
+#
+# Unless required by applicable law or agreed to in writing, software
+# distributed under the License is distributed on an "AS IS" BASIS,
+# WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+# See the License for the specific language governing permissions and
+# limitations under the License.
+#
+LOCAL_PATH := $(call my-dir)
+
+include $(CLEAR_VARS)
+
+PB_LITE=1
+ENABLE_CALL=0
+USE_SQLCIPHER=1
+ENABLE_AGORA=1
+#libhyphenate.so
+include $(LOCAL_PATH)/../../../emclient-linux/Android.mk
diff --git a/app-kotlin/jni/Application.mk b/app-kotlin/jni/Application.mk
new file mode 100644
index 00000000..67e034dd
--- /dev/null
+++ b/app-kotlin/jni/Application.mk
@@ -0,0 +1,6 @@
+#APP_OPTIM := debug
+APP_ABI := arm64-v8a,armeabi-v7a, x86, x86_64
+#高版本ndk
+APP_STL := c++_static
+LOCAL_MULTILIB := 32
+APP_PLATFORM:=android-21
diff --git a/app-kotlin/keystore/sdkdemo.jks b/app-kotlin/keystore/sdkdemo.jks
new file mode 100644
index 00000000..576fe9fc
Binary files /dev/null and b/app-kotlin/keystore/sdkdemo.jks differ
diff --git a/app-kotlin/proguard-rules.pro b/app-kotlin/proguard-rules.pro
new file mode 100644
index 00000000..481bb434
--- /dev/null
+++ b/app-kotlin/proguard-rules.pro
@@ -0,0 +1,21 @@
+# Add project specific ProGuard rules here.
+# You can control the set of applied configuration files using the
+# proguardFiles setting in build.gradle.
+#
+# For more details, see
+#   http://developer.android.com/guide/developing/tools/proguard.html
+
+# If your project uses WebView with JS, uncomment the following
+# and specify the fully qualified class name to the JavaScript interface
+# class:
+#-keepclassmembers class fqcn.of.javascript.interface.for.webview {
+#   public *;
+#}
+
+# Uncomment this to preserve the line number information for
+# debugging stack traces.
+#-keepattributes SourceFile,LineNumberTable
+
+# If you keep the line number information, uncomment this to
+# hide the original source file name.
+#-renamesourcefileattribute SourceFile
\ No newline at end of file
diff --git a/app-kotlin/src/main/AndroidManifest.xml b/app-kotlin/src/main/AndroidManifest.xml
new file mode 100644
index 00000000..103e67c5
--- /dev/null
+++ b/app-kotlin/src/main/AndroidManifest.xml
@@ -0,0 +1,154 @@
+<?xml version="1.0" encoding="utf-8"?>
+<manifest xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:tools="http://schemas.android.com/tools">
+
+    <!-- IM SDK required start -->
+    <!-- App required start -->
+    <uses-permission android:name="android.permission.INTERNET" />
+    <uses-permission android:name="android.permission.REORDER_TASKS" />
+    <!-- App required end -->
+
+    <!-- IM SDK required start -->
+    <uses-feature
+        android:name="android.hardware.camera"
+        android:required="false" />
+    <uses-feature
+        android:name="android.hardware.telephony"
+        android:required="false" />
+
+    <uses-permission android:name="android.permission.CALL_PHONE"/>
+    <uses-permission android:name="android.permission.ACCESS_WIFI_STATE" />
+    <uses-permission android:name="android.permission.CHANGE_WIFI_STATE" />
+    <uses-permission android:name="android.permission.WAKE_LOCK" />
+    <uses-permission android:name="android.permission.MODIFY_AUDIO_SETTINGS" />
+    <uses-permission android:name="android.permission.RECEIVE_BOOT_COMPLETED" />
+    <uses-permission android:name="android.permission.FOREGROUND_SERVICE" />
+    <!--Need to add after Android 12, apply for alarm clock timing permission -->
+    <uses-permission android:name="android.permission.SCHEDULE_EXACT_ALARM" />
+    <!-- IM SDK required end -->
+    <!-- Read permissions from extended storage-->
+    <uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE"
+        android:maxSdkVersion="32" />
+    <uses-permission
+        android:name="android.permission.WRITE_EXTERNAL_STORAGE"
+        android:maxSdkVersion="32"
+        tools:ignore="ScopedStorage" />
+    <!-- Android 13 is used to replace the READ-EXTERNAL-STORAGE permission -->
+    <uses-permission android:name="android.permission.READ_MEDIA_IMAGES"/>
+    <uses-permission android:name="android.permission.READ_MEDIA_VIDEO"/>
+    <!-- Android 14 is used to apply for partial permissions -->
+    <uses-permission android:name="android.permission.READ_MEDIA_VISUAL_USER_SELECTED"/>
+    <!-- Android 13 Notification Runtime Permissions -->
+    <uses-permission android:name="android.permission.POST_NOTIFICATIONS"/>
+
+    <!-- RTC start -->
+    <uses-permission android:name="android.permission.BLUETOOTH"/>
+    <!-- For devices with Android 12.0 and above and integrated SDK v4.1.0 and below, the following permissions need to be added -->
+    <uses-permission android:name="android.permission.BLUETOOTH_CONNECT"/>
+    <!-- For Android 12.0 and above devices, the following permissions need to be added -->
+    <uses-permission android:name="android.permission.READ_PHONE_STATE"/>
+    <uses-permission android:name="android.permission.BLUETOOTH_SCAN"/>
+    <!-- RTC end -->
+
+    <!-- Remove unused permission in remote library start -->
+    <uses-permission
+        android:name="com.google.android.finsky.permission.BIND_GET_INSTALL_REFERRER_SERVICE"
+        tools:node="remove"/>
+    <uses-permission
+        android:name="com.google.android.gms.permission.AD_ID"
+        tools:node="remove"/>
+    <!-- Remove unused permission in remote library end -->
+
+    <application
+        android:usesCleartextTraffic="true"
+        android:allowBackup="true"
+        android:icon="@mipmap/demo_launcher"
+        android:label="@string/app_name"
+        android:roundIcon="@mipmap/demo_launcher"
+        android:supportsRtl="true"
+        android:name=".DemoApplication"
+        android:requestLegacyExternalStorage="true"
+        android:theme="@style/Theme.Easeui"
+        tools:targetApi="31">
+        <activity
+            android:name=".page.splash.SplashActivity"
+            android:exported="true">
+            <intent-filter>
+                <action android:name="android.intent.action.MAIN" />
+
+                <category android:name="android.intent.category.LAUNCHER" />
+            </intent-filter>
+        </activity>
+
+        <!-- FCM required start -->
+        <service android:name=".fcm.FCMMSGService"
+            android:exported="false">
+            <intent-filter>
+                <action android:name="com.google.firebase.MESSAGING_EVENT" />
+            </intent-filter>
+        </service>
+        <!-- Cancels automatic initialization -->
+        <meta-data
+            android:name="firebase_messaging_auto_init_enabled"
+            android:value="false" />
+        <meta-data
+            android:name="firebase_analytics_collection_enabled"
+            android:value="false" />
+        <!-- FCM required end -->
+
+        <activity android:name=".page.login.LoginActivity"
+            android:exported="false"/>
+        <activity android:name=".MainActivity"
+            android:exported="false"/>
+        <activity android:name=".page.group.ChatCreateGroupActivity"
+            android:exported="false"/>
+        <activity android:name=".page.group.ChatGroupDetailActivity"
+            android:exported="false"/>
+        <activity android:name=".page.contact.ChatContactCheckActivity"
+            android:exported="false"/>
+        <activity android:name=".page.contact.ChatNewRequestsActivity"
+            android:exported="false"/>
+        <activity android:name=".page.contact.ChatContactDetailActivity"
+            android:exported="false"/>
+        <activity android:name=".page.chat.ChatActivity"
+            android:screenOrientation="portrait"
+            android:exported="false"/>
+        <activity android:name=".page.me.activity.UserInformationActivity"
+            android:exported="false"/>
+        <activity android:name=".page.me.activity.NotifyActivity"
+            android:exported="false"/>
+        <activity android:name=".page.me.activity.WebViewActivity"
+            android:exported="false"/>
+        <activity android:name=".page.me.activity.EditUserNicknameActivity"
+            android:exported="false"/>
+        <activity android:name=".page.me.activity.AboutActivity"
+            android:exported="false"/>
+        <activity android:name=".page.me.activity.CurrencyActivity"
+            android:exported="false"/>
+        <activity android:name=".page.me.activity.FeaturesActivity"
+            android:exported="false"/>
+        <activity android:name=".page.me.activity.LanguageSettingActivity"
+            android:exported="false"/>
+        <!-- crop activity -->
+        <activity
+            android:name="com.yalantis.ucrop.UCropActivity"
+            android:screenOrientation="portrait"
+            android:theme="@style/Theme.AppCompat.Light.NoActionBar"/>
+        <!-- rtc -->
+        <activity android:name=".callkit.activity.CallSingleBaseActivity"
+            android:label="@string/demo_activity_label_video_call"
+            android:configChanges="orientation|keyboardHidden|screenSize"
+            android:excludeFromRecents="false"
+            android:launchMode="singleInstance"
+            android:exported="false"/>
+        <activity android:name=".callkit.activity.CallMultipleBaseActivity"
+            android:label="@string/demo_activity_label_multi_call"
+            android:configChanges="orientation|keyboardHidden|screenSize"
+            android:excludeFromRecents="false"
+            android:launchMode="singleInstance"
+            android:exported="false"/>
+        <activity android:name=".callkit.activity.CallMultipleInviteActivity"
+            android:exported="false"/>
+    </application>
+
+</manifest>
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/DemoApplication.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/DemoApplication.kt
new file mode 100644
index 00000000..1f1d6d8d
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/DemoApplication.kt
@@ -0,0 +1,57 @@
+package io.agora.chatdemo
+
+import android.app.Application
+import androidx.appcompat.app.AppCompatDelegate
+import io.agora.chatdemo.base.UserActivityLifecycleCallbacks
+import io.agora.chatdemo.bean.LanguageType
+import io.agora.chatdemo.common.DemoConstant
+import io.agora.chatdemo.common.PreferenceManager
+import io.agora.chatdemo.utils.LanguageUtil
+import io.agora.uikit.EaseIM
+
+class DemoApplication: Application() {
+
+    private val mLifecycleCallbacks = UserActivityLifecycleCallbacks()
+
+    companion object {
+        private lateinit var instance: DemoApplication
+        fun getInstance(): DemoApplication {
+            return instance
+        }
+    }
+
+    override fun onCreate() {
+        super.onCreate()
+        instance = this
+        registerActivityLifecycleCallbacks()
+
+        DemoHelper.getInstance().init(this)
+        initFeatureConfig()
+    }
+
+    private fun registerActivityLifecycleCallbacks() {
+        this.registerActivityLifecycleCallbacks(mLifecycleCallbacks)
+    }
+
+    fun getLifecycleCallbacks(): UserActivityLifecycleCallbacks {
+        return mLifecycleCallbacks
+    }
+
+    private fun initFeatureConfig(){
+        val isBlack = DemoHelper.getInstance().getDataModel().getBoolean(DemoConstant.IS_BLACK_THEME)
+        AppCompatDelegate.setDefaultNightMode(if (isBlack) AppCompatDelegate.MODE_NIGHT_YES else AppCompatDelegate.MODE_NIGHT_NO)
+
+        val enableTranslation = DemoHelper.getInstance().getDataModel().getBoolean(DemoConstant.FEATURES_TRANSLATION,true)
+        val enableThread = DemoHelper.getInstance().getDataModel().getBoolean(DemoConstant.FEATURES_THREAD,true)
+        val enableReaction = DemoHelper.getInstance().getDataModel().getBoolean(DemoConstant.FEATURES_REACTION,true)
+        val enableTyping = DemoHelper.getInstance().getDataModel().getBoolean(DemoConstant.IS_TYPING_ON,false)
+        val targetLanguage = PreferenceManager.getValue(DemoConstant.TARGET_LANGUAGE, LanguageType.EN.value)
+        EaseIM.getConfig()?.chatConfig?.targetTranslationLanguage = targetLanguage
+        LanguageUtil.changeLanguage("en")
+
+        EaseIM.getConfig()?.chatConfig?.enableTranslationMessage = enableTranslation
+        EaseIM.getConfig()?.chatConfig?.enableChatThreadMessage = enableThread
+        EaseIM.getConfig()?.chatConfig?.enableMessageReaction = enableReaction
+        EaseIM.getConfig()?.chatConfig?.enableChatTyping = enableTyping
+    }
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/DemoHelper.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/DemoHelper.kt
new file mode 100644
index 00000000..f33f2585
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/DemoHelper.kt
@@ -0,0 +1,156 @@
+package io.agora.chatdemo
+
+import android.content.Context
+import android.util.Log
+import io.agora.chatdemo.callkit.CallKitManager
+import io.agora.chatdemo.common.DemoDataModel
+import io.agora.chatdemo.common.ListenersWrapper
+import io.agora.chatdemo.common.PushManager
+import io.agora.chatdemo.common.extensions.internal.checkAppKey
+import io.agora.chatdemo.uikit.UIKitManager
+import io.agora.uikit.EaseIM
+import io.agora.uikit.common.ChatClient
+import io.agora.uikit.common.ChatOptions
+import io.agora.uikit.common.PushConfigBuilder
+
+class DemoHelper private constructor(){
+
+    private lateinit var dataModel: DemoDataModel
+    var hasAppKey = false
+    lateinit var context: Context
+
+    @Synchronized
+    fun init(context: Context) {
+        this.context = context.applicationContext
+        dataModel = DemoDataModel(context)
+        initSDK()
+    }
+
+    fun getDataModel(): DemoDataModel {
+        return dataModel
+    }
+
+    /**
+     * Check if the SDK has been initialized.
+     */
+    fun isSDKInited(): Boolean {
+        return EaseIM.isInited()
+    }
+
+    /**
+     * Initialize the SDK.
+     */
+    @Synchronized
+    fun initSDK() {
+        if (::context.isInitialized.not()) {
+            Log.e(TAG, "Please call init method first.")
+            return
+        }
+        initChatOptions(context).apply {
+            hasAppKey = checkAppKey(context)
+            if (!hasAppKey) {
+                Log.e(TAG, "App key is null or empty.")
+                return
+            }
+            // Register necessary listeners
+            ListenersWrapper.registerListeners()
+            isLoadEmptyConversations = true
+            EaseIM.init(context, this)
+            if (EaseIM.isInited()) {
+                // debug mode, you'd better set it to false, if you want release your App officially.
+                ChatClient.getInstance().setDebugMode(true)
+                // Initialize push.
+                initPush()
+                // Set the UIKit options.
+                addUIKitSettings()
+                // Initialize the callkit module.
+                initCallKit()
+            }
+        }
+    }
+
+    private fun addUIKitSettings() {
+        UIKitManager.addUIKitSettings(context)
+    }
+
+    private fun initPush() {
+        PushManager.initPush(context)
+    }
+
+    /**
+     * Get the notifier.
+     */
+    fun getNotifier() = EaseIM.getNotifier()
+
+    private fun initCallKit() {
+        CallKitManager.init(context)
+    }
+
+    /**
+     * Set chat options.
+     * Note: Developers need to set the options according to needs.
+     */
+    private fun initChatOptions(context: Context): ChatOptions {
+        return ChatOptions().apply {
+            // set the appkey
+            appKey = BuildConfig.AGORA_CHAT_APPKEY
+            // set if accept the invitation automatically, default true
+            acceptInvitationAlways = false
+            // set if you need read ack
+            requireAck = true
+            // Set whether the sent message is included in the message listener, default false
+            isIncludeSendMessageInMessageListener = true
+
+            getDataModel().setUseFCM(true)
+
+            /**
+             * Note: Developers need to apply your own push accounts and replace the following
+             */
+            pushConfig = PushConfigBuilder(context)
+                .enableFCM(BuildConfig.FCM_SENDERID)
+                .build()
+
+            if (dataModel.isDeveloperMode()) {
+
+                if (dataModel.getCustomAppKey().isNotEmpty()){
+                    dataModel.getCustomAppKey().let {
+                        appKey = it
+                    }
+                }
+
+                if (dataModel.isCustomServerEnable()) {
+                    // Turn off DNS configuration
+                    enableDNSConfig(false)
+                    restServer = dataModel.getRestServer()?.ifEmpty { null }
+                    setIMServer(dataModel.getIMServer()?.let {
+                        if (it.contains(":")) {
+                            imPort = it.split(":")[1].toInt()
+                            it.split(":")[0]
+                        } else {
+                            it.ifEmpty { null }
+                        }
+                    })
+                    val port = dataModel.getIMServerPort()
+                    if (port != 0) {
+                        imPort = port
+                    }
+                }
+            }
+        }
+    }
+
+    companion object {
+        private const val TAG = "DemoHelper"
+        private var instance: DemoHelper? = null
+        fun getInstance(): DemoHelper {
+            if (instance == null) {
+                synchronized(DemoHelper::class.java) {
+                    if (instance == null) {
+                        instance = DemoHelper()
+                    }
+                }
+            }
+            return instance!!
+        }
+    }
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/MainActivity.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/MainActivity.kt
new file mode 100644
index 00000000..6edad110
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/MainActivity.kt
@@ -0,0 +1,323 @@
+package io.agora.chatdemo
+
+import android.content.Context
+import android.content.Intent
+import android.os.Bundle
+import android.view.LayoutInflater
+import android.view.MenuItem
+import android.view.View
+import android.widget.TextView
+import androidx.fragment.app.Fragment
+import androidx.lifecycle.ViewModelProvider
+import androidx.lifecycle.lifecycleScope
+import com.google.android.material.bottomnavigation.BottomNavigationItemView
+import com.google.android.material.bottomnavigation.BottomNavigationMenuView
+import com.google.android.material.navigation.NavigationBarView
+import io.agora.chatdemo.base.BaseInitActivity
+import io.agora.chatdemo.callkit.CallKitManager
+import io.agora.chatdemo.common.DemoConstant
+import io.agora.chatdemo.databinding.ActivityMainLayoutBinding
+import io.agora.chatdemo.interfaces.IMainResultView
+import io.agora.chatdemo.page.contact.ChatContactListFragmentEvent
+import io.agora.chatdemo.page.conversation.ConversationListFragment
+import io.agora.chatdemo.page.me.fragment.AboutMeFragment
+import io.agora.chatdemo.viewmodel.MainViewModel
+import io.agora.chatdemo.viewmodel.ProfileInfoViewModel
+import io.agora.uikit.EaseIM
+import io.agora.uikit.common.ChatError
+import io.agora.uikit.common.ChatLog
+import io.agora.uikit.common.ChatMessage
+import io.agora.uikit.common.EaseConstant
+import io.agora.uikit.common.bus.EaseFlowBus
+import io.agora.uikit.common.extensions.catchChatException
+import io.agora.uikit.common.extensions.showToast
+import io.agora.uikit.feature.conversation.EaseConversationListFragment
+import io.agora.uikit.interfaces.EaseContactListener
+import io.agora.uikit.interfaces.EaseMessageListener
+import io.agora.uikit.interfaces.OnEventResultListener
+import io.agora.uikit.model.EaseEvent
+import kotlinx.coroutines.flow.SharingStarted
+import kotlinx.coroutines.flow.onCompletion
+import kotlinx.coroutines.flow.stateIn
+import kotlinx.coroutines.launch
+
+class MainActivity : BaseInitActivity<ActivityMainLayoutBinding>(), NavigationBarView.OnItemSelectedListener,
+    OnEventResultListener, IMainResultView {
+    override fun getViewBinding(inflater: LayoutInflater): ActivityMainLayoutBinding? {
+        return ActivityMainLayoutBinding.inflate(inflater)
+    }
+
+    private var mConversationListFragment: Fragment? = null
+    private var mContactFragment: Fragment? = null
+    private var mAboutMeFragment: Fragment? = null
+    private var mCurrentFragment: Fragment? = null
+    private val badgeMap = mutableMapOf<Int, TextView>()
+    private val mainViewModel: MainViewModel by lazy {
+        ViewModelProvider(this)[MainViewModel::class.java]
+    }
+    private val mProfileViewModel: ProfileInfoViewModel by lazy {
+        ViewModelProvider(this)[ProfileInfoViewModel::class.java]
+    }
+
+    private val chatMessageListener = object : EaseMessageListener() {
+        override fun onMessageReceived(messages: MutableList<ChatMessage>?) {
+            mainViewModel.getUnreadMessageCount()
+        }
+    }
+
+    companion object {
+        fun actionStart(context: Context) {
+            Intent(context, MainActivity::class.java).apply {
+                context.startActivity(this)
+            }
+        }
+    }
+
+    override fun initView(savedInstanceState: Bundle?) {
+        super.initView(savedInstanceState)
+        binding.navView.itemIconTintList = null
+        switchToHome()
+        checkIfShowSavedFragment(savedInstanceState)
+        addTabBadge()
+        mainViewModel.getRequestUnreadCount()
+    }
+
+    override fun initListener() {
+        super.initListener()
+        binding.navView.setOnItemSelectedListener(this)
+        EaseIM.addEventResultListener(this)
+        EaseIM.addChatMessageListener(chatMessageListener)
+        EaseIM.addContactListener(contactListener)
+    }
+
+    override fun initData() {
+        super.initData()
+        mainViewModel.attachView(this)
+        synchronizeProfile()
+        EaseFlowBus.with<EaseEvent>(EaseEvent.EVENT.ADD.name).register(this){
+            // check unread message count
+            mainViewModel.getUnreadMessageCount()
+        }
+        EaseFlowBus.with<EaseEvent>(EaseEvent.EVENT.REMOVE.name).register(this){
+            // check unread message count
+            mainViewModel.getUnreadMessageCount()
+        }
+        EaseFlowBus.with<EaseEvent>(EaseEvent.EVENT.DESTROY.name).register(this){
+            // check unread message count
+            mainViewModel.getUnreadMessageCount()
+        }
+        EaseFlowBus.with<EaseEvent>(EaseEvent.EVENT.LEAVE.name).register(this){
+            // check unread message count
+            mainViewModel.getUnreadMessageCount()
+        }
+        EaseFlowBus.with<EaseEvent>(EaseEvent.EVENT.UPDATE.name).register(this){
+            // check unread message count
+            mainViewModel.getUnreadMessageCount()
+        }
+        EaseFlowBus.withStick<EaseEvent>(EaseEvent.EVENT.UPDATE.name).register(this){
+            // check unread message count
+            mainViewModel.getUnreadMessageCount()
+        }
+        EaseFlowBus.with<EaseEvent>(EaseEvent.EVENT.UPDATE.name).register(this) {
+            if (it.isNotifyChange) {
+                mainViewModel.getRequestUnreadCount()
+            }
+        }
+        EaseFlowBus.with<EaseEvent>(EaseEvent.EVENT.ADD.name).register(this) {
+            if (it.isNotifyChange) {
+                mainViewModel.getRequestUnreadCount()
+            }
+        }
+        EaseFlowBus.with<EaseEvent>(EaseEvent.EVENT.ADD + EaseEvent.TYPE.CONVERSATION).register(this) {
+            if (it.isConversationChange) {
+                mainViewModel.getUnreadMessageCount()
+            }
+        }
+    }
+
+    private fun switchToHome() {
+        if (mConversationListFragment == null) {
+            mConversationListFragment = EaseConversationListFragment.Builder()
+                .useTitleBar(true)
+                .enableTitleBarPressBack(false)
+                .useSearchBar(true)
+                .setCustomFragment(ConversationListFragment())
+                .build()
+        }
+        mConversationListFragment?.let {
+            replace(it, "conversation")
+        }
+    }
+
+    private fun switchToContacts() {
+        if (mContactFragment == null) {
+            mContactFragment = ChatContactListFragmentEvent.Builder()
+                .useTitleBar(true)
+                .useSearchBar(true)
+                .enableTitleBarPressBack(false)
+                .setHeaderItemVisible(true)
+                .build()
+        }
+        mContactFragment?.let {
+            replace(it, "contact")
+        }
+    }
+
+    private fun switchToAboutMe() {
+        if (mAboutMeFragment == null) {
+            mAboutMeFragment = AboutMeFragment()
+        }
+        mAboutMeFragment?.let {
+            replace(it, "me")
+        }
+    }
+
+    override fun onDestroy() {
+        EaseIM.removeEventResultListener(this)
+        EaseIM.removeChatMessageListener(chatMessageListener)
+        EaseIM.removeContactListener(contactListener)
+        super.onDestroy()
+    }
+
+    private fun replace(fragment: Fragment, tag: String) {
+        if (mCurrentFragment !== fragment) {
+            val t = supportFragmentManager.beginTransaction()
+            mCurrentFragment?.let {
+                t.hide(it)
+            }
+            mCurrentFragment = fragment
+            if (!fragment.isAdded) {
+                t.add(R.id.fl_main_fragment, fragment, tag).show(fragment).commit()
+            } else {
+                t.show(fragment).commit()
+            }
+        }
+    }
+
+    /**
+     * 用于展示是否已经存在的Fragment
+     * @param savedInstanceState
+     */
+    private fun checkIfShowSavedFragment(savedInstanceState: Bundle?) {
+        if (savedInstanceState != null) {
+            val tag = savedInstanceState.getString("tag")
+            if (!tag.isNullOrEmpty()) {
+                val fragment = supportFragmentManager.findFragmentByTag(tag)
+                if (fragment is Fragment) {
+                    replace(fragment, tag)
+                }
+            }
+        }
+    }
+
+    private fun addTabBadge() {
+        (binding.navView.getChildAt(0) as? BottomNavigationMenuView)?.let { menuView->
+            val childCount = menuView.childCount
+            for (i in 0 until childCount) {
+                val itemView = menuView.getChildAt(i) as BottomNavigationItemView
+                val badge = LayoutInflater.from(this).inflate(R.layout.demo_badge_home, menuView, false)
+                badgeMap[i] = badge.findViewById(R.id.tv_main_home_msg)
+                itemView.addView(badge)
+            }
+        }
+    }
+
+    override fun onNavigationItemSelected(item: MenuItem): Boolean {
+        var showNavigation = false
+        when (item.itemId) {
+            R.id.em_main_nav_home -> {
+                switchToHome()
+                showNavigation = true
+            }
+
+            R.id.em_main_nav_friends -> {
+                switchToContacts()
+                showNavigation = true
+            }
+
+            R.id.em_main_nav_me -> {
+                switchToAboutMe()
+                showNavigation = true
+            }
+        }
+        invalidateOptionsMenu()
+        return showNavigation
+    }
+
+    override fun onSaveInstanceState(outState: Bundle) {
+        super.onSaveInstanceState(outState)
+        if (mCurrentFragment != null) {
+            outState.putString("tag", mCurrentFragment!!.tag)
+        }
+    }
+
+    override fun onEventResult(function: String, errorCode: Int, errorMessage: String?) {
+        when(function){
+            EaseConstant.API_ASYNC_ADD_CONTACT -> {
+                if (errorCode == ChatError.EM_NO_ERROR){
+                    runOnUiThread{
+                        mContext.showToast(mContext.resources.getString(R.string.em_main_add_contact_success))
+                    }
+                }else{
+                    runOnUiThread{
+                        if (errorCode == ChatError.USER_NOT_FOUND){
+                            mContext.showToast(mContext.resources.getString(R.string.em_main_add_contact_not_found))
+                        }else{
+                            mContext.showToast(errorMessage.toString())
+                        }
+                    }
+                }
+            }
+            else -> {}
+        }
+    }
+
+    override fun getUnreadCountSuccess(count: String?) {
+        if (count.isNullOrEmpty()) {
+            badgeMap[0]?.text = ""
+            badgeMap[0]?.visibility = View.GONE
+        } else {
+            badgeMap[0]?.text = count
+            badgeMap[0]?.visibility = View.VISIBLE
+        }
+    }
+
+    override fun getRequestUnreadCountSuccess(count: String?) {
+        if (count.isNullOrEmpty()) {
+            badgeMap[1]?.text = ""
+            badgeMap[1]?.visibility = View.GONE
+        } else {
+            badgeMap[1]?.text = count
+            badgeMap[1]?.visibility = View.VISIBLE
+        }
+    }
+
+    private val contactListener = object : EaseContactListener() {
+        override fun onContactInvited(username: String?, reason: String?) {
+            mainViewModel.getRequestUnreadCount()
+        }
+    }
+
+    private fun synchronizeProfile(){
+        lifecycleScope.launch {
+            mProfileViewModel.synchronizeProfile()
+                .onCompletion { dismissLoading() }
+                .catchChatException { e ->
+                    ChatLog.e("MainActivity", " synchronizeProfile fail error message = " + e.description)
+                }
+                .stateIn(lifecycleScope, SharingStarted.WhileSubscribed(5000), null)
+                .collect {
+                    ChatLog.e("MainActivity","synchronizeProfile result $it")
+                    it?.let {
+                        DemoHelper.getInstance().getDataModel().insertUser(it)
+                        EaseIM.updateCurrentUser(it)
+                        CallKitManager.setEaseCallKitUserInfo(it.id)
+                        EaseFlowBus.with<EaseEvent>(EaseEvent.EVENT.UPDATE + EaseEvent.TYPE.CONTACT)
+                            .post(lifecycleScope, EaseEvent(DemoConstant.EVENT_UPDATE_SELF, EaseEvent.TYPE.CONTACT))
+                    }
+                }
+        }
+
+    }
+
+}
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/base/ActivityState.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/base/ActivityState.kt
new file mode 100644
index 00000000..c4c33af0
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/base/ActivityState.kt
@@ -0,0 +1,32 @@
+package io.agora.chatdemo.base
+
+import android.app.Activity
+
+/**
+ * Created by shuwei on 2017/12/18.
+ */
+interface ActivityState {
+    /**
+     * 得到当前Activity
+     * @return
+     */
+    fun current(): Activity?
+
+    /**
+     * 得到Activity集合
+     * @return
+     */
+    val activityList: List<Activity?>?
+
+    /**
+     * 任务栈中Activity的总数
+     * @return
+     */
+    fun count(): Int
+
+    /**
+     * 判断应用是否处于前台，即是否可见
+     * @return
+     */
+    val isFront: Boolean
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/base/BaseDialogFragment.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/base/BaseDialogFragment.kt
new file mode 100644
index 00000000..6b494755
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/base/BaseDialogFragment.kt
@@ -0,0 +1,131 @@
+package io.agora.chatdemo.base
+
+import android.app.Activity
+import android.content.Context
+import android.graphics.Color
+import android.graphics.Rect
+import android.graphics.drawable.ColorDrawable
+import android.os.Bundle
+import android.view.Gravity
+import android.view.LayoutInflater
+import android.view.View
+import android.view.ViewGroup
+import android.view.WindowManager
+import androidx.annotation.IdRes
+import androidx.fragment.app.DialogFragment
+
+/**
+ * As the base class for dialog fragments
+ */
+abstract class BaseDialogFragment : DialogFragment() {
+    var mContext: Activity? = null
+    override fun onAttach(context: Context) {
+        super.onAttach(context)
+        mContext = context as Activity
+    }
+
+    override fun onCreateView(
+        inflater: LayoutInflater,
+        container: ViewGroup?,
+        savedInstanceState: Bundle?
+    ): View? {
+        initArgument()
+        val view = inflater.inflate(layoutId, container, false)
+        setChildView(view)
+        setDialogAttrs()
+        return view
+    }
+
+    open fun setChildView(view: View?) {}
+
+    abstract val layoutId: Int
+    private fun setDialogAttrs() {
+        try {
+            dialog!!.window!!.setBackgroundDrawable(ColorDrawable(Color.TRANSPARENT))
+        } catch (e: Exception) {
+            e.printStackTrace()
+        }
+    }
+
+    override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
+        super.onViewCreated(view, savedInstanceState)
+        initView(savedInstanceState)
+        initListener()
+    }
+
+    override fun onActivityCreated(savedInstanceState: Bundle?) {
+        super.onActivityCreated(savedInstanceState)
+        initData()
+    }
+
+    open fun initArgument() {}
+    open fun initView(savedInstanceState: Bundle?) {}
+    open fun initListener() {}
+    open fun initData() {}
+
+    /**
+     * To obtain the current view control through the ID, it needs to be called in the lifecycle after onViewCreated ()
+     * @param id
+     * @param <T>
+     * @return
+    </T> */
+    protected fun <T : View?> findViewById(@IdRes id: Int): T? {
+        return requireView().findViewById(id)
+    }
+
+    /**
+     * Dialog width is full, height is customizable
+     */
+    fun setDialogParams() {
+        try {
+            val dialogWindow = dialog!!.window
+            val lp = dialogWindow!!.attributes
+            lp.dimAmount = 0.6f
+            lp.width = ViewGroup.LayoutParams.MATCH_PARENT
+            lp.height = ViewGroup.LayoutParams.WRAP_CONTENT
+            lp.gravity = Gravity.BOTTOM
+            setDialogParams(lp)
+        } catch (e: Exception) {
+            e.printStackTrace()
+        }
+    }
+
+    /**
+     * Full screen dialog
+     */
+    fun setDialogFullParams() {
+        val dialogHeight = getContextRect(mContext)
+        val height = if (dialogHeight == 0) ViewGroup.LayoutParams.MATCH_PARENT else dialogHeight
+        setDialogParams(ViewGroup.LayoutParams.MATCH_PARENT, height, 0.0f)
+    }
+
+    open fun setDialogParams(width: Int, height: Int, dimAmount: Float) {
+        try {
+            val dialogWindow = dialog!!.window
+            val lp = dialogWindow!!.attributes
+            lp.dimAmount = dimAmount
+            lp.width = width
+            lp.height = height
+            dialogWindow.attributes = lp
+        } catch (e: Exception) {
+            e.printStackTrace()
+        }
+    }
+
+    open fun setDialogParams(layoutParams: WindowManager.LayoutParams?) {
+        try {
+            val dialogWindow = dialog!!.window
+            dialogWindow!!.attributes = layoutParams
+        } catch (e: Exception) {
+            e.printStackTrace()
+        }
+    }
+
+    //Get content area
+    private fun getContextRect(activity: Activity?): Int {
+        //application area
+        val outRect1 = Rect()
+        activity?.window?.decorView?.getWindowVisibleDisplayFrame(outRect1)
+        return outRect1.height()
+    }
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/base/BaseInitActivity.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/base/BaseInitActivity.kt
new file mode 100644
index 00000000..ba570133
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/base/BaseInitActivity.kt
@@ -0,0 +1,38 @@
+package io.agora.chatdemo.base
+
+import android.content.Intent
+import android.os.Bundle
+import androidx.viewbinding.ViewBinding
+import io.agora.uikit.base.EaseBaseActivity
+
+abstract class BaseInitActivity<B : ViewBinding> : EaseBaseActivity<B>() {
+    override fun onCreate(savedInstanceState: Bundle?) {
+        super.onCreate(savedInstanceState)
+        initIntent(intent)
+        initView(savedInstanceState)
+        initListener()
+        initData()
+    }
+
+    /**
+     * init intent
+     * @param intent
+     */
+    protected open fun initIntent(intent: Intent?) {}
+
+    /**
+     * init view
+     * @param savedInstanceState
+     */
+    protected open fun initView(savedInstanceState: Bundle?) {}
+
+    /**
+     * init listener
+     */
+    protected open fun initListener() {}
+
+    /**
+     * init data
+     */
+    protected open fun initData() {}
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/base/BaseRepository.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/base/BaseRepository.kt
new file mode 100644
index 00000000..8019b8f1
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/base/BaseRepository.kt
@@ -0,0 +1,10 @@
+package io.agora.chatdemo.base
+
+import android.content.Context
+import io.agora.chatdemo.DemoApplication
+
+open class BaseRepository {
+    fun getContext(): Context {
+        return DemoApplication.getInstance()
+    }
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/base/UserActivityLifecycleCallbacks.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/base/UserActivityLifecycleCallbacks.kt
new file mode 100644
index 00000000..25e366bd
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/base/UserActivityLifecycleCallbacks.kt
@@ -0,0 +1,104 @@
+package io.agora.chatdemo.base
+
+import android.app.Activity
+import android.app.Application
+import android.content.Intent
+import android.os.Bundle
+import android.util.Log
+
+/**
+ * Used for maintenance Activity lifecycle
+ */
+class UserActivityLifecycleCallbacks : Application.ActivityLifecycleCallbacks, ActivityState {
+    override val activityList: MutableList<Activity> = ArrayList()
+    private val resumeActivity: MutableList<Activity> = ArrayList()
+    override fun onActivityCreated(activity: Activity, bundle: Bundle?) {
+        Log.e("ActivityLifecycle", "onActivityCreated " + activity.localClassName)
+        activityList.add(0, activity)
+    }
+
+    override fun onActivityStarted(activity: Activity) {
+        Log.e("ActivityLifecycle", "onActivityStarted " + activity.localClassName)
+    }
+
+    override fun onActivityResumed(activity: Activity) {
+        Log.e(
+            "ActivityLifecycle",
+            "onActivityResumed activity's taskId = " + activity.taskId + " name: " + activity.localClassName
+        )
+        if (!resumeActivity.contains(activity)) {
+            resumeActivity.add(activity)
+            if (resumeActivity.size == 1) {
+                //do nothing
+            }
+        }
+    }
+
+    override fun onActivityPaused(activity: Activity) {
+        Log.e("ActivityLifecycle", "onActivityPaused " + activity.localClassName)
+    }
+
+    override fun onActivityStopped(activity: Activity) {
+        Log.e("ActivityLifecycle", "onActivityStopped " + activity.localClassName)
+        resumeActivity.remove(activity)
+        if (resumeActivity.isEmpty()) {
+            Log.e("ActivityLifecycle", "在后台了")
+        }
+    }
+
+    override fun onActivitySaveInstanceState(activity: Activity, bundle: Bundle) {
+        Log.e("ActivityLifecycle", "onActivitySaveInstanceState " + activity.localClassName)
+    }
+
+    override fun onActivityDestroyed(activity: Activity) {
+        Log.e("ActivityLifecycle", "onActivityDestroyed " + activity.localClassName)
+        activityList.remove(activity)
+    }
+
+    override fun current(): Activity? {
+        return if (activityList.size > 0) activityList[0] else null
+    }
+
+    override fun count(): Int {
+        return activityList.size
+    }
+
+    override val isFront: Boolean
+        get() = resumeActivity.size > 0
+
+    /**
+     * 跳转到目标activity
+     * @param cls
+     */
+    fun skipToTarget(cls: Class<*>?) {
+        if (activityList.size > 0) {
+            current()?.startActivity(Intent(current(), cls))
+            for (activity in activityList) {
+                activity.finish()
+            }
+        }
+    }
+
+    /**
+     * finish target activity
+     * @param cls
+     */
+    fun finishTarget(cls: Class<*>) {
+        if (activityList.isNotEmpty()) {
+            for (activity in activityList) {
+                if (activity.javaClass == cls) {
+                    activity.finish()
+                }
+            }
+        }
+    }
+
+    val isOnForeground: Boolean
+        /**
+         * 判断app是否在前台
+         * @return
+         */
+        get() = resumeActivity.isNotEmpty()
+
+
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/bean/Language.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/bean/Language.kt
new file mode 100644
index 00000000..f2e3b2b5
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/bean/Language.kt
@@ -0,0 +1,26 @@
+package io.agora.chatdemo.bean
+
+data class Language(
+    val type:LanguageType,
+    val tag:String
+)
+
+enum class LanguageType(val value:String){
+    ZH("zh"),
+    EN("en");
+
+    companion object {
+        fun from(value: String): LanguageType {
+            val types = LanguageType.values()
+            val length = types.size
+            for (i in 0 until length) {
+                val type = types[i]
+                if (type.value == value) {
+                    return type
+                }
+            }
+            return ZH
+        }
+    }
+}
+
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/bean/LoginResult.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/bean/LoginResult.kt
new file mode 100644
index 00000000..0c07af64
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/bean/LoginResult.kt
@@ -0,0 +1,11 @@
+package io.agora.chatdemo.bean
+
+class LoginResult {
+    var code = 0
+    var agoraUid: Int = 0
+    var chatUserName: String? = null
+    var avatarUrl: String? = null
+    var token: String? = null
+    var accessToken: String? = null
+    var expireTimestamp: Long? = null
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/bean/PresenceData.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/bean/PresenceData.kt
new file mode 100644
index 00000000..46fea61a
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/bean/PresenceData.kt
@@ -0,0 +1,34 @@
+package io.agora.chatdemo.bean
+
+import androidx.annotation.DrawableRes
+import androidx.annotation.StringRes
+import io.agora.chatdemo.R
+
+enum class PresenceData(
+    @field:StringRes @get:StringRes
+    @param:StringRes var presence: Int, @field:DrawableRes @get:DrawableRes
+    @param:DrawableRes var presenceIcon: Int
+) {
+    ONLINE(
+        R.string.ease_presence_online,
+        R.drawable.ease_presence_online
+    ),
+    BUSY(
+        R.string.ease_presence_busy,
+        R.drawable.ease_presence_busy
+    ),
+    DO_NOT_DISTURB(
+        R.string.ease_presence_do_not_disturb,
+        R.drawable.ease_presence_do_not_disturb
+    ),
+    AWAY(
+        R.string.ease_presence_away,
+        R.drawable.ease_presence_away
+    ),
+    OFFLINE(
+        R.string.ease_presence_offline,
+        R.drawable.ease_presence_offline
+    ),
+    CUSTOM(R.string.ease_presence_custom, R.drawable.ease_presence_custom)
+
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/callkit/CallKitActivityLifecycleCallback.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/callkit/CallKitActivityLifecycleCallback.kt
new file mode 100644
index 00000000..1f5508cd
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/callkit/CallKitActivityLifecycleCallback.kt
@@ -0,0 +1,109 @@
+package io.agora.chatdemo.callkit
+
+import android.app.Activity
+import android.app.Application
+import android.content.Intent
+import android.os.Bundle
+import android.util.Log
+import io.agora.chat.callkit.general.EaseCallFloatWindow
+import io.agora.chatdemo.MainActivity
+import io.agora.chatdemo.base.ActivityState
+import io.agora.chatdemo.callkit.extensions.isTargetActivity
+import io.agora.chatdemo.common.extensions.internal.makeTaskToFront
+import io.agora.chatdemo.page.splash.SplashActivity
+
+class CallKitActivityLifecycleCallback: Application.ActivityLifecycleCallbacks, ActivityState {
+    private val resumeActivity = mutableListOf<Activity>()
+    override fun onActivityCreated(activity: Activity, savedInstanceState: Bundle?) {
+        activityList.add(0, activity)
+        if (activity is MainActivity) {
+            CallKitManager.receiveCallPush(activity)
+        }
+    }
+
+    override fun onActivityStarted(activity: Activity) {
+
+    }
+
+    override fun onActivityResumed(activity: Activity) {
+        if (!resumeActivity.contains(activity)) {
+            resumeActivity.add(activity)
+            restartSingleInstanceActivity(activity)
+        }
+    }
+
+    override fun onActivityPaused(activity: Activity) {
+
+    }
+
+    override fun onActivityStopped(activity: Activity) {
+        resumeActivity.remove(activity)
+        if (resumeActivity.isEmpty()) {
+            val a = getOtherTaskSingleInstanceActivity(activity.taskId)
+            if (a != null && a.isTargetActivity() && !EaseCallFloatWindow.getInstance().isShowing) {
+                a.makeTaskToFront()
+            }
+            Log.e("ActivityLifecycle", "在后台了")
+        }
+    }
+
+    override fun onActivitySaveInstanceState(activity: Activity, outState: Bundle) {
+
+    }
+
+    override fun onActivityDestroyed(activity: Activity) {
+        activityList.remove(activity)
+    }
+
+    override fun current(): Activity? {
+        return if (activityList.size > 0) activityList[0] else null
+    }
+
+    override val activityList: MutableList<Activity>
+        get() = mutableListOf()
+
+    override fun count(): Int {
+        return activityList.size
+    }
+
+    override val isFront: Boolean
+        get() = resumeActivity.size > 0
+
+    private fun getOtherTaskSingleInstanceActivity(taskId: Int): Activity? {
+        if (taskId != 0 && activityList.size > 1) {
+            for (activity in activityList) {
+                if (activity.taskId != taskId) {
+                    if (activity.isTargetActivity()) {
+                        return activity
+                    }
+                }
+            }
+        }
+        return null
+    }
+
+    /**
+     * 用于按下home键，点击图标，检查启动模式是singleInstance，且在activity列表中首位的Activity
+     * 下面的方法，专用于解决启动模式是singleInstance, 为开启悬浮框的情况
+     * @param activity
+     */
+    private fun restartSingleInstanceActivity(activity: Activity) {
+        val isClickByFloat = activity.intent.getBooleanExtra("isClickByFloat", false)
+        if (isClickByFloat) {
+            return
+        }
+        //刚启动，或者从桌面返回app
+        if (resumeActivity.size == 1 && resumeActivity[0] is SplashActivity) {
+            return
+        }
+        //至少需要activityList中至少两个activity
+        if (resumeActivity.size >= 1 && activityList.size > 1) {
+            val a = getOtherTaskSingleInstanceActivity(resumeActivity[0].taskId)
+            if (//当前activity和列表中首个activity不相同
+                a != null && !a.isFinishing && a !== activity && a.taskId != activity.taskId && !EaseCallFloatWindow.getInstance().isShowing) {
+                Log.e("ActivityLifecycle", "启动了activity = " + a.javaClass.name)
+                activity.startActivity(Intent(activity, a.javaClass))
+            }
+        }
+    }
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/callkit/CallKitManager.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/callkit/CallKitManager.kt
new file mode 100644
index 00000000..92995787
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/callkit/CallKitManager.kt
@@ -0,0 +1,303 @@
+package io.agora.chatdemo.callkit
+
+import android.app.Application
+import android.content.Context
+import android.content.Intent
+import androidx.core.content.ContextCompat
+import androidx.fragment.app.FragmentActivity
+import io.agora.chat.callkit.EaseCallKit
+import io.agora.chat.callkit.bean.EaseCallUserInfo
+import io.agora.chat.callkit.bean.EaseUserAccount
+import io.agora.chat.callkit.general.EaseCallKitConfig
+import io.agora.chat.callkit.general.EaseCallType
+import io.agora.chat.callkit.listener.EaseCallGetUserAccountCallback
+import io.agora.chat.callkit.listener.EaseCallKitTokenCallback
+import io.agora.chatdemo.BuildConfig
+import io.agora.chatdemo.R
+import io.agora.chatdemo.callkit.activity.CallMultipleBaseActivity
+import io.agora.chatdemo.callkit.activity.CallSingleBaseActivity
+import io.agora.chatdemo.callkit.activity.CallMultipleInviteActivity
+import io.agora.uikit.EaseIM
+import io.agora.uikit.common.ChatError
+import io.agora.uikit.common.ChatHttpClientManagerBuilder
+import io.agora.uikit.common.ChatHttpResponse
+import io.agora.uikit.common.ChatLog
+import io.agora.uikit.common.dialog.SimpleListSheetDialog
+import io.agora.uikit.common.dialog.SimpleSheetType
+import io.agora.uikit.common.extensions.toUser
+import io.agora.uikit.feature.chat.enums.EaseChatType
+import io.agora.uikit.interfaces.SimpleListSheetItemClickListener
+import io.agora.uikit.model.EaseMenuItem
+import io.agora.uikit.model.EaseUser
+import io.agora.uikit.model.getNickname
+import io.agora.uikit.provider.getSyncUser
+import kotlinx.coroutines.CoroutineScope
+import kotlinx.coroutines.Dispatchers
+import kotlinx.coroutines.launch
+import org.json.JSONObject
+
+object CallKitManager {
+
+    /**
+     * Whether it is a rtc call.
+     */
+    var isRtcCall = false
+
+    /**
+     * Rtc call type.
+     */
+    var rtcType = 0
+
+    /**
+     * If multiple call, should set groupId.
+     */
+    var currentCallGroupId: String? = null
+
+    var channelName: String? = null
+
+    private const val TAG = "CallKitManager"
+    private const val RESULT_PARAM_TOKEN = "accessToken"
+    private const val RESULT_PARAM_UID = "agoraUid"
+    private const val RESULT_PARAM_RESULT = "result"
+    const val KEY_GROUP_ID = "groupId"
+    const val KEY_CALL_TYPE = "easeCallType"
+    const val KEY_INVITE_PARAMS = "invite_params"
+    const val EXTRA_CONFERENCE_GROUP_ID = "groupId"
+    const val EXTRA_CONFERENCE_GROUP_EXIT_MEMBERS = "existMembers"
+
+
+    fun init(context: Context) {
+        EaseCallKitConfig().apply {
+            callTimeOut = 30
+            agoraAppId = BuildConfig.AGORA_APPID
+            isEnableRTCToken = true
+            defaultHeadImage = EaseIM.getCurrentUser()?.avatar
+            EaseCallKit.getInstance().init(context,this)
+        }
+        (context.applicationContext as Application).registerActivityLifecycleCallbacks(CallKitActivityLifecycleCallback())
+        // Register the activities which you have registered in manifest
+        EaseCallKit.getInstance().registerVideoCallClass(CallSingleBaseActivity::class.java)
+        EaseCallKit.getInstance().registerMultipleVideoClass(CallMultipleBaseActivity::class.java)
+        val callKitListener = DemoCallKitListener(context)
+        EaseCallKit.getInstance().setCallKitListener(callKitListener)
+    }
+
+    /**
+     * Show single chat video call dialog.
+     */
+    fun showSelectDialog(type: EaseChatType?, context: Context, conversationId: String?) {
+        val context = (context as FragmentActivity)
+        val mutableListOf = mutableListOf(
+            EaseMenuItem(
+                menuId = R.id.chat_video_call_voice,
+                title = context.getString(R.string.voice_call),
+                resourceId = R.drawable.phone_pick,
+                titleColor = ContextCompat.getColor(context, R.color.color_primary),
+                resourceTintColor = ContextCompat.getColor(context, R.color.color_primary)
+            ),
+            EaseMenuItem(
+                menuId = R.id.chat_video_call_video,
+                title = context.getString(R.string.video_call),
+                resourceId =  R.drawable.video_camera,
+                titleColor = ContextCompat.getColor(context, R.color.color_primary),
+                resourceTintColor = ContextCompat.getColor(context, R.color.color_primary)
+            ),
+        )
+        val dialog = SimpleListSheetDialog(
+            context = context,
+            itemList = mutableListOf,
+            type = SimpleSheetType.ITEM_LAYOUT_DIRECTION_START)
+        dialog.setSimpleListSheetItemClickListener(object : SimpleListSheetItemClickListener {
+            override fun onItemClickListener(position: Int, menu: EaseMenuItem) {
+                dialog.dismiss()
+                when(menu.menuId){
+                    R.id.chat_video_call_voice -> {
+                        type?.let {
+                            if (it == EaseChatType.SINGLE_CHAT){
+                                startSingleAudioCall(conversationId)
+                            }else{
+                                startConferenceCall(EaseCallType.CONFERENCE_VOICE_CALL,context, conversationId)
+                            }
+                        }
+                    }
+                    R.id.chat_video_call_video -> {
+                        type?.let {
+                            if (it == EaseChatType.SINGLE_CHAT){
+                                startSingleVideoCall(conversationId)
+                            }else{
+                                startConferenceCall(EaseCallType.CONFERENCE_VIDEO_CALL, context, conversationId)
+                            }
+                        }
+                    }
+                    else -> {}
+                }
+            }
+        })
+        context.supportFragmentManager.let { dialog.show(it,"video_call_dialog") }
+    }
+
+    /**
+     * Start single audio call.
+     */
+    fun startSingleAudioCall(conversationId: String?) {
+        channelName = ""
+        rtcType = EaseCallType.SINGLE_VOICE_CALL.ordinal
+        EaseCallKit.getInstance().startSingleCall(
+            EaseCallType.SINGLE_VOICE_CALL, conversationId, null,
+            CallSingleBaseActivity::class.java
+        )
+    }
+
+    /**
+     * Start single video call.
+     */
+    fun startSingleVideoCall(conversationId: String?) {
+        channelName = ""
+        rtcType = EaseCallType.SINGLE_VIDEO_CALL.ordinal
+        EaseCallKit.getInstance().startSingleCall(
+            EaseCallType.SINGLE_VIDEO_CALL, conversationId, null,
+            CallSingleBaseActivity::class.java
+        )
+    }
+
+
+    /**
+     * Receive call push.
+     */
+    fun receiveCallPush(context: Context) {
+        if (isRtcCall) {
+            if (EaseCallType.getfrom(rtcType) != EaseCallType.CONFERENCE_VIDEO_CALL &&  EaseCallType.getfrom(rtcType) !=EaseCallType.CONFERENCE_VOICE_CALL) {
+                startVideoCallActivity(context)
+            } else {
+                startMultipleVideoActivity(context)
+            }
+            isRtcCall = false
+        }
+    }
+
+    private fun startVideoCallActivity(context: Context) {
+        rtcType = EaseCallType.SINGLE_VIDEO_CALL.ordinal
+        Intent(context, CallSingleBaseActivity::class.java).apply {
+            addFlags(Intent.FLAG_ACTIVITY_NEW_TASK)
+            context.startActivity(this)
+        }
+    }
+
+    private fun startMultipleVideoActivity(context: Context) {
+        rtcType = EaseCallType.CONFERENCE_VIDEO_CALL.ordinal
+        Intent(context, CallMultipleBaseActivity::class.java).apply {
+            addFlags(Intent.FLAG_ACTIVITY_NEW_TASK)
+            context.startActivity(this)
+        }
+    }
+
+    /**
+     * Start conference call.
+     */
+    fun startConferenceCall(callType:EaseCallType,context: Context, groupId: String?) {
+        rtcType = callType.ordinal
+        val intent = Intent(context, CallMultipleInviteActivity::class.java)
+        intent.putExtra(EXTRA_CONFERENCE_GROUP_ID, groupId)
+        context.startActivity(intent)
+    }
+
+
+    /**
+     * Get rtc token from server.
+     */
+    fun getRtcToken(tokenUrl: String, callback: EaseCallKitTokenCallback?) {
+        executeGetRequest(tokenUrl) {
+            it?.let { response ->
+                ChatLog.d(TAG, "getRtcToken: url:$tokenUrl ${response.code}, ${response.content}")
+                if (response.code == 200) {
+                    response.content?.let { body ->
+                        try {
+                            val result = JSONObject(body)
+                            val token = result.getString(RESULT_PARAM_TOKEN)
+                            val uid = result.getInt(RESULT_PARAM_UID)
+                            EaseIM.getCurrentUser()?.let { profile->
+                                setEaseCallKitUserInfo(profile.id)
+                            }
+                            callback?.onSetToken(token, uid)
+                        } catch (e: Exception) {
+                            e.stackTrace
+                            callback?.onGetTokenError(ChatError.GENERAL_ERROR, e.message)
+                        }
+                    }
+                } else {
+                    callback?.onGetTokenError(response.code, response.content)
+                }
+            } ?: kotlin.run {
+                callback?.onSetToken(null, 0)
+            }
+        }
+    }
+
+    fun getUserIdByAgoraUid(uId:Int,url: String, callback: EaseCallGetUserAccountCallback?) {
+        executeGetRequest(url) {
+            it?.let { response ->
+                ChatLog.d(TAG, "getAllUsersByUid: url:$url ${response.code}, ${response.content}")
+                if (response.code == 200) {
+                    response.content?.let { body ->
+                        try {
+                            val result = JSONObject(body)
+                            val userList = result.getJSONObject(RESULT_PARAM_RESULT)
+                            var account: EaseUserAccount? = null
+                            userList.keys().forEach { uIdStr ->
+                                val uid = Integer.valueOf(uIdStr)
+                                val userId = userList.optString(uIdStr)
+                                // Set user info to call kit.
+                                CallUserInfo(userId).getUserInfo(currentCallGroupId).parse().apply {
+                                    EaseCallKit.getInstance().callKitConfig.setUserInfo(userId, this)
+                                }
+                                if (uid == uId || uid == 0){
+                                    account = EaseUserAccount(uIdStr.toInt(), userId)
+                                }
+                            }
+                            callback?.onUserAccount(account)
+                        } catch (e: Exception) {
+                            e.stackTrace
+                            callback?.onSetUserAccountError(ChatError.GENERAL_ERROR, e.message)
+                        }
+                    }
+                } else {
+                    callback?.onSetUserAccountError(response.code, response.content)
+                }
+            } ?: kotlin.run {
+                callback?.onSetUserAccountError(ChatError.GENERAL_ERROR, "response is null")
+            }
+        }
+    }
+
+    /**
+     * Base get request.
+     */
+    private fun executeGetRequest(url: String, callback: (ChatHttpResponse?) -> Unit) {
+        CoroutineScope(Dispatchers.IO).launch {
+            ChatHttpClientManagerBuilder()
+                .get()
+                .setUrl(url)
+                .withToken(true)
+                .execute()?.let { response ->
+                    callback(response)
+                } ?: kotlin.run {
+                callback(null)
+            }
+        }
+    }
+
+    fun setEaseCallKitUserInfo(userName: String) {
+        val user: EaseUser? = EaseIM.getUserProvider()?.getSyncUser(userName)?.toUser()
+        val userInfo = EaseCallUserInfo()
+        user?.let {
+            userInfo.nickName = user.getNickname()?:userName
+            userInfo.headImage = user.avatar
+        }
+        EaseCallKit.getInstance().callKitConfig.setUserInfo(userName, userInfo)
+    }
+
+    fun checkChannelNameNullOrEmpty():Boolean{
+        return channelName.isNullOrEmpty()
+    }
+
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/callkit/CallUserInfo.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/callkit/CallUserInfo.kt
new file mode 100644
index 00000000..2799497d
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/callkit/CallUserInfo.kt
@@ -0,0 +1,40 @@
+package io.agora.chatdemo.callkit
+
+import android.util.Log
+import io.agora.chat.callkit.bean.EaseCallUserInfo
+import io.agora.uikit.EaseIM
+import io.agora.uikit.model.EaseProfile
+import io.agora.uikit.provider.getSyncUser
+
+
+data class CallUserInfo(
+    val userId: String?,
+    var nickName: String? = null,
+    var headImage: String? = null
+)
+
+internal fun CallUserInfo.getUserInfo(groupId: String?): CallUserInfo {
+    return if (!groupId.isNullOrEmpty()) {
+        EaseProfile.getGroupMember(groupId, this.userId)?.let {
+            this.nickName = it.getNotEmptyName()
+            this.headImage = it.avatar
+        }
+        this
+    } else {
+        EaseIM.getUserProvider()?.getSyncUser(this.userId)?.let {
+            this.nickName = it.getNotEmptyName()
+            this.headImage = it.avatar
+        }
+        this
+    }
+}
+
+/**
+ * Parse to EaseCallUserInfo.
+ */
+internal fun CallUserInfo.parse(): EaseCallUserInfo {
+    return EaseCallUserInfo(nickName, headImage).let {
+        it.userId = this.userId
+        it
+    }
+}
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/callkit/ChatVoiceCallViewHolder.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/callkit/ChatVoiceCallViewHolder.kt
new file mode 100644
index 00000000..1d392c92
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/callkit/ChatVoiceCallViewHolder.kt
@@ -0,0 +1,48 @@
+package io.agora.chatdemo.callkit
+
+import android.view.View
+import io.agora.chat.callkit.EaseCallKit
+import io.agora.chat.callkit.general.EaseCallType
+import io.agora.chat.callkit.utils.EaseCallMsgUtils
+import io.agora.chatdemo.callkit.activity.CallSingleBaseActivity
+import io.agora.uikit.common.ChatMessage
+import io.agora.uikit.common.ChatMessageDirection
+import io.agora.uikit.feature.chat.viewholders.EaseChatRowViewHolder
+
+class ChatVoiceCallViewHolder(itemView: View): EaseChatRowViewHolder(itemView) {
+
+    override fun onBubbleClick(message: ChatMessage?) {
+        super.onBubbleClick(message)
+        message?.let {
+            if (it.getIntAttribute(EaseCallMsgUtils.CALL_TYPE, 0) == EaseCallType.SINGLE_VOICE_CALL.ordinal) {
+                if (it.direct() == ChatMessageDirection.RECEIVE) {
+                    // answer call
+                    EaseCallKit.getInstance().startSingleCall(
+                        EaseCallType.SINGLE_VOICE_CALL, message.from, null,
+                        CallSingleBaseActivity::class.java
+                    )
+                } else {
+                    // make call
+                    EaseCallKit.getInstance().startSingleCall(
+                        EaseCallType.SINGLE_VOICE_CALL, message.to, null,
+                        CallSingleBaseActivity::class.java
+                    )
+                }
+            } else {
+                if (it.direct() == ChatMessageDirection.RECEIVE) {
+                    // answer call
+                    EaseCallKit.getInstance().startSingleCall(
+                        EaseCallType.SINGLE_VIDEO_CALL, message.from, null,
+                        CallSingleBaseActivity::class.java
+                    )
+                } else {
+                    // make call
+                    EaseCallKit.getInstance().startSingleCall(
+                        EaseCallType.SINGLE_VIDEO_CALL, message.to, null,
+                        CallSingleBaseActivity::class.java
+                    )
+                }
+            }
+        }
+    }
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/callkit/DemoCallKitListener.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/callkit/DemoCallKitListener.kt
new file mode 100644
index 00000000..f2bdf8a9
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/callkit/DemoCallKitListener.kt
@@ -0,0 +1,182 @@
+package io.agora.chatdemo.callkit
+
+import android.content.Context
+import android.content.Intent
+import android.os.Handler
+import android.os.Looper
+import android.os.Message
+import android.text.SpannableStringBuilder
+import com.hyphenate.chatdemo.callkit.extensions.getStringOrNull
+import io.agora.chat.callkit.EaseCallKit
+import io.agora.chat.callkit.bean.EaseUserAccount
+import io.agora.chat.callkit.general.EaseCallEndReason
+import io.agora.chat.callkit.general.EaseCallError
+import io.agora.chat.callkit.general.EaseCallType
+import io.agora.chat.callkit.listener.EaseCallGetUserAccountCallback
+import io.agora.chat.callkit.listener.EaseCallKitListener
+import io.agora.chat.callkit.listener.EaseCallKitTokenCallback
+import io.agora.chatdemo.BuildConfig
+import io.agora.chatdemo.DemoHelper
+import io.agora.chatdemo.R
+import io.agora.chatdemo.callkit.activity.CallMultipleInviteActivity
+import io.agora.chatdemo.common.DemoConstant
+import io.agora.chatdemo.utils.ToastUtils.showToast
+import io.agora.uikit.EaseIM
+import io.agora.uikit.common.ChatClient
+import io.agora.uikit.common.bus.EaseFlowBus
+import io.agora.uikit.common.extensions.mainScope
+import io.agora.uikit.model.EaseEvent
+import io.agora.uikit.provider.getSyncUser
+import io.agora.util.EMLog
+import org.json.JSONObject
+import java.text.SimpleDateFormat
+import java.util.TimeZone
+
+class DemoCallKitListener(val mContext: Context): EaseCallKitListener {
+
+    companion object{
+        private val TAG = DemoCallKitListener::class.java.simpleName
+        private const val PARAM_USER = "userAccount="
+        private const val PARAM_CHANNEL_NAME = "channelName="
+    }
+
+
+    //The URL here is for the demo example, and the actual project users should obtain it from their App Server
+    private val FETCH_TOKEN_URL = BuildConfig.APP_SERVER_PROTOCOL+ "://" + BuildConfig.APP_SERVER_DOMAIN + BuildConfig.APP_RTC_TOKEN_URL
+    private val FETCH_USER_MAPPER = BuildConfig.APP_SERVER_PROTOCOL+ "://" + BuildConfig.APP_SERVER_DOMAIN + BuildConfig.APP_RTC_CHANNEL_MAPPER_URL
+
+    private val handler: Handler = object : Handler(Looper.getMainLooper()) {
+        override fun handleMessage(msg: Message) {
+            super.handleMessage(msg)
+            val obj = msg.obj
+            if (obj is String) {
+                showToast(obj)
+            }
+        }
+    }
+
+    override fun onInviteUsers(
+        callType: EaseCallType?,
+        users: Array<String>?,
+        ext: JSONObject?
+    ) {
+        CallKitManager.currentCallGroupId = ext?.getStringOrNull(CallKitManager.KEY_GROUP_ID)
+        Intent(mContext, CallMultipleInviteActivity::class.java).apply {
+            addFlags(Intent.FLAG_ACTIVITY_NEW_TASK)
+            putExtra(CallKitManager.EXTRA_CONFERENCE_GROUP_ID,CallKitManager.currentCallGroupId)
+            putExtra(CallKitManager.EXTRA_CONFERENCE_GROUP_EXIT_MEMBERS,users)
+            mContext.startActivity(this)
+        }
+    }
+
+    override fun onEndCallWithReason(
+        callType: EaseCallType?,
+        channelName: String?,
+        reason: EaseCallEndReason,
+        callTime: Long
+    ) {
+        EMLog.d( TAG,
+            "onEndCallWithReason" + (callType?.name
+                ?: " callType is null ") + " reason:" + reason + " time:" + callTime
+        )
+        val formatter = SimpleDateFormat("mm:ss")
+        formatter.timeZone = TimeZone.getTimeZone("UTC")
+        val callString: String = mContext.getString(R.string.call_duration,(formatter.format(callTime))?:"")
+        val message = handler.obtainMessage()
+        when (reason) {
+            EaseCallEndReason.EaseCallEndReasonHangup -> message.obj = callString
+            EaseCallEndReason.EaseCallEndReasonCancel -> {}
+            EaseCallEndReason.EaseCallEndReasonRemoteCancel -> message.obj = callString
+            EaseCallEndReason.EaseCallEndReasonRefuse -> message.obj =
+                mContext.getString(R.string.demo_call_end_reason_refuse)
+
+            EaseCallEndReason.EaseCallEndReasonBusy -> message.obj =
+                mContext.getString(R.string.demo_call_end_reason_busy)
+
+            EaseCallEndReason.EaseCallEndReasonNoResponse -> {}
+            EaseCallEndReason.EaseCallEndReasonRemoteNoResponse -> message.obj =
+                mContext.getString(R.string.demo_call_end_reason_busy_remote_no_response)
+
+            EaseCallEndReason.EaseCallEndReasonHandleOnOtherDeviceAgreed -> message.obj =
+                mContext.getString(R.string.demo_call_end_reason_other_device_agreed)
+
+            EaseCallEndReason.EaseCallEndReasonHandleOnOtherDeviceRefused -> message.obj =
+                mContext.getString(R.string.demo_call_end_reason_other_device_refused)
+        }
+        CallKitManager.channelName = ""
+        handler.sendMessage(message)
+    }
+
+    override fun onGenerateRTCToken(
+        userAccount: String,
+        channelName: String,
+        callback: EaseCallKitTokenCallback
+    ) {
+        val agoraUid: Int =DemoHelper.getInstance().getDataModel().getCurrentUserAgoraUid()
+        CallKitManager.channelName = channelName
+        EMLog.d(TAG, "onGenerateToken userId:$userAccount channelName:$channelName agoraUid:$agoraUid")
+        SpannableStringBuilder(FETCH_TOKEN_URL).apply {
+            append("/$channelName?$PARAM_USER$userAccount")
+            CallKitManager.getRtcToken(this.toString(), callback)
+        }
+    }
+
+    override fun onReceivedCall(callType: EaseCallType, fromUserId: String, ext: JSONObject?) {
+        EMLog.d(TAG, "onRecivedCall" + callType.name + " fromUserId:" + fromUserId)
+        ext?.getStringOrNull(CallKitManager.KEY_GROUP_ID)?.let { groupId ->
+            CallKitManager.currentCallGroupId = groupId
+            CallUserInfo(fromUserId).getUserInfo(groupId).parse().apply {
+                EaseCallKit.getInstance().callKitConfig.setUserInfo(userId, this)
+            }
+        } ?: kotlin.run {
+            CallKitManager.currentCallGroupId = null
+            CallUserInfo(fromUserId).apply {
+                EaseIM.getUserProvider()?.getSyncUser(userId)?.let { user ->
+                    this.nickName = user.getNotEmptyName()
+                    this.headImage = user.avatar
+                }
+                EaseCallKit.getInstance().callKitConfig.setUserInfo(userId, this.parse())
+            } // Single call
+        }
+    }
+
+    override fun onCallError(type: EaseCallError, errorCode: Int, description: String) {
+        EMLog.d(TAG, "onCallError" + type.name + " description:" + description)
+        if (type == EaseCallError.PROCESS_ERROR) {
+            showToast(description)
+        }
+    }
+
+    override fun onInViteCallMessageSent() {
+        if (ChatClient.getInstance().options.isIncludeSendMessageInMessageListener.not()) {
+            EaseFlowBus.with<EaseEvent>(EaseEvent.EVENT.ADD + EaseEvent.TYPE.MESSAGE)
+                .post(DemoHelper.getInstance().context.mainScope(), EaseEvent(DemoConstant.CALL_INVITE_MESSAGE, EaseEvent.TYPE.MESSAGE))
+        }
+    }
+
+    override fun onRemoteUserJoinChannel(
+        channelName: String?,
+        userName: String?,
+        uid: Int,
+        callback: EaseCallGetUserAccountCallback
+    ) {
+        // Only multi call callback this method
+        if (userName.isNullOrEmpty()) {
+            SpannableStringBuilder(FETCH_USER_MAPPER).apply {
+                append("?$PARAM_CHANNEL_NAME$channelName")
+                CallKitManager.getUserIdByAgoraUid(uid,this.toString(), callback)
+            }
+        } else {
+            // Set user info to call kit.
+            CallUserInfo(userName).getUserInfo(CallKitManager.currentCallGroupId).parse().apply {
+                EaseCallKit.getInstance().callKitConfig.setUserInfo(userId, this)
+            }
+            callback.onUserAccount(EaseUserAccount(uid, userName))
+        }
+    }
+
+    override fun onUserInfoUpdate(userName: String) {
+        //set user's nickname and avater
+        CallKitManager.setEaseCallKitUserInfo(userName)
+    }
+}
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/callkit/MultipleInviteViewHolder.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/callkit/MultipleInviteViewHolder.kt
new file mode 100644
index 00000000..d9f3215d
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/callkit/MultipleInviteViewHolder.kt
@@ -0,0 +1,6 @@
+package io.agora.chatdemo.callkit
+
+import android.view.View
+import io.agora.uikit.feature.chat.viewholders.EaseChatRowViewHolder
+
+class MultipleInviteViewHolder(itemView: View): EaseChatRowViewHolder(itemView)
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/callkit/activity/CallMultipleBaseActivity.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/callkit/activity/CallMultipleBaseActivity.kt
new file mode 100644
index 00000000..4862d808
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/callkit/activity/CallMultipleBaseActivity.kt
@@ -0,0 +1,14 @@
+package io.agora.chatdemo.callkit.activity
+
+import android.graphics.Color
+import io.agora.chat.callkit.ui.EaseCallMultipleBaseActivity
+import io.agora.chatdemo.callkit.extensions.setFitSystemForTheme
+import io.agora.uikit.common.utils.StatusBarCompat
+
+class CallMultipleBaseActivity : EaseCallMultipleBaseActivity() {
+    override fun initView() {
+        setFitSystemForTheme(true)
+        StatusBarCompat.compat(this, Color.parseColor("#858585"))
+        super.initView()
+    }
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/callkit/activity/CallMultipleInviteActivity.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/callkit/activity/CallMultipleInviteActivity.kt
new file mode 100644
index 00000000..35180094
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/callkit/activity/CallMultipleInviteActivity.kt
@@ -0,0 +1,131 @@
+package io.agora.chatdemo.callkit.activity
+
+import android.content.Intent
+import android.os.Bundle
+import android.text.SpannableStringBuilder
+import android.text.Spanned
+import android.text.style.ForegroundColorSpan
+import android.util.Log
+import android.view.KeyEvent
+import android.view.LayoutInflater
+import android.view.View
+import androidx.core.content.ContextCompat
+import io.agora.chat.callkit.EaseCallKit
+import io.agora.chat.callkit.general.EaseCallType
+import io.agora.chatdemo.R
+import io.agora.chatdemo.base.BaseInitActivity
+import io.agora.chatdemo.callkit.CallKitManager
+import io.agora.chatdemo.callkit.fragment.ConferenceInviteFragment
+import io.agora.chatdemo.databinding.DemoActivityConferenceInviteBinding
+import io.agora.chatdemo.utils.ToastUtils.showToast
+import io.agora.uikit.EaseIM
+import io.agora.uikit.common.ChatClient
+import io.agora.uikit.common.ChatLog
+import io.agora.uikit.interfaces.OnContactSelectedListener
+
+class CallMultipleInviteActivity: BaseInitActivity<DemoActivityConferenceInviteBinding>() {
+    private val existMembers = mutableListOf<String>()
+    private var groupId: String? = null
+    private var selectedMembers:MutableList<String> = mutableListOf()
+    private var isFirstMeeting:Boolean = true
+
+    companion object {
+        private const val TAG = "ConferenceInvite"
+    }
+
+    override fun getViewBinding(inflater: LayoutInflater): DemoActivityConferenceInviteBinding? {
+        return DemoActivityConferenceInviteBinding.inflate(inflater)
+    }
+
+    override fun initIntent(intent: Intent?) {
+        super.initIntent(intent)
+        isFirstMeeting = true
+        intent?.let {
+            groupId = it.getStringExtra(CallKitManager.EXTRA_CONFERENCE_GROUP_ID)
+            it.getStringArrayExtra(CallKitManager.EXTRA_CONFERENCE_GROUP_EXIT_MEMBERS)?.let { members->
+                if (members.isNotEmpty()) {
+                    existMembers.addAll(members)
+                }
+                if (!existMembers.contains(EaseIM.getCurrentUser()?.id)){
+                    existMembers.add(ChatClient.getInstance().currentUser)
+                }
+            }?: kotlin.run {
+                existMembers.add(ChatClient.getInstance().currentUser)
+            }
+        }
+    }
+
+    override fun initView(savedInstanceState: Bundle?) {
+        super.initView(savedInstanceState)
+        if (groupId.isNullOrEmpty()) {
+            ChatLog.e(TAG, "groupId is null or empty")
+            finish()
+            return
+        }
+
+        val fragment = ConferenceInviteFragment.newInstance(groupId!!, existMembers)
+        fragment.setOnGroupMemberSelectedListener(object : OnContactSelectedListener {
+            override fun onContactSelectedChanged(v: View, selectedMembers: MutableList<String>) {
+                this@CallMultipleInviteActivity.selectedMembers = selectedMembers
+                resetMenuInfo(selectedMembers.size)
+            }
+        })
+        supportFragmentManager.beginTransaction().replace(binding.flFragment.id, fragment).commit()
+
+        resetMenuInfo(selectedMembers.size)
+    }
+
+    private fun resetMenuInfo(size: Int) {
+        binding.titleBar.getToolBar().menu.findItem(R.id.chat_menu_member_call).let {
+            it.isEnabled = size  > 0
+            it.title = getString(R.string.menu_member_call, size)
+            it.title?.let { title->
+                if (it.isEnabled) {
+                    SpannableStringBuilder(title).let { span ->
+                        span.setSpan(ForegroundColorSpan(ContextCompat.getColor(mContext, R.color.color_primary))
+                            , 0, span.length, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE)
+                        it.title = span
+                    }
+                }
+            }
+        }
+    }
+
+    override fun initListener() {
+        super.initListener()
+
+        binding.titleBar.setOnMenuItemClickListener { item ->
+            when(item.itemId) {
+                R.id.chat_menu_member_call -> {
+                    if (selectedMembers.isEmpty()) {
+                        showToast(R.string.tips_select_contacts_first)
+                        return@setOnMenuItemClickListener true
+                    }
+                    isFirstMeeting = false
+                    val members = selectedMembers.toTypedArray()
+                    val params: Map<String, Any> = mutableMapOf(CallKitManager.KEY_GROUP_ID to groupId!!)
+                    EaseCallKit.getInstance().startInviteMultipleCall(EaseCallType.getfrom(CallKitManager.rtcType),members, params)
+                    finish()
+                    true
+                }
+                else -> false
+            }
+        }
+        binding.titleBar.setNavigationOnClickListener {
+            selectedMembers.clear()
+            setResult(RESULT_CANCELED)
+            onBackPressed()
+            if ((!isFirstMeeting || !CallMultipleBaseActivity().isFinishing) && !CallKitManager.checkChannelNameNullOrEmpty() ){
+                EaseCallKit.getInstance().startInviteMultipleCall(EaseCallType.getfrom(CallKitManager.rtcType),null, null)
+            }
+        }
+    }
+
+    override fun onKeyDown(keyCode: Int, event: KeyEvent?): Boolean {
+        if (keyCode == KeyEvent.KEYCODE_BACK) {
+            onBackPressed()
+        }
+        return super.onKeyDown(keyCode, event)
+    }
+
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/callkit/activity/CallSingleBaseActivity.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/callkit/activity/CallSingleBaseActivity.kt
new file mode 100644
index 00000000..d7695fe9
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/callkit/activity/CallSingleBaseActivity.kt
@@ -0,0 +1,24 @@
+package io.agora.chatdemo.callkit.activity
+
+import android.graphics.Color
+import androidx.constraintlayout.widget.ConstraintLayout
+import io.agora.chat.callkit.general.EaseCallType
+import io.agora.chat.callkit.ui.EaseCallSingleBaseActivity
+import io.agora.chat.callkit.R
+import io.agora.chatdemo.callkit.extensions.setFitSystemForTheme
+import io.agora.uikit.common.utils.StatusBarCompat
+
+class CallSingleBaseActivity: EaseCallSingleBaseActivity() {
+    override fun initView() {
+        setFitSystemForTheme(true)
+        if (callType == EaseCallType.SINGLE_VIDEO_CALL) {
+            StatusBarCompat.compat(this, Color.parseColor("#000000"))
+        } else {
+            StatusBarCompat.compat(this, Color.parseColor("#bbbbbb"))
+        }
+        super.initView()
+        val rootLayout = findViewById<ConstraintLayout>(R.id.root_layout)
+        rootLayout.setBackgroundColor(resources.getColor(io.agora.uikit.R.color.ease_neutral_10))
+    }
+
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/callkit/adapter/ConferenceInviteAdapter.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/callkit/adapter/ConferenceInviteAdapter.kt
new file mode 100644
index 00000000..557887b3
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/callkit/adapter/ConferenceInviteAdapter.kt
@@ -0,0 +1,44 @@
+package io.agora.chatdemo.callkit.adapter
+
+import android.view.LayoutInflater
+import android.view.ViewGroup
+import io.agora.chatdemo.callkit.holder.ConferenceMemberSelectViewHolder
+import io.agora.uikit.base.EaseBaseRecyclerViewAdapter
+import io.agora.uikit.databinding.EaseLayoutGroupSelectContactBinding
+import io.agora.uikit.feature.search.interfaces.OnContactSelectListener
+import io.agora.uikit.model.EaseUser
+
+class ConferenceInviteAdapter(private val groupId: String?): EaseBaseRecyclerViewAdapter<EaseUser>() {
+    private var selectedListener: OnContactSelectListener? = null
+    private var existMembers:MutableList<String> = mutableListOf()
+    private val checkedList:MutableList<String> = mutableListOf()
+
+    override fun getViewHolder(parent: ViewGroup, viewType: Int): ViewHolder<EaseUser> {
+        return ConferenceMemberSelectViewHolder(groupId, checkedList,
+                EaseLayoutGroupSelectContactBinding.inflate(LayoutInflater.from(parent.context),
+                    parent, false)
+            )
+    }
+
+    override fun onBindViewHolder(holder: ViewHolder<EaseUser>, position: Int) {
+        if (holder is ConferenceMemberSelectViewHolder){
+            holder.setSelectedMembers(existMembers)
+            holder.setCheckBoxSelectListener(selectedListener)
+        }
+        super.onBindViewHolder(holder, position)
+    }
+
+    fun setExistMembers(existMembers:MutableList<String>){
+        this.existMembers = existMembers
+        notifyDataSetChanged()
+    }
+
+    /**
+     * Set the listener for the checkbox selection.
+     */
+    fun setCheckBoxSelectListener(listener: OnContactSelectListener){
+        this.selectedListener = listener
+        notifyDataSetChanged()
+    }
+
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/callkit/extensions/Activity.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/callkit/extensions/Activity.kt
new file mode 100644
index 00000000..ae4c2a21
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/callkit/extensions/Activity.kt
@@ -0,0 +1,88 @@
+package io.agora.chatdemo.callkit.extensions
+
+import android.app.Activity
+import android.graphics.Color
+import android.os.Build
+import android.text.TextUtils
+import android.view.View
+import android.view.ViewGroup
+import android.view.Window
+import android.view.WindowManager
+import androidx.annotation.ColorInt
+import androidx.appcompat.app.AppCompatDelegate
+import androidx.core.content.ContextCompat
+import io.agora.chatdemo.R
+import io.agora.uikit.common.utils.StatusBarCompat
+
+/**
+ * Check if the current activity is the target activity.
+ */
+internal fun Activity.isTargetActivity(): Boolean {
+    if (TextUtils.equals(title, getString(R.string.demo_activity_label_video_call))
+        || TextUtils.equals(title, getString(R.string.demo_activity_label_multi_call))
+    ) {
+        return true
+    }
+    return false
+}
+
+/**
+ * Common settings for activity
+ * @param fitSystemForTheme
+ */
+internal fun Activity.setFitSystemForTheme(fitSystemForTheme: Boolean) {
+    val colorResource = ContextCompat.getColor(this, io.agora.uikit.R.color.ease_color_background)
+    val isDark = AppCompatDelegate.getDefaultNightMode() != AppCompatDelegate.MODE_NIGHT_YES
+    setFitSystemForTheme(fitSystemForTheme, colorResource, isDark)
+}
+
+
+/**
+ * Can set the status bar's style and change the background color
+ * @param fitSystemForTheme
+ * @param color Color
+ */
+internal fun Activity.setFitSystemForTheme(
+    fitSystemForTheme: Boolean,
+    @ColorInt color: Int,
+    isDark: Boolean
+) {
+    setFitSystem(fitSystemForTheme)
+    StatusBarCompat.compat(this, color)
+    StatusBarCompat.setLightStatusBar(this, isDark)
+}
+
+/**
+ * Can set the status bar's style and change the background color.
+ * @param fitSystemForTheme
+ * @param color Color string
+ */
+internal fun Activity.setFitSystemForTheme(fitSystemForTheme: Boolean, color: String?, isDark: Boolean) {
+    setFitSystem(fitSystemForTheme)
+    StatusBarCompat.compat(this, Color.parseColor(color))
+    StatusBarCompat.setLightStatusBar(this, isDark)
+}
+
+/**
+ * Set status bar style.
+ * @param fitSystemForTheme
+ */
+internal fun Activity.setFitSystem(fitSystemForTheme: Boolean) {
+    if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT && Build.VERSION.SDK_INT < Build.VERSION_CODES.LOLLIPOP) {
+        window.addFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS)
+    }
+    if (fitSystemForTheme) {
+        val contentFrameLayout = findViewById<View>(Window.ID_ANDROID_CONTENT) as ViewGroup
+        val parentView = contentFrameLayout.getChildAt(0)
+        if (parentView != null && Build.VERSION.SDK_INT >= 14) {
+            parentView.fitsSystemWindows = true
+        }
+    }
+    if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
+        val window = window
+        window.clearFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS)
+        window.decorView.systemUiVisibility =
+            View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN or View.SYSTEM_UI_FLAG_LAYOUT_STABLE
+        window.addFlags(WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS)
+    }
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/callkit/extensions/JSONObject.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/callkit/extensions/JSONObject.kt
new file mode 100644
index 00000000..e0eaab98
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/callkit/extensions/JSONObject.kt
@@ -0,0 +1,14 @@
+package com.hyphenate.chatdemo.callkit.extensions
+
+import org.json.JSONObject
+
+/**
+ * Get string value from JSONObject or return null if the key does not exist.
+ */
+internal fun JSONObject.getStringOrNull(name: String): String? {
+    return if (has(name)) {
+        getString(name)
+    } else {
+        null
+    }
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/callkit/fragment/ConferenceInviteFragment.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/callkit/fragment/ConferenceInviteFragment.kt
new file mode 100644
index 00000000..5fdf5132
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/callkit/fragment/ConferenceInviteFragment.kt
@@ -0,0 +1,81 @@
+package io.agora.chatdemo.callkit.fragment
+
+import android.os.Bundle
+import android.view.View
+import io.agora.chatdemo.callkit.CallKitManager
+import io.agora.chatdemo.callkit.adapter.ConferenceInviteAdapter
+import io.agora.uikit.base.EaseBaseRecyclerViewAdapter
+import io.agora.uikit.common.EaseConstant
+import io.agora.uikit.feature.group.fragments.EaseGroupMemberFragment
+import io.agora.uikit.feature.search.interfaces.OnContactSelectListener
+import io.agora.uikit.interfaces.OnContactSelectedListener
+import io.agora.uikit.model.EaseUser
+
+class ConferenceInviteFragment: EaseGroupMemberFragment() {
+    companion object {
+        fun newInstance(groupId: String, existMembers: MutableList<String>): ConferenceInviteFragment {
+            val fragment = ConferenceInviteFragment()
+            val bundle = Bundle()
+            bundle.putString(EaseConstant.EXTRA_CONVERSATION_ID, groupId)
+            bundle.putStringArrayList(CallKitManager.EXTRA_CONFERENCE_GROUP_EXIT_MEMBERS, ArrayList(existMembers))
+            fragment.arguments = bundle
+            return fragment
+        }
+    }
+
+    private var existMembers: MutableList<String> = mutableListOf()
+    private var selectedMembers:MutableList<String> = mutableListOf()
+    private var contactSelectedListener: OnContactSelectedListener? = null
+
+    override fun initAdapter(): EaseBaseRecyclerViewAdapter<EaseUser> {
+        return ConferenceInviteAdapter(groupId)
+    }
+
+    override fun initView(savedInstanceState: Bundle?) {
+        super.initView(savedInstanceState)
+        arguments?.let {
+            existMembers = it.getStringArrayList(CallKitManager.EXTRA_CONFERENCE_GROUP_EXIT_MEMBERS) ?: mutableListOf()
+        }
+        binding?.srlContactRefresh?.setEnableLoadMore(false)
+    }
+
+    override fun initListener() {
+        super.initListener()
+        if (mListAdapter is ConferenceInviteAdapter) {
+            (mListAdapter as ConferenceInviteAdapter).setCheckBoxSelectListener(object :
+                OnContactSelectListener {
+
+                override fun onContactSelectedChanged(
+                    v: View,
+                    userId: String,
+                    isSelected: Boolean
+                ) {
+                    if (isSelected){
+                        if (!selectedMembers.contains(userId)){
+                            selectedMembers.add(userId)
+                        }
+                    }else{
+                        if (selectedMembers.contains(userId)){
+                            selectedMembers.remove(userId)
+                        }
+                    }
+                    contactSelectedListener?.onContactSelectedChanged(v,selectedMembers)
+                }
+            })
+        }
+    }
+
+    override fun initData() {
+        super.initData()
+        if (mListAdapter is ConferenceInviteAdapter) {
+            (mListAdapter as ConferenceInviteAdapter).setExistMembers(existMembers)
+        }
+    }
+
+    /**
+     * Set the listener for the group member selection.
+     */
+    fun setOnGroupMemberSelectedListener(listener: OnContactSelectedListener?){
+        this.contactSelectedListener = listener
+    }
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/callkit/holder/ConferenceMemberSelectViewHolder.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/callkit/holder/ConferenceMemberSelectViewHolder.kt
new file mode 100644
index 00000000..c6c02026
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/callkit/holder/ConferenceMemberSelectViewHolder.kt
@@ -0,0 +1,76 @@
+package io.agora.chatdemo.callkit.holder
+
+import android.text.TextUtils
+import android.view.View
+import androidx.viewbinding.ViewBinding
+import io.agora.uikit.common.extensions.toProfile
+import io.agora.uikit.databinding.EaseLayoutGroupSelectContactBinding
+import io.agora.uikit.feature.group.adapter.EaseGroupMemberListAdapter
+import io.agora.uikit.feature.group.viewholders.EaseSelectContactViewHolder
+import io.agora.uikit.model.EaseProfile
+import io.agora.uikit.model.EaseUser
+
+class ConferenceMemberSelectViewHolder(
+    private val groupId: String?,
+    private val checkedMemberList: MutableList<String>,
+    viewBinding: EaseLayoutGroupSelectContactBinding
+): EaseSelectContactViewHolder(viewBinding) {
+    private var isShowInitLetter:Boolean = false
+
+    fun setShowInitialLetter(isShow:Boolean){
+        this.isShowInitLetter = isShow
+    }
+
+    override fun initView(viewBinding: ViewBinding?) {
+        if (viewBinding is EaseLayoutGroupSelectContactBinding) {
+            viewBinding.cbSelect.isClickable = false
+        }
+    }
+
+    override fun setData(item: EaseUser?, position: Int) {
+        item?.let { user->
+            with(viewBinding) {
+                itemLayout.setOnClickListener {
+                    val isChecked = cbSelect.isChecked
+                    cbSelect.isChecked = !isChecked
+                    if (!isChecked) {
+                        if (!checkedMemberList.contains(user.userId)) {
+                            checkedMemberList.add(user.userId)
+                        }
+                    }else {
+                        if (checkedMemberList.contains(user.userId)) {
+                            checkedMemberList.remove(user.userId)
+                        }
+                    }
+                    selectedListener?.onContactSelectedChanged(it, user.userId, cbSelect.isChecked)
+                }
+                cbSelect.isChecked = checkedMemberList.contains(user.userId)
+                cbSelect.isSelected = false
+                itemLayout.isEnabled = true
+                if (checkedList.isNotEmpty() && isContains(checkedList,item.userId)) {
+                    cbSelect.isSelected = true
+                    itemLayout.isEnabled = false
+                }
+                val header = user.initialLetter
+                letterHeader.visibility = View.GONE
+                emPresence.setUserAvatarData(user.toProfile())
+                tvName.text = user.nickname ?: user.userId
+
+                groupId?.let { id ->
+                    EaseProfile.getGroupMember(id, user.userId)?.let { profile ->
+                        emPresence.setUserAvatarData(profile)
+                        tvName.text = profile.getRemarkOrName()
+                    }
+                }
+
+                if (position == 0 || header != null && adapter is EaseGroupMemberListAdapter
+                    && header != (adapter as EaseGroupMemberListAdapter).getItem(position - 1)?.initialLetter) {
+                    if (!TextUtils.isEmpty(header) && isShowInitLetter) {
+                        letterHeader.visibility = View.VISIBLE
+                        letterHeader.text = header
+                    }
+                }
+            }
+        }
+    }
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/callkit/views/ChatRowConferenceInvite.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/callkit/views/ChatRowConferenceInvite.kt
new file mode 100644
index 00000000..480932b1
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/callkit/views/ChatRowConferenceInvite.kt
@@ -0,0 +1,39 @@
+package io.agora.chatdemo.callkit.views
+
+import android.annotation.SuppressLint
+import android.content.Context
+import android.util.AttributeSet
+import android.widget.TextView
+import io.agora.chatdemo.R
+import io.agora.uikit.common.ChatTextMessageBody
+import io.agora.uikit.widget.chatrow.EaseChatRow
+
+@SuppressLint("ViewConstructor")
+class ChatRowConferenceInvite @JvmOverloads constructor(
+    context: Context,
+    attrs: AttributeSet? = null,
+    defStyleAttr: Int = 0,
+    isSender: Boolean
+) : EaseChatRow(context, attrs, defStyleAttr, isSender) {
+    protected val contentView: TextView? by lazy { findViewById(R.id.tv_chatcontent) }
+    override fun onInflateView() {
+        inflater.inflate(
+            if (!isSender) R.layout.demo_row_received_conference_invite else R.layout.demo_row_sent_conference_invite,
+            this
+        )
+    }
+
+    override fun onSetUpView() {
+        (message?.body as? ChatTextMessageBody)?.let {
+            var message = it.message
+            if (message.isNullOrEmpty().not() && message.contains("-")) {
+                message = """
+                ${message.substring(0, message.indexOf("-") + 1)}
+                ${message.substring(message.indexOf("-") + 1)}
+                """.trimIndent()
+            }
+            contentView?.text = message
+        }
+    }
+
+}
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/callkit/views/ChatRowVoiceCall.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/callkit/views/ChatRowVoiceCall.kt
new file mode 100644
index 00000000..2d203166
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/callkit/views/ChatRowVoiceCall.kt
@@ -0,0 +1,42 @@
+package io.agora.chatdemo.callkit.views
+
+import android.annotation.SuppressLint
+import android.content.Context
+import android.util.AttributeSet
+import android.widget.ImageView
+import android.widget.TextView
+import io.agora.chatdemo.R
+import io.agora.uikit.common.ChatTextMessageBody
+import io.agora.uikit.widget.chatrow.EaseChatRow
+
+@SuppressLint("ViewConstructor")
+class ChatRowVoiceCall @JvmOverloads constructor(
+    context: Context,
+    attrs: AttributeSet? = null,
+    defStyleAttr: Int = 0,
+    isSender: Boolean
+) : EaseChatRow(context, attrs, defStyleAttr, isSender) {
+    protected val contentView: TextView? by lazy { findViewById(R.id.tv_chatcontent) }
+    private val ivCallIcon: ImageView by lazy { findViewById(R.id.iv_call_icon) }
+    override fun onInflateView() {
+        inflater.inflate(
+            if (!isSender) R.layout.demo_row_received_voice_call else R.layout.demo_row_sent_voice_call,
+            this
+        )
+    }
+
+    override fun onSetUpView() {
+        (message?.body as? ChatTextMessageBody)?.let {
+            contentView?.text = it.message
+        }
+        message?.let {
+//            val type = it.getIntAttribute(EaseMsgUtils.CALL_TYPE, 0)
+//            if (type == EaseCallType.SINGLE_VIDEO_CALL.ordinal) {
+//                ivCallIcon.setImageResource(com.hyphenate.easecallkit.R.drawable.d_chat_video_call_self)
+//            } else {
+//                ivCallIcon.setImageResource(com.hyphenate.easecallkit.R.drawable.d_chat_voice_call)
+//            }
+        }
+    }
+
+}
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/DemoConstant.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/DemoConstant.kt
new file mode 100644
index 00000000..1af9182e
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/DemoConstant.kt
@@ -0,0 +1,26 @@
+package io.agora.chatdemo.common
+
+object DemoConstant {
+    const val SKIP_DEVELOPER_CONFIG = "skip_developer_config"
+    const val CALL_INVITE_MESSAGE = "call_invite_message"
+
+    const val EVENT_UPDATE_SELF = "event_update_self"
+    const val EVENT_UPDATE_USER_SUFFIX = "/info"
+
+    const val IS_BLACK_THEME = "isBlack"
+    const val TARGET_LANGUAGE = "target_language"
+    const val APP_LANGUAGE = "app_language"
+    const val MSG_NO_DISTURBANCE = "msg_no_disturbance"
+
+    const val FEATURES_TRANSLATION = "features_translation"
+    const val FEATURES_THREAD = "features_thread"
+    const val FEATURES_REACTION = "features_reaction"
+
+    const val IS_TYPING_ON = "isTyping"
+
+    const val PRESENCE_ONLINE = "Online"
+    const val PRESENCE_OFFLINE = "Offline"
+    const val PRESENCE_BUSY = "Busy"
+    const val PRESENCE_DO_NOT_DISTURB = "Do Not Disturb"
+    const val PRESENCE_AWAY = "Away"
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/DemoDataModel.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/DemoDataModel.kt
new file mode 100644
index 00000000..ea05c66a
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/DemoDataModel.kt
@@ -0,0 +1,330 @@
+package io.agora.chatdemo.common
+
+import android.content.Context
+import android.util.Log
+import io.agora.chatdemo.BuildConfig
+import io.agora.chatdemo.DemoHelper
+import io.agora.chatdemo.callkit.CallKitManager
+import io.agora.chatdemo.common.room.AppDatabase
+import io.agora.chatdemo.common.room.dao.DemoUserDao
+import io.agora.chatdemo.common.room.entity.DemoUser
+import io.agora.chatdemo.common.room.entity.parse
+import io.agora.chatdemo.common.room.extensions.parseToDbBean
+import io.agora.uikit.EaseIM
+import io.agora.uikit.common.ChatClient
+import io.agora.uikit.common.ChatContact
+import io.agora.uikit.common.ChatException
+import io.agora.uikit.common.ChatLog
+import io.agora.uikit.common.ChatValueCallback
+import io.agora.uikit.common.extensions.toProfile
+import io.agora.uikit.common.extensions.toUser
+import io.agora.uikit.model.EaseProfile
+import io.agora.uikit.model.EaseUser
+import java.util.concurrent.ConcurrentHashMap
+
+class DemoDataModel(private val context: Context) {
+
+    private val database by lazy { AppDatabase.getDatabase(context, ChatClient.getInstance().currentUser) }
+
+    private val contactList = ConcurrentHashMap<String, DemoUser>()
+
+
+    init {
+        PreferenceManager.init(context)
+    }
+
+    /**
+     * Initialize the local database.
+     */
+    fun initDb() {
+        if (EaseIM.isInited().not()) {
+            throw IllegalStateException("EaseIM SDK must be inited before using.")
+        }
+        database
+        resetUsersTimes()
+        contactList.clear()
+        val data = getAllContacts().values.map { it.toProfile() }
+        if (data.isNotEmpty()){
+            EaseIM.updateUsersInfo(data)
+            data.map { CallKitManager.setEaseCallKitUserInfo(it.id)}
+        }
+    }
+
+    /**
+     * Get the user data access object.
+     */
+    fun getUserDao(): DemoUserDao {
+        if (EaseIM.isInited().not()) {
+            throw IllegalStateException("EaseIM SDK must be inited before using.")
+        }
+        return database.userDao()
+    }
+
+    /**
+     * Get all contacts from cache.
+     */
+    fun getAllContacts(): Map<String, EaseUser> {
+        if (contactList.isEmpty()) {
+            loadContactFromDb()
+        }
+        return contactList.mapValues { it.value.parse().toUser() }
+    }
+
+    private fun loadContactFromDb() {
+        contactList.clear()
+        try {
+            val localData = ChatClient.getInstance().contactManager().contactsFromLocal
+            getUserDao().getAll().forEach {
+                val profile = it.parse()
+                localData?.forEach { contact->
+                    if (contact.equals(profile.id)){
+                        contactList[it.userId] = profile.parseToDbBean()
+                    }
+                }
+            }
+        }catch (e:ChatException){
+            ChatLog.e("DemoDataModel","loadContactFromDb error ${e.description}")
+        }
+    }
+
+    /**
+     * Get user by userId from local db.
+     */
+    fun getUser(userId: String?): DemoUser? {
+        if (userId.isNullOrEmpty()) {
+            return null
+        }
+        if (contactList.containsKey(userId)) {
+            return contactList[userId]
+        }
+        return getUserDao().getUser(userId)
+    }
+
+    /**
+     * Insert user to local db.
+     */
+    fun insertUser(user: EaseProfile,isInsertDb:Boolean = true) {
+        if (isInsertDb){
+            getUserDao().insertUser(user.parseToDbBean())
+        }
+        contactList[user.id] = user.parseToDbBean()
+    }
+
+    /**
+     * Insert users to local db.
+     */
+    fun insertUsers(users: List<EaseProfile>) {
+        getUserDao().insertUsers(users.map { it.parseToDbBean() })
+        users.forEach {
+            contactList[it.id] = it.parseToDbBean()
+        }
+    }
+
+    /**
+     * Update user update times.
+     */
+    fun updateUsersTimes(userIds: List<EaseProfile>) {
+        if (userIds.isNotEmpty()) {
+            userIds?.map { it.id }?.let { userIds ->
+                getUserDao().updateUsersTimes(userIds)
+                loadContactFromDb()
+            }
+        }
+    }
+
+    private fun resetUsersTimes() {
+        getUserDao().resetUsersTimes()
+    }
+
+    fun clearCache(){
+        contactList.clear()
+    }
+
+    /**
+     * Update UIKit's user cache.
+     */
+    fun updateUserCache(userId: String?) {
+        if (userId.isNullOrEmpty()) {
+            return
+        }
+        val user = contactList[userId]?.parse() ?: return
+        EaseIM.updateUsersInfo(mutableListOf(user))
+    }
+
+
+    /**
+     * Set the flag whether to use google push.
+     * @param useFCM
+     */
+    fun setUseFCM(useFCM: Boolean) {
+        PreferenceManager.putValue(KEY_PUSH_USE_FCM, useFCM)
+    }
+
+    /**
+     * Get the flag whether to use google push.
+     * @return
+     */
+    fun isUseFCM(): Boolean {
+        return PreferenceManager.getValue(KEY_PUSH_USE_FCM, false)
+    }
+
+    /**
+     * Set the developer mode.
+     * @param isDeveloperMode The developer mode.
+     */
+    fun setDeveloperMode(isDeveloperMode: Boolean) {
+        PreferenceManager.putValue(KEY_DEVELOPER_MODE, isDeveloperMode)
+    }
+
+    /**
+     * Get the developer mode.
+     * @return The developer mode.
+     */
+    fun isDeveloperMode(): Boolean {
+        return PreferenceManager.getValue(KEY_DEVELOPER_MODE, false)
+    }
+
+    /**
+     * Set the custom appKey.
+     * @param appKey
+     */
+    fun setCustomAppKey(appKey: String?) {
+        PreferenceManager.putValue(KEY_CUSTOM_APPKEY, appKey)
+    }
+
+    /**
+     * Get the custom appKey.
+     * @return
+     */
+    fun getCustomAppKey(): String {
+        return PreferenceManager.getValue(KEY_CUSTOM_APPKEY, "")
+    }
+
+    /**
+     * Get whether the custom configuration is enabled.
+     * @return
+     */
+    fun isCustomSetEnable(): Boolean {
+        return PreferenceManager.getValue(KEY_ENABLE_CUSTOM_SET, false)
+    }
+
+    /**
+     * Set whether the custom configuration is enabled.
+     * @param enable
+     */
+    fun enableCustomSet(enable: Boolean) {
+        PreferenceManager.putValue(KEY_ENABLE_CUSTOM_SET, enable)
+    }
+
+    /**
+     * Get whether the custom server is enabled.
+     * @return
+     */
+    fun isCustomServerEnable(): Boolean {
+        return PreferenceManager.getValue(KEY_ENABLE_CUSTOM_SERVER, false)
+    }
+
+    /**
+     * Set whether the custom server is enabled.
+     * @param enable
+     */
+    fun enableCustomServer(enable: Boolean) {
+        PreferenceManager.putValue(KEY_ENABLE_CUSTOM_SERVER, enable)
+    }
+
+    /**
+     * Set the REST server.
+     * @param restServer
+     */
+    fun setRestServer(restServer: String?) {
+        PreferenceManager.putValue(KEY_REST_SERVER, restServer)
+    }
+
+    /**
+     * Get the REST server.
+     * @return
+     */
+    fun getRestServer(): String? {
+        return PreferenceManager.getValue(KEY_REST_SERVER, "")
+    }
+
+    /**
+     * Set the IM server.
+     * @param imServer
+     */
+    fun setIMServer(imServer: String?) {
+        PreferenceManager.putValue(KEY_IM_SERVER, imServer)
+    }
+
+    /**
+     * Get the IM server.
+     * @return
+     */
+    fun getIMServer(): String? {
+        return PreferenceManager.getValue(KEY_IM_SERVER, "")
+    }
+
+    /**
+     * Set the port of the IM server.
+     * @param port
+     */
+    fun setIMServerPort(port: Int) {
+        PreferenceManager.putValue(KEY_IM_SERVER_PORT, port)
+    }
+
+    /**
+     * Get the port of the IM server.
+     */
+    fun getIMServerPort(): Int {
+        return PreferenceManager.getValue(KEY_IM_SERVER_PORT, 0)
+    }
+
+    /**
+     * Set the silent mode for the App.
+     */
+    fun setAppPushSilent(isSilent: Boolean) {
+        PreferenceManager.putValue(KEY_PUSH_APP_SILENT_MODEL, isSilent)
+    }
+
+    /**
+     * Get the silent mode for the App.
+     */
+    fun isAppPushSilent(): Boolean {
+        return PreferenceManager.getValue(KEY_PUSH_APP_SILENT_MODEL, false)
+    }
+
+    fun setCurrentUserAgoraUid(agoraUid:Int){
+        PreferenceManager.putValue("${BuildConfig.AGORA_CHAT_APPKEY}$SHARED_KEY_CURRENTUSER_AGORAUID",agoraUid)
+    }
+
+    fun getCurrentUserAgoraUid():Int{
+        return PreferenceManager.getValue("${BuildConfig.AGORA_CHAT_APPKEY}$SHARED_KEY_CURRENTUSER_AGORAUID",0)
+    }
+
+    fun putBoolean(key: String, value: Boolean){
+        PreferenceManager.putValue(key,value)
+    }
+
+    fun getBoolean(key: String,default:Boolean?=false): Boolean {
+        return if (default == null){
+            PreferenceManager.getValue(key, false)
+        }else{
+            PreferenceManager.getValue(key, default)
+        }
+    }
+
+    companion object {
+        private const val KEY_DEVELOPER_MODE = "shared_is_developer"
+        private const val KEY_AGREE_AGREEMENT = "shared_key_agree_agreement"
+        private const val KEY_CUSTOM_APPKEY = "SHARED_KEY_CUSTOM_APPKEY"
+        private const val KEY_REST_SERVER = "SHARED_KEY_REST_SERVER"
+        private const val KEY_IM_SERVER = "SHARED_KEY_IM_SERVER"
+        private const val KEY_IM_SERVER_PORT = "SHARED_KEY_IM_SERVER_PORT"
+        private const val KEY_ENABLE_CUSTOM_SERVER = "SHARED_KEY_ENABLE_CUSTOM_SERVER"
+        private const val KEY_ENABLE_CUSTOM_SET = "SHARED_KEY_ENABLE_CUSTOM_SET"
+        private const val KEY_PUSH_USE_FCM = "shared_key_push_use_fcm"
+        private const val KEY_PUSH_APP_SILENT_MODEL = "key_push_app_silent_model"
+        private const val SHARED_KEY_CURRENTUSER_AGORAUID = "SHARED_KEY_CURRENTUSER_AGORAUID"
+    }
+
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/ErrorCode.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/ErrorCode.kt
new file mode 100644
index 00000000..6f449e56
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/ErrorCode.kt
@@ -0,0 +1,66 @@
+package io.agora.chatdemo.common
+
+import io.agora.uikit.common.ChatError
+
+
+/**
+ * 定义一些本地的错误code
+ */
+object ErrorCode : ChatError() {
+    /**
+     * 当前网络不可用
+     */
+    const val EM_NETWORK_ERROR = -2
+
+    /**
+     * 未登录过环信
+     */
+    const val EM_NOT_LOGIN = -8
+
+    /**
+     * result解析错误
+     */
+    const val EM_PARSE_ERROR = -10
+
+    /**
+     * 网络问题请稍后重试
+     */
+    const val EM_ERR_UNKNOWN = -20
+
+    /**
+     * 安卓版本问题,只支持4.4以上
+     */
+    const val EM_ERR_IMAGE_ANDROID_MIN_VERSION = -50
+
+    /**
+     * 文件不存在
+     */
+    const val EM_ERR_FILE_NOT_EXIST = -55
+
+    /**
+     * 添加自己为好友
+     */
+    const val EM_ADD_SELF_ERROR = -100
+
+    /**
+     * 已经是好友
+     */
+    const val EM_FRIEND_ERROR = -101
+
+    /**
+     * 已经添加到黑名单中
+     */
+    const val EM_FRIEND_BLACK_ERROR = -102
+
+    /**
+     * 没有群组成员
+     */
+    const val EM_ERR_GROUP_NO_MEMBERS = -105
+
+    /**
+     * 删除对话失败
+     */
+    const val EM_DELETE_CONVERSATION_ERROR = -110
+    const val EM_DELETE_SYS_MSG_ERROR = -115
+
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/ListenersWrapper.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/ListenersWrapper.kt
new file mode 100644
index 00000000..47335e4e
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/ListenersWrapper.kt
@@ -0,0 +1,148 @@
+package io.agora.chatdemo.common
+
+import android.content.Intent
+import android.util.Log
+import io.agora.chatdemo.DemoApplication
+import io.agora.chatdemo.DemoHelper
+import io.agora.chatdemo.common.helper.LocalNotifyHelper
+import io.agora.chatdemo.page.login.LoginActivity
+import io.agora.uikit.EaseIM
+import io.agora.uikit.common.ChatClient
+import io.agora.uikit.common.ChatGroup
+import io.agora.uikit.common.ChatLog
+import io.agora.uikit.common.ChatMessage
+import io.agora.uikit.common.ChatPresence
+import io.agora.uikit.common.ChatPresenceListener
+import io.agora.uikit.common.bus.EaseFlowBus
+import io.agora.uikit.common.extensions.ioScope
+import io.agora.uikit.common.extensions.mainScope
+import io.agora.uikit.common.impl.ValueCallbackImpl
+import io.agora.uikit.interfaces.EaseConnectionListener
+import io.agora.uikit.interfaces.EaseContactListener
+import io.agora.uikit.interfaces.EaseMessageListener
+import io.agora.uikit.model.EaseEvent
+import kotlinx.coroutines.CoroutineScope
+import kotlinx.coroutines.Dispatchers
+import kotlinx.coroutines.launch
+
+object ListenersWrapper {
+    private var isLoadGroupList = false
+
+    private val connectListener by lazy {
+        object : EaseConnectionListener() {
+            override fun onConnected() {
+                // do something
+                CoroutineScope(Dispatchers.IO).launch {
+                    val groups = ChatClient.getInstance().groupManager().allGroups
+                    if (isLoadGroupList.not() && groups.isEmpty()) {
+                        ChatClient.getInstance().groupManager().asyncGetJoinedGroupsFromServer(
+                            ValueCallbackImpl<List<ChatGroup>>(onSuccess = {
+                            isLoadGroupList = true
+                            if (it.isEmpty().not()) {
+                                EaseFlowBus.with<EaseEvent>(EaseEvent.EVENT.UPDATE.name)
+                                    .post(
+                                        DemoHelper.getInstance().context.ioScope(),
+                                        EaseEvent(EaseEvent.EVENT.UPDATE.name, EaseEvent.TYPE.GROUP)
+                                    )
+                            }
+                        }, onError = {_,_ ->
+
+                        })
+                        )
+                    }
+                }
+
+            }
+
+            override fun onTokenExpired() {
+                super.onTokenExpired()
+                logout(false)
+            }
+
+
+            override fun onLogout(errorCode: Int, info: String?) {
+                super.onLogout(errorCode, info)
+                ChatLog.e("app","onLogout: $errorCode $info")
+                logout()
+            }
+        }
+    }
+
+    private fun logout(unbindPushToken:Boolean = true){
+        EaseIM.logout(unbindPushToken,
+            onSuccess = {
+                ChatLog.e("ListenersWrapper","logout success")
+                DemoApplication.getInstance().getLifecycleCallbacks().activityList.forEach {
+                    it.finish()
+                }
+                DemoApplication.getInstance().apply {
+                    val intent = Intent(this, LoginActivity::class.java)
+                    intent.addFlags(Intent.FLAG_ACTIVITY_NEW_TASK)
+                    startActivity(intent)
+                }
+            },
+            onError = {code, error ->
+                ChatLog.e("ListenersWrapper","logout error $code $error")
+            }
+        )
+    }
+
+    private val messageListener by lazy { object : EaseMessageListener(){
+        override fun onMessageReceived(messages: MutableList<ChatMessage>?) {
+            super.onMessageReceived(messages)
+            if (DemoHelper.getInstance().getDataModel().isAppPushSilent()) {
+                return
+            }
+            // do something
+            messages?.forEach { message ->
+
+                if (EaseIM.checkMutedConversationList(message.conversationId())) {
+                    return@forEach
+                }
+                if (DemoApplication.getInstance().getLifecycleCallbacks().isFront.not()) {
+                    DemoHelper.getInstance().getNotifier()?.notify(message)
+                }
+            }
+        }
+    } }
+
+    private val presenceListener by lazy{
+        ChatPresenceListener {
+            defaultPresencesEvent(it)
+        }
+    }
+
+    private fun defaultPresencesEvent(presences: MutableList<ChatPresence>?){
+        presences?.forEach { presence->
+            PresenceCache.insertPresences(presence.publisher,presence)
+            EaseIM.getContext()?.let {
+                EaseFlowBus.with<EaseEvent>(EaseEvent.EVENT.UPDATE.name)
+                    .post(it.mainScope(), EaseEvent(EaseEvent.EVENT.UPDATE.name, EaseEvent.TYPE.PRESENCE,presence.publisher))
+            }
+        }
+    }
+
+    private val contactListener by lazy { object : EaseContactListener(){
+
+        override fun onFriendRequestAccepted(username: String?) {
+            val notifyMsg = LocalNotifyHelper.createContactNotifyMessage(username)
+            ChatClient.getInstance().chatManager().saveMessage(notifyMsg)
+            DemoHelper.getInstance().context.let {
+                EaseFlowBus.with<EaseEvent>(EaseEvent.EVENT.ADD.name)
+                    .post(it.mainScope(), EaseEvent(EaseEvent.EVENT.ADD.name, EaseEvent.TYPE.CONTACT))
+            }
+        }
+
+        override fun onContactDeleted(username: String?) {
+            LocalNotifyHelper.removeContactNotifyMessage(username)
+        }
+    } }
+
+    fun registerListeners() {
+        // register connection listener
+        EaseIM.addConnectionListener(connectListener)
+        EaseIM.addChatMessageListener(messageListener)
+        EaseIM.addPresenceListener(presenceListener)
+        EaseIM.addContactListener(contactListener)
+    }
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/PreferenceManager.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/PreferenceManager.kt
new file mode 100644
index 00000000..539cf241
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/PreferenceManager.kt
@@ -0,0 +1,55 @@
+package io.agora.chatdemo.common
+
+import android.annotation.SuppressLint
+import android.content.Context
+import android.content.SharedPreferences
+
+internal object PreferenceManager {
+
+    private var mSharedPreferences: SharedPreferences? = null
+    private const val PREF_NAME = "saveInfo"
+
+    @Synchronized
+    fun init(context: Context) {
+        if (mSharedPreferences == null) {
+            mSharedPreferences = context.getSharedPreferences(PREF_NAME, Context.MODE_PRIVATE)
+        }
+    }
+
+    /**
+     * Save the value to the preference.
+     * @param key The key of the preference.
+     * @param value The value of the preference.
+     */
+    @SuppressLint("NewApi")
+    fun <T> putValue(key: String, value: T) {
+        val editor = mSharedPreferences?.edit()
+        when (value) {
+            is String -> editor?.putString(key, value)
+            is Int -> editor?.putInt(key, value)
+            is Boolean -> editor?.putBoolean(key, value)
+            is Float -> editor?.putFloat(key, value)
+            is Long -> editor?.putLong(key, value)
+            else -> editor?.putString(key, value.toString())
+        }
+        editor?.apply()
+    }
+
+    /**
+     * Get the value from the preference.
+     * @param key The key of the preference.
+     * @param defValue The default value of the preference.
+     */
+    fun <T> getValue(key: String, defValue: T): T {
+        val value = when (defValue) {
+            is String -> mSharedPreferences?.getString(key, defValue)
+            is Int -> mSharedPreferences?.getInt(key, defValue)
+            is Boolean -> mSharedPreferences?.getBoolean(key, defValue)
+            is Float -> mSharedPreferences?.getFloat(key, defValue)
+            is Long -> mSharedPreferences?.getLong(key, defValue)
+            else -> mSharedPreferences?.getString(key, defValue.toString())
+        }
+        return value as T
+    }
+
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/PresenceCache.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/PresenceCache.kt
new file mode 100644
index 00000000..98792fd6
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/PresenceCache.kt
@@ -0,0 +1,31 @@
+package io.agora.chatdemo.common
+
+import io.agora.uikit.common.ChatPresence
+import java.util.concurrent.ConcurrentHashMap
+
+object PresenceCache {
+
+    private val presencesMap: ConcurrentHashMap<String, ChatPresence> = ConcurrentHashMap()
+
+    @Synchronized
+    fun insertPresences(userId: String?,chatPresence: ChatPresence){
+        presencesMap.let { presence->
+            userId?.let {
+                presence[it] = chatPresence
+            }
+        }
+    }
+
+    fun getUserPresence(userId: String):ChatPresence?{
+        if (presencesMap.size > 0 && presencesMap.containsKey(userId)){
+            return presencesMap[userId]
+        }
+        return null
+    }
+
+    var getPresenceInfo:ConcurrentHashMap<String, ChatPresence> = presencesMap
+
+    fun clear(){
+        presencesMap.clear()
+    }
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/PushActivityLifecycleCallback.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/PushActivityLifecycleCallback.kt
new file mode 100644
index 00000000..dc6efd80
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/PushActivityLifecycleCallback.kt
@@ -0,0 +1,39 @@
+package io.agora.chatdemo.common
+
+import android.app.Activity
+import android.app.Application
+import android.os.Bundle
+import io.agora.chatdemo.MainActivity
+
+class PushActivityLifecycleCallback: Application.ActivityLifecycleCallbacks {
+    override fun onActivityCreated(activity: Activity, savedInstanceState: Bundle?) {
+        // When MainActivity is created, get the push token and send it to the server
+        if (activity is MainActivity) {
+            PushManager.getPushTokenAndSend(activity)
+        }
+    }
+
+    override fun onActivityStarted(activity: Activity) {
+        
+    }
+
+    override fun onActivityResumed(activity: Activity) {
+
+    }
+
+    override fun onActivityPaused(activity: Activity) {
+        
+    }
+
+    override fun onActivityStopped(activity: Activity) {
+        
+    }
+
+    override fun onActivitySaveInstanceState(activity: Activity, outState: Bundle) {
+        
+    }
+
+    override fun onActivityDestroyed(activity: Activity) {
+        
+    }
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/PushManager.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/PushManager.kt
new file mode 100644
index 00000000..600de61d
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/PushManager.kt
@@ -0,0 +1,86 @@
+package io.agora.chatdemo.common
+
+import android.app.Application
+import android.content.Context
+import com.google.android.gms.common.ConnectionResult
+import com.google.android.gms.common.GoogleApiAvailabilityLight
+import com.google.firebase.analytics.FirebaseAnalytics
+import com.google.firebase.messaging.FirebaseMessaging
+import io.agora.chatdemo.DemoHelper
+import io.agora.uikit.common.ChatClient
+import io.agora.uikit.common.ChatLog
+import io.agora.uikit.common.ChatPushHelper
+import io.agora.uikit.common.ChatPushListener
+import io.agora.uikit.common.ChatPushType
+import io.agora.uikit.common.PushConfig
+import io.agora.uikit.common.extensions.isMainProcess
+
+object PushManager {
+
+    /**
+     * Initialize push.
+     */
+    fun initPush(context: Context) {
+        if (context.isMainProcess()) {
+            // Register push activity lifecycle callback.
+            (context.applicationContext as? Application)?.registerActivityLifecycleCallbacks(PushActivityLifecycleCallback())
+            // Set pushListener to control the push type.
+            ChatPushHelper.getInstance().setPushListener(object : ChatPushListener() {
+
+                override fun onError(pushType: ChatPushType?, errorCode: Long) {
+                    // 返回的errorCode仅9xx为环信内部错误，可从EMError中查询，其他错误请根据pushType去相应第三方推送网站查询。
+                    ChatLog.e("PushManager", "onError: pushType: $pushType, errorCode: $errorCode")
+                }
+
+                override fun isSupportPush(
+                    pushType: ChatPushType?,
+                    pushConfig: PushConfig?
+                ): Boolean {
+                    if (pushType == ChatPushType.FCM) {
+                        ChatLog.d("FCM",
+                            "GooglePlayServiceCode:" + GoogleApiAvailabilityLight.getInstance()
+                                .isGooglePlayServicesAvailable(context)
+                        )
+                        return DemoHelper.getInstance().getDataModel().isUseFCM()
+                                && GoogleApiAvailabilityLight.getInstance().isGooglePlayServicesAvailable(context) == ConnectionResult.SUCCESS
+                    }
+                    return super.isSupportPush(pushType, pushConfig)
+                }
+
+            })
+
+        }
+    }
+
+    /**
+     * Get the push token and send to Chat Server.
+     */
+    fun getPushTokenAndSend(context: Context) {
+        // Get FCM push token.
+        getFCMTokenAndSend(context)
+    }
+
+    /**
+     * Get FCM push token and send to Chat Server.
+     */
+    private fun getFCMTokenAndSend(context: Context) {
+        if (DemoHelper.getInstance().getDataModel().isUseFCM()
+            && GoogleApiAvailabilityLight.getInstance().isGooglePlayServicesAvailable(context) == ConnectionResult.SUCCESS) {
+            // Enable FCM automatic initialization
+            if (FirebaseMessaging.getInstance().isAutoInitEnabled.not()) {
+                FirebaseMessaging.getInstance().isAutoInitEnabled = true
+                FirebaseAnalytics.getInstance(context).setAnalyticsCollectionEnabled(true)
+            }
+            // Get FCM push token and send to Chat Server.
+            FirebaseMessaging.getInstance().token.addOnCompleteListener {
+                if (it.isSuccessful.not()) {
+                    ChatLog.e("FCM", "get FCM push token failed: ${it.exception}")
+                    return@addOnCompleteListener
+                }
+                val token = it.result
+                ChatLog.d("FCM", "get FCM push token: $token")
+                ChatClient.getInstance().sendFCMTokenToServer(token)
+            }
+        }
+    }
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/dialog/SimpleDialog.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/dialog/SimpleDialog.kt
new file mode 100644
index 00000000..28733c2a
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/dialog/SimpleDialog.kt
@@ -0,0 +1,269 @@
+package io.agora.chatdemo.common.dialog
+
+import android.app.Dialog
+import android.content.Context
+import android.graphics.Color
+import android.graphics.drawable.ColorDrawable
+import android.text.Editable
+import android.text.TextWatcher
+import android.view.Gravity
+import android.view.LayoutInflater
+import android.view.View
+import android.view.ViewGroup
+import android.view.WindowManager
+import androidx.annotation.ColorInt
+import io.agora.uikit.databinding.EaseLayoutCustomDialogBinding
+
+class SimpleDialog(
+    context: Context,
+    private var title: String? = "",
+    private var subtitle: String? = "",
+    private var isEditTextMode: Boolean = false,
+    private var inputHint: String? = "",
+    private var onNegativeButtonClickListener: (() -> Unit)? = {},
+    private var onPositiveButtonClickListener: (() -> Unit)? = {},
+    private var onInputTextChangeListener: ((String) -> Unit)? = {},
+    private var onInputModeConfirmListener: ((String) -> Unit)? = {},
+) : Dialog(context) {
+
+    private var mPositiveButtonText: String? = null
+    private var mNegativeButtonText: String? = null
+    private var showCancelButton: Boolean = true
+    private var showConfirmButton: Boolean = true
+    private val binding by lazy { EaseLayoutCustomDialogBinding.inflate(LayoutInflater.from(context)) }
+
+    init {
+        setContentView(binding.root)
+        setCancelable(true)
+        setCanceledOnTouchOutside(true)
+        window?.setBackgroundDrawable(ColorDrawable(Color.TRANSPARENT))
+        window?.setLayout(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.WRAP_CONTENT)
+        window?.setGravity(Gravity.CENTER)
+        window?.setSoftInputMode(WindowManager.LayoutParams.SOFT_INPUT_STATE_ALWAYS_HIDDEN)
+
+        setData()
+
+        binding.leftButton.setOnClickListener {
+            onNegativeButtonClickListener?.invoke()
+            dismiss()
+        }
+
+        binding.rightButton.setOnClickListener {
+            if (isEditTextMode){
+                if (binding.editText.text.isNotEmpty()){
+                    onInputModeConfirmListener?.invoke(binding.editText.text.toString())
+                }
+            }else{
+                onPositiveButtonClickListener?.invoke()
+            }
+            dismiss()
+        }
+    }
+
+    fun setData() {
+        if (mPositiveButtonText.isNullOrEmpty().not()) {
+            binding.rightButton.text = mPositiveButtonText
+        }
+        if (mNegativeButtonText.isNullOrEmpty().not()) {
+            binding.leftButton.text = mNegativeButtonText
+        }
+        if (title.isNullOrEmpty()) {
+            binding.titleTextView.visibility = View.GONE
+        } else {
+            binding.titleTextView.text = title
+            binding.titleTextView.visibility = View.VISIBLE
+        }
+
+        if (subtitle.isNullOrEmpty()) {
+            binding.subtitleTextView.visibility = View.GONE
+        } else {
+            binding.subtitleTextView.text = subtitle
+            binding.subtitleTextView.visibility = View.VISIBLE
+        }
+        if (isEditTextMode) {
+            binding.editText.requestFocus()
+            binding.inputClear.setOnClickListener{
+                binding.editText.setText("")
+            }
+            binding.editText.visibility = View.VISIBLE
+            binding.editText.addTextChangedListener(object : TextWatcher {
+                override fun beforeTextChanged(
+                    s: CharSequence?,
+                    start: Int,
+                    count: Int,
+                    after: Int
+                ) {
+                }
+
+                override fun onTextChanged(
+                    s: CharSequence,
+                    start: Int,
+                    before: Int,
+                    count: Int
+                ) {
+                    if (s.isEmpty()){
+                        binding.inputClear.visibility = View.GONE
+                        binding.rightButton.isSelected = false
+                    }else{
+                        binding.inputClear.visibility = View.VISIBLE
+                        binding.rightButton.isSelected = true
+                    }
+                    onInputTextChangeListener?.invoke(s.toString())
+                }
+
+                override fun afterTextChanged(s: Editable?) {
+                }
+            })
+        } else {
+            binding.editText.visibility = View.GONE
+            binding.rightButton.isSelected = true
+            binding.rightButton.visibility = View.VISIBLE
+        }
+        binding.leftButton.visibility = if (showCancelButton) View.VISIBLE else View.GONE
+        binding.rightButton.visibility = if (showConfirmButton) View.VISIBLE else View.GONE
+    }
+
+    class Builder(context: Context) {
+        private val dialog = SimpleDialog(context)
+
+        /**
+         * Set the dialog title.
+         */
+        fun setTitle(title: String?): Builder {
+            dialog.title = title
+            return this
+        }
+
+        /**
+         * Set the dialog subtitle.
+         */
+        fun setSubtitle(subtitle: String?): Builder {
+            dialog.subtitle = subtitle
+            return this
+        }
+
+        /**
+         * Set the dialog mode.
+         */
+        fun setEditTextMode(isEditTextMode: Boolean): Builder {
+            dialog.isEditTextMode = isEditTextMode
+            return this
+        }
+
+        /**
+         * Set the dialog input hint when the dialog model is edit.
+         */
+        fun setInputHint(inputHint: String?): Builder {
+            dialog.inputHint = inputHint
+            return this
+        }
+
+        /**
+         * Dismiss the dialog positive button.
+         */
+        fun dismissPositiveButton(): Builder {
+            dialog.showConfirmButton = false
+            return this
+        }
+
+        /**
+         * Dismiss the dialog negative button.
+         */
+        fun dismissNegativeButton(): Builder {
+            dialog.showCancelButton = false
+            return this
+        }
+
+        /**
+         * Set the dialog positive button.
+         */
+        fun setPositiveButton(text: String? = "", onClickListener: () -> Unit): Builder {
+            dialog.mPositiveButtonText = text
+            dialog.onPositiveButtonClickListener = onClickListener
+            return this
+        }
+
+        /**
+         * Set the dialog negative button.
+         */
+        fun setNegativeButton(text: String? = "", onClickListener: () -> Unit): Builder {
+            dialog.mNegativeButtonText = text
+            dialog.onNegativeButtonClickListener = onClickListener
+            return this
+        }
+
+        /**
+         * Set the dialog dismiss listener.
+         */
+        fun setOnDismissListener(onDismissListener: () -> Unit): Builder {
+            dialog.setOnDismissListener {
+                onDismissListener.invoke()
+            }
+            return this
+        }
+
+        /**
+         * Set the dialog cancelable.
+         */
+        fun setCancelable(cancelable: Boolean): Builder {
+            dialog.setCancelable(cancelable)
+            return this
+        }
+
+        /**
+         * Set the dialog canceled on touch outside.
+         */
+        fun setCanceledOnTouchOutside(canceledOnTouchOutside: Boolean): Builder {
+            dialog.setCanceledOnTouchOutside(canceledOnTouchOutside)
+            return this
+        }
+
+        /**
+         * Set the dialog positive button text color.
+         */
+        fun setPositiveButtonTextColor(@ColorInt color: Int): Builder {
+            dialog.binding.rightButton.setTextColor(color)
+            return this
+        }
+
+        /**
+         * Set the dialog negative button text color.
+         */
+        fun setNegativeButtonTextColor(@ColorInt color: Int): Builder {
+            dialog.binding.leftButton.setTextColor(color)
+            return this
+        }
+
+        /**
+         * Set the dialog input text change listener when the dialog is in edit model.
+         */
+        fun setOnInputTextChangeListener(onInputTextChangeListener: (String) -> Unit): Builder {
+            dialog.onInputTextChangeListener = onInputTextChangeListener
+            return this
+        }
+
+        /**
+         * Set the dialog input mode confirm listener when the dialog is in edit model.
+         */
+        fun setOnInputModeConfirmListener(onInputModeConfirmListener: (String) -> Unit): Builder {
+            dialog.onInputModeConfirmListener = onInputModeConfirmListener
+            return this
+        }
+
+        /**
+         * Create the dialog.
+         */
+        fun build(): SimpleDialog {
+            dialog.setData()
+            return dialog
+        }
+
+        /**
+         * Show the dialog.
+         */
+        fun show() {
+            build()
+            dialog.show()
+        }
+    }
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/dialog/fragment/DemoAgreementDialogFragment.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/dialog/fragment/DemoAgreementDialogFragment.kt
new file mode 100644
index 00000000..d9ae5db1
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/dialog/fragment/DemoAgreementDialogFragment.kt
@@ -0,0 +1,96 @@
+package io.agora.chatdemo.common.dialog.fragment
+
+import android.content.Intent
+import android.graphics.Color
+import android.net.Uri
+import android.os.Bundle
+import android.text.SpannableString
+import android.text.Spanned
+import android.text.TextPaint
+import android.text.method.LinkMovementMethod
+import android.text.style.ClickableSpan
+import android.text.style.ForegroundColorSpan
+import android.view.View
+import android.widget.TextView
+import androidx.appcompat.app.AppCompatActivity
+import androidx.core.content.ContextCompat
+import io.agora.chatdemo.R
+
+class DemoAgreementDialogFragment : DemoDialogFragment() {
+    override val middleLayoutId: Int
+        get() = R.layout.demo_fragment_middle_agreement
+
+    override fun initView(savedInstanceState: Bundle?) {
+        super.initView(savedInstanceState)
+        val tv_privacy = findViewById<TextView>(R.id.tv_privacy)
+        tv_privacy?.text = spannable
+        tv_privacy?.movementMethod = LinkMovementMethod.getInstance()
+        mBtnDialogConfirm?.setTextColor(ContextCompat.getColor(requireContext(), R.color.color_primary))
+    }
+
+    override fun initData() {
+        super.initData()
+        if (dialog != null) {
+            dialog!!.setCancelable(false)
+            dialog!!.setCanceledOnTouchOutside(false)
+        }
+    }
+
+    private val spannable: SpannableString
+        get() {
+            val spanStr = SpannableString(getString(R.string.demo_login_dialog_content_privacy))
+            val start1 = 18
+            val end1 = 25
+            val start2 = 30
+            val end2 = 44
+            spanStr.setSpan(object : MyClickableSpan() {
+                override fun onClick(widget: View) {
+                    jumpToAgreement()
+                }
+            }, start1, end1, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE)
+            spanStr.setSpan(
+                ForegroundColorSpan(ContextCompat.getColor(requireContext(), R.color.color_primary)),
+                start1,
+                end1,
+                Spanned.SPAN_EXCLUSIVE_EXCLUSIVE
+            )
+
+            //spanStr.setSpan(new UnderlineSpan(), 10, 14, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);
+            spanStr.setSpan(object : MyClickableSpan() {
+                override fun onClick(widget: View) {
+                    jumpToProtocol()
+                }
+            }, start2, end2, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE)
+            spanStr.setSpan(
+                ForegroundColorSpan(ContextCompat.getColor(requireContext(), R.color.color_primary)),
+                start2,
+                end2,
+                Spanned.SPAN_EXCLUSIVE_EXCLUSIVE
+            )
+            return spanStr
+        }
+
+    private fun jumpToAgreement() {
+        val uri = Uri.parse("http://www.easemob.com/agreement")
+        val it = Intent(Intent.ACTION_VIEW, uri)
+        startActivity(it)
+    }
+
+    private fun jumpToProtocol() {
+        val uri = Uri.parse("http://www.easemob.com/protocol")
+        val it = Intent(Intent.ACTION_VIEW, uri)
+        startActivity(it)
+    }
+
+    private abstract inner class MyClickableSpan : ClickableSpan() {
+        override fun updateDrawState(ds: TextPaint) {
+            super.updateDrawState(ds)
+            ds.bgColor = Color.TRANSPARENT
+        }
+    }
+
+    open class Builder(context: AppCompatActivity) : DemoDialogFragment.Builder(context) {
+        override val fragment: DemoDialogFragment
+            protected get() = DemoAgreementDialogFragment()
+    }
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/dialog/fragment/DemoDialogFragment.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/dialog/fragment/DemoDialogFragment.kt
new file mode 100644
index 00000000..65ca79cd
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/dialog/fragment/DemoDialogFragment.kt
@@ -0,0 +1,382 @@
+package io.agora.chatdemo.common.dialog.fragment
+
+import android.content.DialogInterface
+import android.os.Bundle
+import android.text.TextUtils
+import android.util.TypedValue
+import android.view.LayoutInflater
+import android.view.View
+import android.view.ViewGroup
+import android.view.WindowManager
+import android.widget.Button
+import android.widget.FrameLayout
+import android.widget.RelativeLayout
+import android.widget.TextView
+import androidx.annotation.ColorInt
+import androidx.annotation.ColorRes
+import androidx.annotation.StringRes
+import androidx.appcompat.app.AppCompatActivity
+import androidx.constraintlayout.widget.Group
+import androidx.core.content.ContextCompat
+import androidx.fragment.app.FragmentTransaction
+import io.agora.chatdemo.R
+import io.agora.chatdemo.base.BaseDialogFragment
+import io.agora.uikit.common.extensions.dpToPx
+
+open class DemoDialogFragment : BaseDialogFragment(), View.OnClickListener {
+    var mTvDialogTitle: TextView? = null
+    var mBtnDialogCancel: Button? = null
+    var mBtnDialogConfirm: Button? = null
+    var mOnConfirmClickListener: OnConfirmClickListener? = null
+    var mOnCancelClickListener: OnCancelClickListener? = null
+    var dismissListener: DialogInterface.OnDismissListener? = null
+    var mGroupMiddle: Group? = null
+    var title: String? = null
+    var content: String? = null
+    override val layoutId: Int
+        get() = R.layout.demo_fragment_dialog_base
+
+    override fun setChildView(view: View?) {
+        super.setChildView(view)
+        val layoutId = middleLayoutId
+        if (layoutId > 0) {
+            view?.findViewById<RelativeLayout>(R.id.rl_dialog_middle)?.let {
+                LayoutInflater.from(mContext).inflate(layoutId, it)
+                view.findViewById<View>(R.id.group_middle)?.visibility = View.VISIBLE
+            }
+        }
+    }
+
+    override fun onStart() {
+        super.onStart()
+        //宽度填满，高度自适应
+        try {
+            dialog?.window?.let {
+                val lp: WindowManager.LayoutParams = it.attributes
+                lp.width = ViewGroup.LayoutParams.MATCH_PARENT
+                lp.height = ViewGroup.LayoutParams.WRAP_CONTENT
+                it.attributes = lp
+            }
+            requireView().let {
+                val params = it.layoutParams
+                if (params is FrameLayout.LayoutParams) {
+                    val margin = 30.dpToPx(it.context)
+                    params.setMargins(margin, 0, margin, 0)
+                }
+            }
+        } catch (e: Exception) {
+            e.printStackTrace()
+        }
+    }
+
+    fun showAllowingStateLoss(transaction: FragmentTransaction, tag: String?): Int {
+        try {
+            val dismissed = DemoDialogFragment::class.java.getDeclaredField("mDismissed")
+            dismissed.isAccessible = true
+            dismissed[this] = false
+        } catch (e: NoSuchFieldException) {
+            e.printStackTrace()
+        } catch (e: IllegalAccessException) {
+            e.printStackTrace()
+        }
+        try {
+            val shown = DemoDialogFragment::class.java.getDeclaredField("mShownByMe")
+            shown.isAccessible = true
+            shown[this] = true
+        } catch (e: NoSuchFieldException) {
+            e.printStackTrace()
+        } catch (e: IllegalAccessException) {
+            e.printStackTrace()
+        }
+        transaction.add(this, tag)
+        try {
+            val viewDestroyed = DemoDialogFragment::class.java.getDeclaredField("mViewDestroyed")
+            viewDestroyed.isAccessible = true
+            viewDestroyed[this] = false
+        } catch (e: NoSuchFieldException) {
+            e.printStackTrace()
+        } catch (e: IllegalAccessException) {
+            e.printStackTrace()
+        }
+        val mBackStackId = transaction.commitAllowingStateLoss()
+        try {
+            val backStackId = DemoDialogFragment::class.java.getDeclaredField("mBackStackId")
+            backStackId.isAccessible = true
+            backStackId[this] = mBackStackId
+        } catch (e: NoSuchFieldException) {
+            e.printStackTrace()
+        } catch (e: IllegalAccessException) {
+            e.printStackTrace()
+        }
+        return mBackStackId
+    }
+
+    open val middleLayoutId: Int
+        /**
+         * 获取中间布局的id
+         * @return
+         */
+        get() = 0
+
+    override fun initView(savedInstanceState: Bundle?) {
+        mTvDialogTitle = findViewById(R.id.tv_dialog_title)
+        mBtnDialogCancel = findViewById(R.id.btn_dialog_cancel)
+        mBtnDialogConfirm = findViewById(R.id.btn_dialog_confirm)
+        mGroupMiddle = findViewById(R.id.group_middle)
+        arguments?.let { bundle ->
+            title = bundle.getString(ParameterName.titleString)
+            if (!TextUtils.isEmpty(title)) {
+                mTvDialogTitle?.text = title
+            }
+            content = bundle.getString(ParameterName.contentString)
+            val titleColor = bundle.getInt(ParameterName.titleColorInt, 0)
+            if (titleColor != 0) {
+                mTvDialogTitle?.setTextColor(titleColor)
+            }
+            val titleSize = bundle.getInt(ParameterName.titleSize, 0)
+            if (titleSize != 0) {
+                mTvDialogTitle?.setTextSize(TypedValue.COMPLEX_UNIT_SP, titleSize.toFloat())
+            }
+            val confirm = bundle.getString(ParameterName.confirmString)
+            if (!TextUtils.isEmpty(confirm)) {
+                mBtnDialogConfirm?.text = confirm
+            }
+            val confirmColor = bundle.getInt(ParameterName.confirmColorInt, 0)
+            if (confirmColor != 0) {
+                mBtnDialogConfirm?.setTextColor(confirmColor)
+            }
+            val cancel = bundle.getString(ParameterName.cancelString)
+            if (!TextUtils.isEmpty(cancel)) {
+                mBtnDialogCancel?.text = cancel
+            }
+            val showCancel = bundle.getBoolean(ParameterName.showCancel, false)
+            if (showCancel) {
+                mGroupMiddle?.visibility = View.VISIBLE
+            }
+            val canceledOnTouchOutside =
+                bundle.getBoolean(ParameterName.canceledOnTouchOutside, false)
+            dialog?.setCanceledOnTouchOutside(canceledOnTouchOutside)
+        }
+    }
+
+    override fun initListener() {
+        mBtnDialogCancel?.setOnClickListener(this)
+        mBtnDialogConfirm?.setOnClickListener(this)
+    }
+
+    override fun initData() {}
+    override fun onClick(v: View) {
+        when (v.id) {
+            R.id.btn_dialog_cancel -> onCancelClick(v)
+            R.id.btn_dialog_confirm -> onConfirmClick(v)
+        }
+    }
+
+    override fun dismiss() {
+        super.dismiss()
+        dismissListener?.onDismiss(dialog)
+    }
+
+    /**
+     * 设置确定按钮的点击事件
+     * @param listener
+     */
+    fun setOnConfirmClickListener(listener: OnConfirmClickListener?) {
+        mOnConfirmClickListener = listener
+    }
+
+    /**
+     * 设置取消事件
+     * @param cancelClickListener
+     */
+    fun setOnCancelClickListener(cancelClickListener: OnCancelClickListener?) {
+        mOnCancelClickListener = cancelClickListener
+    }
+
+    private fun setOnDismissListener(dismissListener: DialogInterface.OnDismissListener?) {
+        this.dismissListener = dismissListener
+    }
+
+    /**
+     * 点击了取消按钮
+     * @param v
+     */
+    fun onCancelClick(v: View?) {
+        dismiss()
+        mOnCancelClickListener?.onCancelClick(v)
+    }
+
+    /**
+     * 点击了确认按钮
+     * @param v
+     */
+    fun onConfirmClick(v: View?) {
+        dismiss()
+        mOnConfirmClickListener?.onConfirmClick(v)
+    }
+
+    /**
+     * 确定事件的点击事件
+     */
+    interface OnConfirmClickListener {
+        fun onConfirmClick(view: View?)
+    }
+
+    /**
+     * 点击取消
+     */
+    interface OnCancelClickListener {
+        fun onCancelClick(view: View?)
+    }
+
+    open class Builder(private val context: AppCompatActivity) {
+        private var listener: OnConfirmClickListener? = null
+        private var cancelClickListener: OnCancelClickListener? = null
+        private var dismissListener: DialogInterface.OnDismissListener? = null
+        private val currentFragment: DemoDialogFragment? = null
+        protected val bundle: Bundle = Bundle()
+
+        fun setTitle(@StringRes title: Int): Builder {
+            bundle.putString(ParameterName.titleString, context.getString(title))
+            return this
+        }
+
+        fun setTitle(title: String?): Builder {
+            bundle.putString(ParameterName.titleString, title)
+            return this
+        }
+
+        fun setTitleColor(@ColorRes color: Int): Builder {
+            bundle.putInt(ParameterName.titleColorInt, ContextCompat.getColor(context, color))
+            return this
+        }
+
+        fun setTitleColorInt(@ColorInt color: Int): Builder {
+            bundle.putInt(ParameterName.titleColorInt, color)
+            return this
+        }
+
+        fun setTitleSize(size: Float): Builder {
+            bundle.putFloat(ParameterName.titleSize, size)
+            return this
+        }
+
+        fun setContent(@StringRes content: Int): Builder {
+            bundle.putString(ParameterName.contentString, context.getString(content))
+            return this
+        }
+
+        fun setContent(content: String?): Builder {
+            bundle.putString(ParameterName.contentString, content)
+            return this
+        }
+
+        fun showCancelButton(showCancel: Boolean): Builder {
+            bundle.putBoolean(ParameterName.showCancel, showCancel)
+            return this
+        }
+
+        fun setCanceledOnTouchOutside(cancel: Boolean): Builder {
+            bundle.putBoolean(ParameterName.canceledOnTouchOutside, cancel)
+            return this
+        }
+
+        fun setOnConfirmClickListener(
+            @StringRes confirm: Int,
+            listener: OnConfirmClickListener?
+        ): Builder {
+            bundle.putString(ParameterName.confirmString, context.getString(confirm))
+            this.listener = listener
+            return this
+        }
+
+        fun setOnConfirmClickListener(
+            confirm: String?,
+            listener: OnConfirmClickListener?
+        ): Builder {
+            bundle.putString(ParameterName.confirmString, confirm)
+            this.listener = listener
+            return this
+        }
+
+        fun setOnConfirmClickListener(listener: OnConfirmClickListener?): Builder {
+            this.listener = listener
+            return this
+        }
+
+        fun setConfirmColor(@ColorRes color: Int): Builder {
+            bundle.putInt(ParameterName.confirmColorInt, ContextCompat.getColor(context, color))
+            return this
+        }
+
+        fun setConfirmColorInt(@ColorInt color: Int): Builder {
+            bundle.putInt(ParameterName.confirmColorInt, color)
+            return this
+        }
+
+        fun setOnCancelClickListener(
+            @StringRes cancel: Int,
+            listener: OnCancelClickListener?
+        ): Builder {
+            bundle.putString(ParameterName.cancelString, context.getString(cancel))
+            cancelClickListener = listener
+            return this
+        }
+
+        fun setOnCancelClickListener(cancel: String?, listener: OnCancelClickListener?): Builder {
+            bundle.putString(ParameterName.cancelString, cancel)
+            cancelClickListener = listener
+            return this
+        }
+
+        fun setOnCancelClickListener(listener: OnCancelClickListener?): Builder {
+            cancelClickListener = listener
+            return this
+        }
+
+        fun setOnDismissListener(listener: DialogInterface.OnDismissListener?): Builder {
+            dismissListener = listener
+            return this
+        }
+
+        fun setArgument(bundle: Bundle?): Builder {
+            if (bundle != null) {
+                this.bundle.putAll(bundle)
+            }
+            return this
+        }
+
+        fun build(): DemoDialogFragment {
+            val fragment = fragment
+            fragment.setOnConfirmClickListener(listener)
+            fragment.setOnCancelClickListener(cancelClickListener)
+            fragment.setOnDismissListener(dismissListener)
+            fragment.setArguments(bundle)
+            return fragment
+        }
+
+        protected open val fragment: DemoDialogFragment
+            protected get() = DemoDialogFragment()
+
+        fun show(): DemoDialogFragment {
+            val fragment = build()
+            val transaction: FragmentTransaction =
+                context.supportFragmentManager.beginTransaction()
+            transaction.setTransition(FragmentTransaction.TRANSIT_FRAGMENT_FADE)
+            fragment.showAllowingStateLoss(transaction, null)
+            return fragment
+        }
+    }
+
+    private object ParameterName {
+        const val titleString = "titleString"
+        const val titleColorInt = "titleColorInt"
+        const val titleSize = "titleSize"
+        const val contentString = "contentString"
+        const val showCancel = "showCancel"
+        const val canceledOnTouchOutside = "canceledOnTouchOutside"
+        const val confirmString = "confirmString"
+        const val confirmColorInt = "confirmColorInt"
+        const val cancelString = "cancelString"
+    }
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/extensions/String.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/extensions/String.kt
new file mode 100644
index 00000000..944191ba
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/extensions/String.kt
@@ -0,0 +1,32 @@
+package io.agora.chatdemo.common.extensions
+
+import java.io.UnsupportedEncodingException
+import java.security.MessageDigest
+import java.security.NoSuchAlgorithmException
+
+/**
+ * MD5 encryption.
+ */
+fun String.MD5(): String {
+    if (this.isEmpty()) {
+        return ""
+    }
+    var hexStr = ""
+    try {
+        val hash = MessageDigest.getInstance("MD5").digest(toByteArray(charset("utf-8")))
+        val hex = StringBuilder(hash.size * 2)
+        for (b in hash) {
+            if (b.toInt() and 0xFF < 0x10) {
+                hex.append("0")
+            }
+            hex.append(Integer.toHexString(b.toInt() and 0xFF))
+        }
+        hexStr = hex.toString()
+    } catch (e: NoSuchAlgorithmException) {
+        e.printStackTrace()
+    } catch (e: UnsupportedEncodingException) {
+        e.printStackTrace()
+    }
+
+    return hexStr
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/extensions/internal/Activity.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/extensions/internal/Activity.kt
new file mode 100644
index 00000000..c0d3460d
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/extensions/internal/Activity.kt
@@ -0,0 +1,10 @@
+package io.agora.chatdemo.common.extensions.internal
+
+import android.app.Activity
+import android.app.ActivityManager
+import android.content.Context
+
+internal fun Activity.makeTaskToFront() {
+    (getSystemService(Context.ACTIVITY_SERVICE) as? ActivityManager)
+        ?.moveTaskToFront(taskId, ActivityManager.MOVE_TASK_WITH_HOME)
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/extensions/internal/ChatGroup.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/extensions/internal/ChatGroup.kt
new file mode 100644
index 00000000..fdb4c8c5
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/extensions/internal/ChatGroup.kt
@@ -0,0 +1,8 @@
+package io.agora.chatdemo.common.extensions.internal
+
+import io.agora.uikit.common.ChatGroup
+import io.agora.uikit.model.EaseGroupProfile
+
+internal fun ChatGroup.parse(): EaseGroupProfile {
+    return EaseGroupProfile(groupId, groupName, extension)
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/extensions/internal/ChatOptions.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/extensions/internal/ChatOptions.kt
new file mode 100644
index 00000000..dfebce57
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/extensions/internal/ChatOptions.kt
@@ -0,0 +1,27 @@
+package io.agora.chatdemo.common.extensions.internal
+
+import android.content.Context
+import android.content.pm.PackageManager
+import io.agora.uikit.common.ChatOptions
+
+/**
+ * Check if set the app key.
+ */
+internal fun ChatOptions.checkAppKey(context: Context): Boolean {
+    if (appKey.isNullOrEmpty().not()) {
+        return true
+    }
+    val appPackageName = context.packageName
+    try {
+        context.packageManager.getApplicationInfo(appPackageName, PackageManager.GET_META_DATA).let { info ->
+            info.metaData?.getString("EASEMOB_APPKEY")?.let { key ->
+                if (key.isEmpty().not()) {
+                    return true
+                }
+            }
+        }
+    } catch (e: PackageManager.NameNotFoundException) {
+        e.printStackTrace()
+    }
+    return false
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/extensions/internal/ChatUserInfo.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/extensions/internal/ChatUserInfo.kt
new file mode 100644
index 00000000..75247777
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/extensions/internal/ChatUserInfo.kt
@@ -0,0 +1,12 @@
+package io.agora.chatdemo.common.extensions.internal
+
+import io.agora.uikit.common.ChatUserInfo
+import io.agora.uikit.model.EaseProfile
+
+internal fun ChatUserInfo.toProfile(): EaseProfile {
+    return EaseProfile(
+        id = userId,
+        name = nickname,
+        avatar = avatarUrl
+    )
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/extensions/internal/EditText.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/extensions/internal/EditText.kt
new file mode 100644
index 00000000..584e7dc2
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/extensions/internal/EditText.kt
@@ -0,0 +1,101 @@
+package io.agora.chatdemo.common.extensions.internal
+
+import android.annotation.SuppressLint
+import android.graphics.drawable.Drawable
+import android.text.Editable
+import android.text.InputType
+import android.text.TextWatcher
+import android.view.MotionEvent
+import android.view.View
+import android.widget.EditText
+
+@SuppressLint("ClickableViewAccessibility")
+internal fun EditText.changePwdDrawable(
+    eyeOpen: Drawable?,
+    eyeClose: Drawable?,
+    left: Drawable?,
+    top: Drawable?,
+    bottom: Drawable?
+) {
+    //Can the identification password be seen
+    val canBeSeen = booleanArrayOf(false)
+    setOnTouchListener { v: View?, event: MotionEvent ->
+        val drawable = compoundDrawables[2] ?: return@setOnTouchListener false
+        //If there is no image on the right, it will not be processed anymore
+        //If it is not a press event, no further processing
+        if (event.action != MotionEvent.ACTION_UP) return@setOnTouchListener false
+        if (event.x > (width
+                    - paddingRight
+                    - drawable.intrinsicWidth)
+        ) {
+            if (canBeSeen[0]) {
+                inputType =
+                    InputType.TYPE_CLASS_TEXT or InputType.TYPE_TEXT_VARIATION_PASSWORD
+                setCompoundDrawablesWithIntrinsicBounds(left, top, eyeClose, bottom)
+                canBeSeen[0] = false
+            } else {
+                inputType =
+                    InputType.TYPE_CLASS_TEXT or InputType.TYPE_TEXT_VARIATION_NORMAL
+                setCompoundDrawablesWithIntrinsicBounds(left, top, eyeOpen, bottom)
+                canBeSeen[0] = true
+            }
+            setSelection(text.toString().length)
+            isFocusable = true
+            isFocusableInTouchMode = true
+            requestFocus()
+            return@setOnTouchListener true
+        }
+        false
+    }
+}
+
+/**
+ * Show EditText's right drawable when text is not null.
+ */
+internal fun EditText.showRightDrawable(right: Drawable?) {
+    val content = text.toString().trim { it <= ' ' }
+    setCompoundDrawablesWithIntrinsicBounds(
+        null,
+        null,
+        if (content.isEmpty()) null else right,
+        null
+    )
+}
+
+@SuppressLint("ClickableViewAccessibility")
+internal fun EditText.clearEditTextListener() {
+    setOnTouchListener { v: View?, event: MotionEvent ->
+        val drawable = compoundDrawables[2] ?: return@setOnTouchListener false
+        //如果右边没有图片，不再处理
+        //如果不是按下事件，不再处理
+        if (event.action != MotionEvent.ACTION_UP) return@setOnTouchListener false
+        if (event.x > (width
+                    - paddingRight
+                    - drawable.intrinsicWidth)
+        ) {
+            setText("")
+            return@setOnTouchListener true
+        }
+        false
+    }
+}
+
+/**
+ * Implement a default text changed listener.
+ */
+internal fun EditText.addDefaultTextChangedListener(listener: (Editable?) -> Unit) {
+    addTextChangedListener(object : TextWatcher {
+        override fun beforeTextChanged(s: CharSequence?, start: Int, count: Int, after: Int) {
+            // do nothing
+        }
+
+        override fun onTextChanged(s: CharSequence?, start: Int, before: Int, count: Int) {
+            // do nothing
+        }
+
+        override fun afterTextChanged(s: Editable?) {
+            listener(s)
+        }
+
+    })
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/extensions/internal/SwitchView.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/extensions/internal/SwitchView.kt
new file mode 100644
index 00000000..e4831392
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/extensions/internal/SwitchView.kt
@@ -0,0 +1,9 @@
+package io.agora.chatdemo.common.extensions.internal
+
+import io.agora.uikit.widget.EaseSwitchItemView
+
+
+internal fun EaseSwitchItemView.setSwitchDefaultStyle(){
+    setSwitchTarckDrawable(io.agora.uikit.R.drawable.ease_switch_track_selector)
+    setSwitchThumbDrawable(io.agora.uikit.R.drawable.ease_switch_thumb_selector)
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/helper/DeveloperModeHelper.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/helper/DeveloperModeHelper.kt
new file mode 100644
index 00000000..460fa3e8
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/helper/DeveloperModeHelper.kt
@@ -0,0 +1,22 @@
+package io.agora.chatdemo.common.helper
+
+import io.agora.chatdemo.DemoHelper
+
+object DeveloperModeHelper {
+
+    fun isDeveloperMode():Boolean{
+        return DemoHelper.getInstance().getDataModel().isDeveloperMode()
+    }
+
+    fun setDeveloperMode(developerMode:Boolean){
+        DemoHelper.getInstance().getDataModel().setDeveloperMode(developerMode)
+    }
+
+    fun setEnableCustom(enable:Boolean){
+        DemoHelper.getInstance().getDataModel().enableCustomSet(enable)
+    }
+
+    fun isCustomSetEnable():Boolean{
+        return DemoHelper.getInstance().getDataModel().isCustomSetEnable()
+    }
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/helper/LocalNotifyHelper.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/helper/LocalNotifyHelper.kt
new file mode 100644
index 00000000..c200c790
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/helper/LocalNotifyHelper.kt
@@ -0,0 +1,50 @@
+package io.agora.chatdemo.common.helper
+
+import io.agora.chat.Conversation
+import io.agora.chatdemo.DemoHelper
+import io.agora.chatdemo.R
+import io.agora.uikit.EaseIM
+import io.agora.uikit.common.ChatClient
+import io.agora.uikit.common.ChatMessage
+import io.agora.uikit.common.ChatMessageStatus
+import io.agora.uikit.common.ChatMessageType
+import io.agora.uikit.common.ChatTextMessageBody
+import io.agora.uikit.common.ChatType
+import io.agora.uikit.provider.getSyncUser
+
+object LocalNotifyHelper {
+    /**
+     * Create a local message when receive a unsent message.
+     */
+    fun createContactNotifyMessage(userId:String?): ChatMessage {
+        val user = EaseIM.getUserProvider()?.getSyncUser(userId)
+        val msgNotification = ChatMessage.createReceiveMessage(ChatMessageType.TXT)
+        val text: String =  DemoHelper.getInstance().context.resources?.
+        getString(R.string.demo_contact_added_notify,user?.getNotEmptyName())?:"$userId"
+        val txtBody = ChatTextMessageBody(text)
+        msgNotification.addBody(txtBody)
+        msgNotification.to = EaseIM.getCurrentUser()?.id
+        msgNotification.from = user?.id
+        msgNotification.msgTime = System.currentTimeMillis()
+        msgNotification.chatType = ChatType.Chat
+        msgNotification.setLocalTime(System.currentTimeMillis())
+        msgNotification.setAttribute(io.agora.uikit.common.EaseConstant.MESSAGE_TYPE_CONTACT_NOTIFY, true)
+        msgNotification.setStatus(ChatMessageStatus.SUCCESS)
+        msgNotification.setIsChatThreadMessage(false)
+        return msgNotification
+    }
+
+    /**
+     * Remove a local message when receive contact notify message.
+     */
+    fun removeContactNotifyMessage(userId:String?){
+        val conversation = ChatClient.getInstance().chatManager().getConversation(userId,Conversation.ConversationType.Chat)
+        conversation?.let {
+            it.allMessages.map { msg->
+                if (msg.ext().containsKey(io.agora.uikit.common.EaseConstant.MESSAGE_TYPE_CONTACT_NOTIFY)){
+                    it.removeMessage(msg.msgId)
+                }
+            }
+        }
+    }
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/helper/MenuFilterHelper.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/helper/MenuFilterHelper.kt
new file mode 100644
index 00000000..e7b1743d
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/helper/MenuFilterHelper.kt
@@ -0,0 +1,27 @@
+package io.agora.chatdemo.common.helper
+
+import android.text.TextUtils
+import io.agora.chat.callkit.utils.EaseCallMsgUtils
+import io.agora.uikit.common.ChatMessage
+import io.agora.uikit.common.ChatMessageType
+import io.agora.uikit.menu.chat.EaseChatMenuHelper
+
+object MenuFilterHelper {
+    fun filterMenu(helper: EaseChatMenuHelper?, message: ChatMessage?){
+        message?.let {
+            when(it.type){
+                ChatMessageType.TXT ->{
+                    if (it.ext().containsKey(EaseCallMsgUtils.CALL_MSG_TYPE)){
+                        val msgType = it.getStringAttribute(EaseCallMsgUtils.CALL_MSG_TYPE,"")
+                        if (TextUtils.equals(msgType, EaseCallMsgUtils.CALL_MSG_INFO)) {
+                            helper?.setAllItemsVisible(false)
+                            helper?.clearTopView()
+                            helper?.findItemVisible(io.agora.uikit.R.id.action_chat_delete,true)
+                        }
+                    }
+                }
+                else -> {}
+            }
+        }
+    }
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/room/AppDatabase.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/room/AppDatabase.kt
new file mode 100644
index 00000000..b9fd641f
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/room/AppDatabase.kt
@@ -0,0 +1,42 @@
+package io.agora.chatdemo.common.room
+
+import android.content.Context
+import androidx.room.Database
+import androidx.room.Room
+import androidx.room.RoomDatabase
+import io.agora.chatdemo.BuildConfig
+import io.agora.chatdemo.common.extensions.MD5
+import io.agora.chatdemo.common.room.dao.DemoUserDao
+import io.agora.chatdemo.common.room.entity.DemoUser
+
+@Database(entities = [DemoUser::class], version = 3)
+abstract class AppDatabase: RoomDatabase() {
+
+    /**
+     * Get the user data access object.
+     */
+    abstract fun userDao(): DemoUserDao
+
+    companion object {
+        @Volatile
+        private var INSTANCE: AppDatabase? = null
+
+        // 以下数据库升级设置，为升级数据库将清掉之前的数据，如果要保留数据，慎重采用此种方式
+        // 可以采用addMigrations()的方式，进行数据库的升级
+        fun getDatabase(context: Context, userId: String): AppDatabase {
+            return INSTANCE ?: synchronized(this) {
+                val dbName = (BuildConfig.AGORA_CHAT_APPKEY + userId).MD5()
+                val instance = Room.databaseBuilder(
+                        context.applicationContext,
+                        AppDatabase::class.java,
+                        dbName
+                    )
+                    .allowMainThreadQueries()
+                    .fallbackToDestructiveMigration()
+                    .build()
+                INSTANCE = instance
+                instance
+            }
+        }
+    }
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/room/dao/DemoUserDao.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/room/dao/DemoUserDao.kt
new file mode 100644
index 00000000..79943ab9
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/room/dao/DemoUserDao.kt
@@ -0,0 +1,96 @@
+package io.agora.chatdemo.common.room.dao
+
+import androidx.room.Dao
+import androidx.room.Delete
+import androidx.room.Insert
+import androidx.room.OnConflictStrategy
+import androidx.room.Query
+import androidx.room.Update
+import io.agora.chatdemo.common.room.entity.DemoUser
+import kotlinx.coroutines.flow.Flow
+
+@Dao
+interface DemoUserDao {
+
+    @Query("SELECT * FROM DemoUser")
+    fun getAll(): List<DemoUser>
+
+    @Query("SELECT * FROM DemoUser WHERE userId = :userId")
+    fun getUserById(userId: String): Flow<DemoUser?>
+
+    @Query("SELECT * FROM DemoUser WHERE userId = :userId")
+    fun getUser(userId: String): DemoUser?
+
+    @Query("SELECT * FROM DemoUser WHERE userId IN (:userIds)")
+    fun getUsersByIds(userIds: List<String>): Flow<List<DemoUser>>
+
+    @Query("SELECT * FROM DemoUser WHERE name LIKE :name")
+    fun getUsersByName(name: String?): Flow<List<DemoUser>>
+
+    // Insert by DemoUser
+    @Insert(onConflict = OnConflictStrategy.REPLACE)
+    fun insertUser(user: DemoUser)
+
+    // Insert DemoUser list
+    @Insert(onConflict = OnConflictStrategy.REPLACE)
+    fun insertUsers(users: List<DemoUser>)
+
+    // Update
+    @Query("UPDATE DemoUser SET name = :name, avatar = :avatar, remark = :remark WHERE userId = :userId")
+    fun updateUser(userId: String, name: String, avatar: String, remark: String)
+
+    // Update by DemoUser
+    @Update
+    fun updateUser(user: DemoUser)
+
+    // Update DemoUser list
+    @Update
+    fun updateUsers(users: List<DemoUser>)
+
+    // Update name
+    @Query("UPDATE DemoUser SET name = :name WHERE userId = :userId")
+    fun updateUserName(userId: String, name: String)
+
+    // Update avatar
+    @Query("UPDATE DemoUser SET avatar = :avatar WHERE userId = :userId")
+    fun updateUserAvatar(userId: String, avatar: String)
+
+    // Update remark
+    @Query("UPDATE DemoUser SET remark = :remark WHERE userId = :userId")
+    fun updateUserRemark(userId: String, remark: String)
+
+    // Update update times
+    @Query("UPDATE DemoUser SET update_times = update_times + 1 WHERE userId = :userId")
+    fun updateUserTimes(userId: String)
+
+    // Update users update times
+    @Query("UPDATE DemoUser SET update_times = update_times + 1 WHERE userId IN (:userIds)")
+    fun updateUsersTimes(userIds: List<String>)
+
+    /**
+     * Reset the update times of all users.
+     */
+    @Query("UPDATE DemoUser SET update_times = 0")
+    fun resetUsersTimes()
+
+    // Delete
+    @Delete
+    fun deleteUser(user: DemoUser)
+
+    // Delete user list
+    @Delete
+    fun deleteUsers(users: List<DemoUser>)
+
+    // Delete by userId
+    @Query("DELETE FROM DemoUser WHERE userId = :userId")
+    fun deleteUserById(userId: String)
+
+    // Delete by userId list
+    @Query("DELETE FROM DemoUser WHERE userId IN (:userIds)")
+    fun deleteUsersByIds(userIds: List<String>)
+
+
+    // Delete all users
+    @Query("DELETE FROM DemoUser")
+    fun deleteAll()
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/room/entity/DemoUser.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/room/entity/DemoUser.kt
new file mode 100644
index 00000000..09e1bb38
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/room/entity/DemoUser.kt
@@ -0,0 +1,21 @@
+package io.agora.chatdemo.common.room.entity
+
+import androidx.room.ColumnInfo
+import androidx.room.Entity
+import androidx.room.PrimaryKey
+import io.agora.uikit.model.EaseProfile
+
+@Entity
+data class DemoUser(
+    @PrimaryKey val userId: String,
+    val name: String?,
+    val avatar: String?,
+    val remark: String? = null,
+    @ColumnInfo(name = "update_times")
+    var updateTimes: Int = 0
+)
+
+/**
+ * Convert the user data to the profile data.
+ */
+internal fun DemoUser.parse() = EaseProfile(userId, name, avatar, remark)
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/room/extensions/DbEntity.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/room/extensions/DbEntity.kt
new file mode 100644
index 00000000..b584cd86
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/room/extensions/DbEntity.kt
@@ -0,0 +1,15 @@
+package io.agora.chatdemo.common.room.extensions
+
+import io.agora.chatdemo.common.room.entity.DemoUser
+import io.agora.uikit.common.ChatUserInfo
+import io.agora.uikit.model.EaseProfile
+
+internal fun EaseProfile.parseToDbBean() = DemoUser(id, name, avatar, remark)
+
+internal fun ChatUserInfo.parseToDbBean(): DemoUser {
+    return DemoUser(
+        userId = userId,
+        name = nickname,
+        avatar = avatarUrl
+    )
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/room/viewmodel/BusUserViewModel.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/room/viewmodel/BusUserViewModel.kt
new file mode 100644
index 00000000..00bdda6b
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/room/viewmodel/BusUserViewModel.kt
@@ -0,0 +1,130 @@
+package io.agora.chatdemo.common.room.viewmodel
+
+import androidx.lifecycle.ViewModel
+import androidx.lifecycle.ViewModelProvider
+import io.agora.chatdemo.common.room.dao.DemoUserDao
+import io.agora.chatdemo.common.room.entity.DemoUser
+
+class BusUserViewModel(private val userDao: DemoUserDao): ViewModel() {
+
+    /**
+     * Query all users from the database.
+     * @return All users in the database.
+     */
+    fun getAllUsers() = userDao.getAll()
+
+    /**
+     * Query user by id from the database.
+     * @param userId The id of the user.
+     * @return The user with the specified id.
+     */
+    fun getUserById(userId: String) = userDao.getUserById(userId)
+
+    /**
+     * Query users by ids from the database.
+     * @param userIds The ids of the users.
+     * @return The users with the specified ids.
+     */
+    fun getUsersByIds(userIds: List<String>) = userDao.getUsersByIds(userIds)
+
+    /**
+     * Query users by name from the database.
+     * @param name The name of the user.
+     * @return The users with the specified name.
+     */
+    fun getUsersByName(name: String?) = userDao.getUsersByName(name)
+
+    /**
+     * Insert a user into the database.
+     * @param user The user to be inserted.
+     */
+    fun insertUser(user: DemoUser) = userDao.insertUser(user)
+
+    /**
+     * Insert a list of users into the database.
+     * @param users The list of users to be inserted.
+     */
+    fun insertUsers(users: List<DemoUser>) = userDao.insertUsers(users)
+
+    /**
+     * Update a user in the database.
+     * @param userId The id of the user.
+     * @param name The name of the user.
+     * @param avatar The avatar of the user.
+     * @param remark The remark of the user.
+     */
+    fun updateUser(userId: String, name: String, avatar: String, remark: String) = userDao.updateUser(userId, name, avatar, remark)
+
+    /**
+     * Update a user in the database.
+     * @param user The user to be updated.
+     */
+    fun updateUser(user: DemoUser) = userDao.updateUser(user)
+
+    /**
+     * Update a list of users in the database.
+     * @param users The list of users to be updated.
+     */
+    fun updateUsers(users: List<DemoUser>) = userDao.updateUsers(users)
+
+    /**
+     * Update the name of a user in the database.
+     * @param userId The id of the user.
+     * @param name The name of the user.
+     */
+    fun updateUserName(userId: String, name: String) = userDao.updateUserName(userId, name)
+
+    /**
+     * Update the avatar of a user in the database.
+     * @param userId The id of the user.
+     * @param avatar The avatar of the user.
+     */
+    fun updateUserAvatar(userId: String, avatar: String) = userDao.updateUserAvatar(userId, avatar)
+
+    /**
+     * Update the remark of a user in the database.
+     * @param userId The id of the user.
+     * @param remark The remark of the user.
+     */
+    fun updateUserRemark(userId: String, remark: String) = userDao.updateUserRemark(userId, remark)
+
+    /**
+     * Delete a user from the database.
+     * @param user The user to be deleted.
+     */
+    fun deleteUser(user: DemoUser) = userDao.deleteUser(user)
+
+    /**
+     * Delete a list of users from the database.
+     * @param users The list of users to be deleted.
+     */
+    fun deleteUsers(users: List<DemoUser>) = userDao.deleteUsers(users)
+
+    /**
+     * Delete a user from the database.
+     * @param userId The id of the user to be deleted.
+     */
+    fun deleteUserById(userId: String) = userDao.deleteUserById(userId)
+
+    /**
+     * Delete a list of users from the database.
+     * @param userIds The ids of the users to be deleted.
+     */
+    fun deleteUsersByIds(userIds: List<String>) = userDao.deleteUsersByIds(userIds)
+
+    /**
+     * Delete all users from the database.
+     */
+    fun deleteAllUsers() = userDao.deleteAll()
+}
+
+class BusUserViewModelFactory(private val userDao: DemoUserDao): ViewModelProvider.Factory {
+
+    override fun <T : ViewModel> create(modelClass: Class<T>): T {
+        if (modelClass.isAssignableFrom(BusUserViewModel::class.java)) {
+            @Suppress("UNCHECKED_CAST")
+            return BusUserViewModel(userDao) as T
+        }
+        throw IllegalArgumentException("Unknown ViewModel class")
+    }
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/suspend/ChatUserInfoManagerSuspend.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/suspend/ChatUserInfoManagerSuspend.kt
new file mode 100644
index 00000000..f73b2c17
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/suspend/ChatUserInfoManagerSuspend.kt
@@ -0,0 +1,64 @@
+package io.agora.chatdemo.common.suspend
+
+import io.agora.uikit.common.ChatError
+import io.agora.uikit.common.ChatException
+import io.agora.uikit.common.ChatUserInfo
+import io.agora.uikit.common.ChatUserInfoManager
+import io.agora.uikit.common.ChatUserInfoType
+import io.agora.uikit.common.impl.ValueCallbackImpl
+import kotlin.coroutines.resume
+import kotlin.coroutines.resumeWithException
+import kotlin.coroutines.suspendCoroutine
+
+/**
+ * Suspend method for [ChatUserInfoManager.updateOwnInfoByAttribute]
+ * @param type The type of the attribute to be updated
+ * @param value The value of the attribute to be updated
+ */
+suspend fun ChatUserInfoManager.updateOwnAttribute(type: ChatUserInfoType, value: String): Int {
+    return suspendCoroutine { continuation ->
+        updateOwnInfoByAttribute(type, value, ValueCallbackImpl<String>(
+            onSuccess = {
+                continuation.resume(ChatError.EM_NO_ERROR)
+            },
+            onError = { code, message -> continuation.resumeWithException(ChatException(code, message)) }
+        ))
+    }
+}
+
+/**
+ * Suspend method for [ChatUserInfoManager.fetchUserInfoByUserId]
+ * @param userIds The user id list
+ * @return The user information map
+ */
+suspend fun ChatUserInfoManager.fetchUserInfo(userIds: List<String>): Map<String, ChatUserInfo> {
+    return suspendCoroutine { continuation ->
+        fetchUserInfoByUserId(userIds.toTypedArray(), ValueCallbackImpl(
+            onSuccess = { value ->
+                value?.let {
+                    continuation.resume(it)
+                } ?: continuation.resume(emptyMap())
+            },
+            onError = { code, message -> continuation.resumeWithException(ChatException(code, message)) }
+        ))
+    }
+}
+
+/**
+ * Suspend method for [ChatUserInfoManager.fetchUserInfoByAttribute]
+ * @param userIds The user id list
+ * @param attributes The attribute list
+ * @return The user information map
+ */
+suspend fun ChatUserInfoManager.fetUserInfo(userIds: List<String>, attributes: List<ChatUserInfoType>): Map<String, ChatUserInfo> {
+    return suspendCoroutine { continuation ->
+        fetchUserInfoByAttribute(userIds.toTypedArray(), attributes.toTypedArray(), ValueCallbackImpl(
+            onSuccess = { value ->
+                value?.let {
+                    continuation.resume(it)
+                } ?: continuation.resume(emptyMap())
+            },
+            onError = { code, message -> continuation.resumeWithException(ChatException(code, message)) }
+        ))
+    }
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/suspend/PresenceManagerSuspend.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/suspend/PresenceManagerSuspend.kt
new file mode 100644
index 00000000..f91b1f23
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/suspend/PresenceManagerSuspend.kt
@@ -0,0 +1,118 @@
+package io.agora.chatdemo.common.suspend
+
+import io.agora.chatdemo.common.PresenceCache
+import io.agora.uikit.common.ChatError
+import io.agora.uikit.common.ChatException
+import io.agora.uikit.common.ChatPresence
+import io.agora.uikit.common.ChatPresenceManager
+import io.agora.uikit.common.impl.CallbackImpl
+import io.agora.uikit.common.impl.ValueCallbackImpl
+import kotlin.coroutines.resume
+import kotlin.coroutines.resumeWithException
+import kotlin.coroutines.suspendCoroutine
+
+
+/**
+ * Suspend method for [ChatPresenceManager.publishExtPresence]
+ * @param customStatus Custom Status.
+ * @return [ChatError] The error code of the request.
+ */
+suspend fun ChatPresenceManager.publishExtPresence(customStatus:String):Int{
+    return suspendCoroutine { continuation ->
+        publishPresence(customStatus, CallbackImpl(
+            onSuccess = {
+                continuation.resume(ChatError.EM_NO_ERROR)
+            },
+            onError = {code, message ->
+                continuation.resumeWithException(ChatException(code, message))
+            })
+        )
+    }
+}
+
+
+/**
+ * Suspend method for [ChatPresenceManager.fetchUserPresenceStatus]
+ * @param userIds Subscribe userId list.
+ * @return [ChatError] The error code of the request.
+ */
+suspend fun ChatPresenceManager.fetchUserPresenceStatus(userIds:MutableList<String>):MutableList<ChatPresence>{
+    return suspendCoroutine { continuation ->
+        val presence = mutableListOf<ChatPresence>()
+        val ids = mutableListOf<String>()
+        val presenceInfo = PresenceCache.getPresenceInfo
+
+        if (userIds.size > 0){
+            for (userId in userIds) {
+                if (presenceInfo.containsKey(userId)){
+                    val cachePresence = PresenceCache.getUserPresence(userId)
+                    if (cachePresence == null){
+                        ids.add(userId)
+                    }else{
+                        presence.add(cachePresence)
+                    }
+                }else{
+                    ids.add(userId)
+                }
+            }
+        }
+
+        if (ids.isEmpty()){
+            continuation.resume(presence)
+        }else{
+            fetchPresenceStatus(ids, ValueCallbackImpl<MutableList<ChatPresence>>(
+                onSuccess = {
+                    presence.addAll(it)
+                    it.forEach { presence ->
+                        PresenceCache.insertPresences(presence.publisher,presence)
+                    }
+                    continuation.resume(presence)
+                },
+                onError = {code, message ->
+                    continuation.resumeWithException(ChatException(code, message))
+                })
+            )
+        }
+    }
+}
+
+
+/**
+ * Suspend method for [ChatPresenceManager.subscribeUsersPresence]
+ * @param userIds subscribe userId list.
+ * @param expiry The expiration time of the presence subscription.
+ * @return [ChatError] The error code of the request.
+ */
+suspend fun ChatPresenceManager.subscribeUsersPresence(
+    userIds:MutableList<String>,expiry:Long
+):MutableList<ChatPresence>{
+    return suspendCoroutine { continuation ->
+        subscribePresences(userIds,expiry, ValueCallbackImpl<MutableList<ChatPresence>>(
+            onSuccess = {
+                continuation.resume(it)
+            },
+            onError = {code, message ->
+                continuation.resumeWithException(ChatException(code, message))
+            })
+        )
+    }
+}
+
+
+/**
+ * Suspend method for [ChatPresenceManager.unSubscribeUsersPresence]
+ * @param userIds unSubscribe userId list.
+ * @return [ChatError] The error code of the request.
+ */
+suspend fun ChatPresenceManager.unSubscribeUsersPresence(userIds:MutableList<String>):Int{
+    return suspendCoroutine { continuation ->
+        unsubscribePresences(userIds, CallbackImpl(
+            onSuccess = {
+                continuation.resume(ChatError.EM_NO_ERROR)
+            },
+            onError = {code, message ->
+                continuation.resumeWithException(ChatException(code, message))
+            })
+        )
+    }
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/suspend/PushManagerSuspend.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/suspend/PushManagerSuspend.kt
new file mode 100644
index 00000000..6e8fd872
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/common/suspend/PushManagerSuspend.kt
@@ -0,0 +1,45 @@
+package io.agora.chatdemo.common.suspend
+
+import io.agora.uikit.common.ChatException
+import io.agora.uikit.common.ChatPushManager
+import io.agora.uikit.common.ChatSilentModeParam
+import io.agora.uikit.common.ChatSilentModeResult
+import io.agora.uikit.common.impl.ValueCallbackImpl
+import kotlin.coroutines.resume
+import kotlin.coroutines.resumeWithException
+import kotlin.coroutines.suspendCoroutine
+
+/**
+ * Set the silent mode for the App.
+ * @param silentModeParam The silent mode param, see [ChatSilentModeParam].
+ * @return The result of setting silent mode. See [ChatSilentModeResult].
+ */
+suspend fun ChatPushManager.setSilentModeForApp(silentModeParam: ChatSilentModeParam): ChatSilentModeResult {
+    return suspendCoroutine { continuation ->
+        setSilentModeForAll(silentModeParam, ValueCallbackImpl<ChatSilentModeResult>(
+            onSuccess = {
+                continuation.resume(it)
+            },
+            onError = { error, errorDescription ->
+                continuation.resumeWithException(ChatException(error, errorDescription))
+            }
+        ))
+    }
+}
+
+/**
+ * Get the silent mode for the App.
+ * @return The result of getting silent mode. See [ChatSilentModeResult].
+ */
+suspend fun ChatPushManager.getSilentModeForApp(): ChatSilentModeResult {
+    return suspendCoroutine { continuation ->
+        getSilentModeForAll(ValueCallbackImpl<ChatSilentModeResult>(
+            onSuccess = {
+                continuation.resume(it)
+            },
+            onError = { error, errorDescription ->
+                continuation.resumeWithException(ChatException(error, errorDescription))
+            }
+        ))
+    }
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/fcm/FCMMSGService.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/fcm/FCMMSGService.kt
new file mode 100644
index 00000000..45682ddc
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/fcm/FCMMSGService.kt
@@ -0,0 +1,26 @@
+package io.agora.chatdemo.fcm
+
+import com.google.firebase.messaging.FirebaseMessagingService
+import com.google.firebase.messaging.RemoteMessage
+import io.agora.chat.ChatClient
+import io.agora.chatdemo.DemoHelper
+import io.agora.util.EMLog
+
+class FCMMSGService: FirebaseMessagingService() {
+    private val TAG = "FCMMSGService"
+
+    override fun onMessageReceived(remoteMessage: RemoteMessage) {
+        super.onMessageReceived(remoteMessage)
+        if (remoteMessage.data.isNotEmpty()) {
+            val message = remoteMessage.data["alert"]
+            EMLog.i(TAG, "onMessageReceived: $message")
+            DemoHelper.getInstance().getNotifier()?.notify(message)
+        }
+    }
+
+    override fun onNewToken(token: String) {
+        super.onNewToken(token)
+        EMLog.i(TAG, "onNewToken: $token")
+        ChatClient.getInstance().sendFCMTokenToServer(token)
+    }
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/feature/presence/controller/PresenceController.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/feature/presence/controller/PresenceController.kt
new file mode 100644
index 00000000..6b1cb476
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/feature/presence/controller/PresenceController.kt
@@ -0,0 +1,135 @@
+package io.agora.chatdemo.feature.presence.controller
+
+import android.content.Context
+import androidx.core.content.ContextCompat
+import androidx.fragment.app.Fragment
+import androidx.fragment.app.FragmentActivity
+import io.agora.chatdemo.R
+import io.agora.chatdemo.common.DemoConstant
+import io.agora.chatdemo.feature.presence.interfaces.IPresenceResultView
+import io.agora.chatdemo.feature.presence.utils.EasePresenceUtil
+import io.agora.chatdemo.feature.presence.viewmodel.PresenceViewModel
+import io.agora.uikit.common.ChatLog
+import io.agora.uikit.common.ChatPresence
+import io.agora.uikit.common.dialog.CustomDialog
+import io.agora.uikit.common.dialog.SimpleListSheetDialog
+import io.agora.uikit.interfaces.SimpleListSheetItemClickListener
+import io.agora.uikit.model.EaseMenuItem
+
+class PresenceController(
+    private val context: Context,
+    private val presenceVideModel: PresenceViewModel,
+): IPresenceResultView {
+    init {
+        presenceVideModel.attachView(this)
+    }
+    private var presenceDialog: SimpleListSheetDialog? = null
+    private var currentPresence:String? = null
+
+    fun showPresenceStatusDialog(presence: ChatPresence?){
+        val tag = EasePresenceUtil.getPresenceString(context,presence)
+        if (
+            tag == context.getString(R.string.ease_presence_online) ||
+            tag == context.getString(R.string.ease_presence_busy) ||
+            tag == context.getString(R.string.ease_presence_do_not_disturb) ||
+            tag == context.getString(R.string.ease_presence_away) ||
+            tag == context.getString(R.string.ease_presence_offline) || tag.isEmpty()
+        ){ }else{
+            currentPresence = tag
+        }
+
+        presenceDialog = SimpleListSheetDialog(
+            context = context,
+            itemList = defaultItems(),
+            itemListener = object : SimpleListSheetItemClickListener {
+                override fun onItemClickListener(position: Int, menu: EaseMenuItem) {
+                    simpleMenuItemClickListener(position, menu)
+                }
+            })
+        if (context is FragmentActivity){
+            context.supportFragmentManager.let { presenceDialog?.show(it,"presence_status_dialog") }
+        }else if (context is  Fragment){
+            context.parentFragmentManager.let { presenceDialog?.show(it,"presence_status_dialog") }
+        }
+    }
+
+    private fun simpleMenuItemClickListener(position: Int,menu: EaseMenuItem){
+        when(menu.menuId){
+            R.id.presence_status_online -> {
+                presenceVideModel.publishPresence("")
+                presenceDialog?.dismiss()
+            }
+            R.id.presence_status_busy -> {
+                presenceVideModel.publishPresence(DemoConstant.PRESENCE_BUSY)
+                presenceDialog?.dismiss()
+            }
+            R.id.presence_status_do_not_disturb -> {
+                presenceVideModel.publishPresence(DemoConstant.PRESENCE_DO_NOT_DISTURB)
+                presenceDialog?.dismiss()
+            }
+            R.id.presence_status_away -> {
+                presenceVideModel.publishPresence(DemoConstant.PRESENCE_AWAY)
+                presenceDialog?.dismiss()
+            }
+            R.id.presence_status_custom -> {
+                presenceDialog?.dismiss()
+                showCustomDialog()
+            }
+            else -> {}
+        }
+    }
+
+    private fun defaultItems():MutableList<EaseMenuItem>{
+        return mutableListOf(
+            EaseMenuItem(
+                menuId = R.id.presence_status_online,
+                title = context.getString(R.string.ease_presence_online),
+                titleColor = ContextCompat.getColor(context, R.color.color_primary)
+            ),
+            EaseMenuItem(
+                menuId = R.id.presence_status_busy,
+                title = context.getString(R.string.ease_presence_busy),
+                titleColor = ContextCompat.getColor(context, R.color.color_primary)
+            ),
+            EaseMenuItem(
+                menuId = R.id.presence_status_away,
+                title = context.getString(R.string.ease_presence_away),
+                titleColor = ContextCompat.getColor(context, R.color.color_primary)
+            ),
+            EaseMenuItem(
+                menuId = R.id.presence_status_do_not_disturb,
+                title = context.getString(R.string.ease_presence_do_not_disturb),
+                titleColor = ContextCompat.getColor(context, R.color.color_primary)
+            ),
+            EaseMenuItem(
+                menuId = R.id.presence_status_custom,
+                title = context.getString(R.string.ease_presence_custom),
+                titleColor = ContextCompat.getColor(context, R.color.color_primary)
+            )
+        )
+    }
+
+    private fun showCustomDialog(){
+        val customDialog = CustomDialog(
+            context = context,
+            title = context.getString(R.string.presence_dialog_title),
+            inputHint = context.getString(R.string.presence_dialog_input_hint),
+            isEditTextMode = true,
+            onInputModeConfirmListener = {
+                presenceVideModel.publishPresence(it)
+            }
+        )
+        customDialog.show()
+    }
+
+    override fun onPublishPresenceSuccess() {
+        super.onPublishPresenceSuccess()
+        ChatLog.e("ChatPresenceController","onPublishPresenceSuccess")
+    }
+
+    override fun onPublishPresenceFail(code: Int, message: String?) {
+        super.onPublishPresenceFail(code, message)
+        ChatLog.e("ChatPresenceController","onPublishPresenceFail $code $message")
+    }
+
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/feature/presence/interfaces/IPresenceRequest.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/feature/presence/interfaces/IPresenceRequest.kt
new file mode 100644
index 00000000..7d1c5f30
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/feature/presence/interfaces/IPresenceRequest.kt
@@ -0,0 +1,38 @@
+package io.agora.chatdemo.feature.presence.interfaces
+
+import io.agora.chatdemo.interfaces.IAttachView
+
+interface IPresenceRequest: IAttachView {
+
+    /**
+     * Publish your own status
+     */
+    fun publishPresence(ext:String?){}
+
+    /**
+     * Gets the current presence state of users.
+     * @param userIds The array of IDs of users whose current presence state you want to check.
+     */
+    fun fetchPresenceStatus(userIds:MutableList<String>?){}
+
+    /**
+     * Subscribes to a user's presence states. If the subscription succeeds, the subscriber will receive the callback when the user's presence state changes.
+     * @param userIds Subscription ID List
+     * @param expiry The expiration time of the presence subscription.
+     */
+    fun subscribePresences(userIds:MutableList<String>?,expiry:Long?=null){}
+
+    /**
+     * Unsubscribes from a user's presence states.
+     * @param userIds Subscription ID List
+     */
+    fun unsubscribePresences(userIds:MutableList<String>?){}
+
+
+    /**
+     * fetch the current user status of a specified user
+     * @param userIds
+     */
+    fun fetchChatPresence(userIds:MutableList<String>)
+
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/feature/presence/interfaces/IPresenceResultView.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/feature/presence/interfaces/IPresenceResultView.kt
new file mode 100644
index 00000000..bfca2e2f
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/feature/presence/interfaces/IPresenceResultView.kt
@@ -0,0 +1,61 @@
+package io.agora.chatdemo.feature.presence.interfaces
+
+import io.agora.uikit.common.ChatPresence
+import io.agora.uikit.common.interfaces.IControlDataView
+
+interface IPresenceResultView: IControlDataView {
+
+    /**
+     * Publish custom status success
+     */
+    fun onPublishPresenceSuccess(){}
+
+    /**
+     * Publish custom status fail
+     */
+    fun onPublishPresenceFail(code: Int,  message: String?){}
+
+    /**
+     * Gets the current presence state of users success
+     */
+    fun fetchPresenceStatusSuccess(presence:MutableList<ChatPresence>){}
+
+    /**
+     * Gets the current presence state of users fail
+     */
+    fun fetchPresenceStatusFail(code: Int,  message: String?){}
+
+    /**
+     * Subscribe user status success
+     */
+    fun subscribePresenceSuccess(result: MutableList<ChatPresence>){}
+
+    /**
+     * Subscribe user status fail
+     */
+    fun subscribePresenceFail(code: Int,  message: String?){}
+
+    /**
+     * unSubscribe user status success
+     */
+    fun unSubscribePresenceSuccess(){}
+
+    /**
+     * unSubscribe user status fail
+     */
+    fun unSubscribePresenceFail(code: Int,  message: String?){}
+
+    /**
+     * fetch the current user status of a specified user success.
+     * @param presence
+     */
+    fun fetchChatPresenceSuccess(presence:MutableList<ChatPresence>){}
+
+    /**
+     * fetch the current user status of a specified user fail.
+     * @param code  error code.
+     * @param error error message.
+     */
+    fun fetchChatPresenceFail(code: Int, error: String){}
+
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/feature/presence/repository/ChatPresenceRepository.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/feature/presence/repository/ChatPresenceRepository.kt
new file mode 100644
index 00000000..4d355f2b
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/feature/presence/repository/ChatPresenceRepository.kt
@@ -0,0 +1,39 @@
+package io.agora.chatdemo.feature.presence.repository
+
+import io.agora.chatdemo.common.suspend.fetchUserPresenceStatus
+import io.agora.chatdemo.common.suspend.publishExtPresence
+import io.agora.chatdemo.common.suspend.subscribeUsersPresence
+import io.agora.chatdemo.common.suspend.unSubscribeUsersPresence
+import io.agora.uikit.common.ChatClient
+import io.agora.uikit.common.ChatPresenceManager
+import kotlinx.coroutines.Dispatchers
+import kotlinx.coroutines.withContext
+
+class ChatPresenceRepository(
+    private val presenceManager: ChatPresenceManager = ChatClient.getInstance().presenceManager(),
+) {
+
+    suspend fun publishPresence(customStatus: String) =
+        withContext(Dispatchers.IO) {
+            presenceManager.publishExtPresence(customStatus)
+        }
+
+
+    suspend fun subscribePresences(userIds:MutableList<String>,expiry:Long) =
+        withContext(Dispatchers.IO) {
+            presenceManager.subscribeUsersPresence(userIds,expiry)
+        }
+
+
+    suspend fun unSubscribePresences(userIds:MutableList<String>) =
+        withContext(Dispatchers.IO) {
+            presenceManager.unSubscribeUsersPresence(userIds)
+        }
+
+    suspend fun fetchPresenceStatus(userIds:MutableList<String>) =
+        withContext(Dispatchers.IO) {
+            presenceManager.fetchUserPresenceStatus(userIds)
+        }
+
+
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/feature/presence/utils/EasePresenceUtil.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/feature/presence/utils/EasePresenceUtil.kt
new file mode 100644
index 00000000..494a0e64
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/feature/presence/utils/EasePresenceUtil.kt
@@ -0,0 +1,101 @@
+package io.agora.chatdemo.feature.presence.utils
+
+import android.content.Context
+import android.text.TextUtils
+import androidx.annotation.DrawableRes
+import io.agora.chatdemo.bean.PresenceData
+import io.agora.chatdemo.common.DemoConstant
+import io.agora.uikit.common.ChatPresence
+
+object EasePresenceUtil {
+
+    fun getPresenceString(context: Context, presence: ChatPresence?): String {
+        if (presence != null) {
+            var isOnline = false
+            val statusList: Map<String?, Int> = presence.statusList
+            for (entry in statusList) {
+                if (entry.value == 1){
+                    isOnline = true
+                    break
+                }
+            }
+
+            if (isOnline) {
+                val ext: String = presence.ext
+                return if (TextUtils.isEmpty(ext) || TextUtils.equals(
+                        ext,
+                        DemoConstant.PRESENCE_ONLINE
+                    )
+                ) {
+                    context.getString(PresenceData.ONLINE.presence)
+                } else if (TextUtils.equals(
+                        ext,
+                        DemoConstant.PRESENCE_BUSY
+                    )
+                ) {
+                    context.getString(PresenceData.BUSY.presence)
+                } else if (TextUtils.equals(
+                        ext,
+                        DemoConstant.PRESENCE_DO_NOT_DISTURB
+                    )
+                ) {
+                    context.getString(PresenceData.DO_NOT_DISTURB.presence)
+                } else if (TextUtils.equals(
+                        ext,
+                        DemoConstant.PRESENCE_AWAY
+                    )
+                ) {
+                    context.getString(PresenceData.AWAY.presence)
+                } else {
+                    ext
+                }
+            }
+        }
+        return context.getString(PresenceData.OFFLINE.presence)
+    }
+
+    @DrawableRes
+    fun getPresenceIcon(context: Context, presence: ChatPresence?): Int {
+        if (presence != null){
+            var isOnline = false
+            val statusList: Map<String?, Int> = presence.statusList
+            for (entry in statusList) {
+                if (entry.value == 1){
+                    isOnline = true
+                    break
+                }
+            }
+            if (isOnline) {
+                val ext: String = presence.ext
+                return if (TextUtils.isEmpty(ext) || TextUtils.equals(
+                        ext,
+                        DemoConstant.PRESENCE_ONLINE
+                    )
+                ) {
+                    PresenceData.ONLINE.presenceIcon
+                } else if (TextUtils.equals(
+                        ext,
+                        DemoConstant.PRESENCE_BUSY
+                    )
+                ) {
+                    PresenceData.BUSY.presenceIcon
+                } else if (TextUtils.equals(
+                        ext,
+                        DemoConstant.PRESENCE_DO_NOT_DISTURB
+                    )
+                ) {
+                    PresenceData.DO_NOT_DISTURB.presenceIcon
+                } else if (TextUtils.equals(
+                        ext,
+                        DemoConstant.PRESENCE_AWAY
+                    )
+                ) {
+                    PresenceData.AWAY.presenceIcon
+                } else {
+                    PresenceData.CUSTOM.presenceIcon
+                }
+            }
+        }
+        return PresenceData.OFFLINE.presenceIcon
+    }
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/feature/presence/viewmodel/PresenceViewModel.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/feature/presence/viewmodel/PresenceViewModel.kt
new file mode 100644
index 00000000..05d48bcc
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/feature/presence/viewmodel/PresenceViewModel.kt
@@ -0,0 +1,96 @@
+package io.agora.chatdemo.feature.presence.viewmodel
+
+import androidx.lifecycle.viewModelScope
+import io.agora.chatdemo.feature.presence.interfaces.IPresenceRequest
+import io.agora.chatdemo.feature.presence.interfaces.IPresenceResultView
+import io.agora.chatdemo.feature.presence.repository.ChatPresenceRepository
+import io.agora.uikit.common.extensions.catchChatException
+import io.agora.uikit.viewmodel.EaseBaseViewModel
+import kotlinx.coroutines.flow.flow
+import kotlinx.coroutines.launch
+
+class PresenceViewModel: EaseBaseViewModel<IPresenceResultView>(), IPresenceRequest {
+
+    private val presenceRepository by lazy { ChatPresenceRepository() }
+    private val expiryTime = (7 * 24 * 60 * 60).toLong()
+
+    override fun publishPresence(ext: String?) {
+        viewModelScope.launch {
+            flow {
+                ext?.let {
+                    emit(presenceRepository.publishPresence(it))
+                }
+            }
+                .catchChatException { e ->
+                    view?.onPublishPresenceFail(e.errorCode, e.description)
+                }
+                .collect {
+                    view?.onPublishPresenceSuccess()
+                }
+        }
+    }
+
+    override fun fetchPresenceStatus(userIds: MutableList<String>?) {
+        viewModelScope.launch {
+            flow {
+                userIds?.let {
+                    emit(presenceRepository.fetchPresenceStatus(it))
+                }
+            }
+                .catchChatException { e ->
+                    view?.fetchPresenceStatusFail(e.errorCode, e.description)
+                }
+                .collect {
+                    view?.fetchPresenceStatusSuccess(it)
+                }
+        }
+    }
+
+    override fun subscribePresences(userIds: MutableList<String>?, expiry: Long?) {
+        viewModelScope.launch {
+            flow {
+                userIds?.let {
+                    emit(presenceRepository.subscribePresences(it,expiry?:expiryTime))
+                }
+            }
+                .catchChatException { e ->
+                    view?.subscribePresenceFail(e.errorCode, e.description)
+                }
+                .collect {
+                    view?.subscribePresenceSuccess(it)
+                }
+        }
+    }
+
+    override fun unsubscribePresences(userIds: MutableList<String>?) {
+        viewModelScope.launch {
+            flow {
+                userIds?.let {
+                    emit(presenceRepository.unSubscribePresences(it))
+                }
+            }
+                .catchChatException { e ->
+                    view?.unSubscribePresenceFail(e.errorCode, e.description)
+                }
+                .collect {
+                    view?.unSubscribePresenceSuccess()
+                }
+        }
+    }
+
+    override fun fetchChatPresence(userIds: MutableList<String>) {
+        viewModelScope.launch {
+            flow {
+                emit(presenceRepository.fetchPresenceStatus(userIds))
+            }
+                .catchChatException { e->
+                    view?.fetchChatPresenceFail(e.errorCode, e.description)
+                }
+                .collect {
+                    view?.fetchChatPresenceSuccess(it)
+                }
+        }
+    }
+
+
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/interfaces/IAttachView.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/interfaces/IAttachView.kt
new file mode 100644
index 00000000..07c731ec
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/interfaces/IAttachView.kt
@@ -0,0 +1,10 @@
+package io.agora.chatdemo.interfaces
+
+import io.agora.uikit.common.interfaces.IControlDataView
+
+
+interface IAttachView {
+    fun attachView(view: IControlDataView)
+
+    fun detachView()
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/interfaces/IMainRequest.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/interfaces/IMainRequest.kt
new file mode 100644
index 00000000..270dfefb
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/interfaces/IMainRequest.kt
@@ -0,0 +1,15 @@
+package io.agora.chatdemo.interfaces
+
+
+interface IMainRequest: IAttachView {
+
+    /**
+     * Get all unread message count.
+     */
+    fun getUnreadMessageCount()
+
+    /**
+     * Get all unread request count.
+     */
+    fun getRequestUnreadCount()
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/interfaces/IMainResultView.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/interfaces/IMainResultView.kt
new file mode 100644
index 00000000..0b74ddff
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/interfaces/IMainResultView.kt
@@ -0,0 +1,16 @@
+package io.agora.chatdemo.interfaces
+
+import io.agora.uikit.common.interfaces.IControlDataView
+
+interface IMainResultView: IControlDataView {
+
+    /**
+     * Get unread message count successfully.
+     */
+    fun getUnreadCountSuccess(count: String?)
+
+    /**
+     * Get all unread request count successfully.
+     */
+    fun getRequestUnreadCountSuccess(count: String?)
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/interfaces/LanguageListItemSelectListener.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/interfaces/LanguageListItemSelectListener.kt
new file mode 100644
index 00000000..e228db88
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/interfaces/LanguageListItemSelectListener.kt
@@ -0,0 +1,8 @@
+package io.agora.chatdemo.interfaces
+
+import io.agora.chatdemo.bean.Language
+
+
+interface LanguageListItemSelectListener {
+    fun onSelectListener(position:Int,language: Language)
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/chat/ChatActivity.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/chat/ChatActivity.kt
new file mode 100644
index 00000000..e676e8f4
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/chat/ChatActivity.kt
@@ -0,0 +1,48 @@
+package io.agora.chatdemo.page.chat
+
+import io.agora.chatdemo.R
+import io.agora.uikit.EaseIM
+import io.agora.uikit.common.ChatMessage
+import io.agora.uikit.common.extensions.showToast
+import io.agora.uikit.feature.chat.EaseChatFragment
+import io.agora.uikit.feature.chat.activities.EaseChatActivity
+import io.agora.uikit.feature.chat.interfaces.OnMessageForwardCallback
+import io.agora.uikit.feature.chat.interfaces.OnModifyMessageListener
+import io.agora.uikit.feature.chat.interfaces.OnSendCombineMessageCallback
+
+class ChatActivity: EaseChatActivity() {
+
+    override fun setChildSettings(builder: EaseChatFragment.Builder) {
+        super.setChildSettings(builder)
+        builder.setOnMessageForwardCallback(object : OnMessageForwardCallback {
+            override fun onForwardSuccess(message: ChatMessage?) {
+                mContext.showToast(R.string.message_forward_success)
+            }
+
+            override fun onForwardError(code: Int, errorMsg: String?) {
+                mContext.showToast(R.string.message_forward_fail)
+            }
+        })
+        builder.setOnSendCombineMessageCallback(object : OnSendCombineMessageCallback {
+            override fun onSendCombineSuccess(message: ChatMessage?) {
+                mContext.showToast(R.string.message_combine_success)
+            }
+
+            override fun onSendCombineError(message: ChatMessage?, code: Int, errorMsg: String?) {
+                mContext.showToast(R.string.message_combine_fail)
+            }
+        })
+        builder.setOnModifyMessageListener(object : OnModifyMessageListener {
+            override fun onModifyMessageSuccess(messageModified: ChatMessage?) {
+
+            }
+
+            override fun onModifyMessageFailure(messageId: String?, code: Int, error: String?) {
+                mContext.showToast(R.string.message_modify_fail)
+            }
+        })
+        builder.turnOnTypingMonitor(EaseIM.getConfig()?.chatConfig?.enableChatTyping?:true)
+        builder.setCustomFragment(ChatFragment())
+            .setCustomAdapter(CustomMessagesAdapter())
+    }
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/chat/ChatFragment.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/chat/ChatFragment.kt
new file mode 100644
index 00000000..a95ed0a1
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/chat/ChatFragment.kt
@@ -0,0 +1,130 @@
+package io.agora.chatdemo.page.chat
+
+import android.os.Bundle
+import android.text.TextUtils
+import android.util.Log
+import android.view.MenuItem
+import android.view.View
+import androidx.lifecycle.ViewModelProvider
+import io.agora.chatdemo.R
+import io.agora.chatdemo.callkit.CallKitManager
+import io.agora.chatdemo.common.DemoConstant
+import io.agora.chatdemo.common.PresenceCache
+import io.agora.chatdemo.common.helper.MenuFilterHelper
+import io.agora.chatdemo.feature.presence.interfaces.IPresenceRequest
+import io.agora.chatdemo.feature.presence.interfaces.IPresenceResultView
+import io.agora.chatdemo.feature.presence.utils.EasePresenceUtil
+import io.agora.chatdemo.feature.presence.viewmodel.PresenceViewModel
+import io.agora.uikit.EaseIM
+import io.agora.uikit.common.ChatMessage
+import io.agora.uikit.common.ChatPresence
+import io.agora.uikit.common.bus.EaseFlowBus
+import io.agora.uikit.feature.chat.EaseChatFragment
+import io.agora.uikit.feature.chat.enums.EaseChatType
+import io.agora.uikit.feature.chat.widgets.EaseChatLayout
+import io.agora.uikit.menu.chat.EaseChatMenuHelper
+import io.agora.uikit.model.EaseEvent
+
+class ChatFragment: EaseChatFragment() , IPresenceResultView {
+    private var presenceViewModel: IPresenceRequest? = null
+    override fun initView(savedInstanceState: Bundle?) {
+        super.initView(savedInstanceState)
+        binding?.titleBar?.inflateMenu(R.menu.demo_chat_menu)
+        updatePresence()
+    }
+
+    override fun initEventBus() {
+        super.initEventBus()
+        EaseFlowBus.with<EaseEvent>(EaseEvent.EVENT.UPDATE + EaseEvent.TYPE.CONTACT + DemoConstant.EVENT_UPDATE_USER_SUFFIX).register(this) {
+            if (it.isContactChange && it.message.isNullOrEmpty().not()) {
+                val userId = it.message
+                if (chatType == EaseChatType.SINGLE_CHAT && userId == conversationId) {
+                    setDefaultHeader(true)
+                }
+                binding?.layoutChat?.chatMessageListLayout?.refreshMessages()
+            }
+        }
+        EaseFlowBus.with<EaseEvent>(EaseEvent.EVENT.UPDATE.name).register(this) {
+            if (it.isPresenceChange && it.message.equals(conversationId) ) {
+                updatePresence()
+            }
+        }
+    }
+
+    override fun initViewModel() {
+        super.initViewModel()
+        presenceViewModel = ViewModelProvider(this)[PresenceViewModel::class.java]
+        presenceViewModel?.attachView(this)
+    }
+
+    override fun initData() {
+        super.initData()
+        conversationId?.let {
+            if (it != EaseIM.getCurrentUser()?.id){
+                presenceViewModel?.fetchChatPresence(mutableListOf(it))
+                presenceViewModel?.subscribePresences(mutableListOf(it))
+            }
+        }
+    }
+
+    override fun setMenuItemClick(item: MenuItem): Boolean {
+        when(item.itemId) {
+            R.id.chat_menu_video_call -> {
+                showVideoCall()
+                return true
+            }
+        }
+        return super.setMenuItemClick(item)
+    }
+
+    private fun showVideoCall() {
+        CallKitManager.showSelectDialog(chatType, mContext, conversationId)
+    }
+
+    override fun onPreMenu(helper: EaseChatMenuHelper?, message: ChatMessage?) {
+        super.onPreMenu(helper, message)
+        MenuFilterHelper.filterMenu(helper, message)
+    }
+
+    private fun updatePresence(){
+        if (chatType == EaseChatType.SINGLE_CHAT){
+            conversationId?.let {
+                val presence = PresenceCache.getUserPresence(it)
+                presence?.let {
+                    val logoStatus = EasePresenceUtil.getPresenceIcon(mContext,presence)
+                    val subtitle = EasePresenceUtil.getPresenceString(mContext,presence)
+                    binding?.run{
+                        titleBar.setLogoStatusMargin(end = -1, bottom = -1)
+                        titleBar.setLogoStatus(logoStatus)
+                        titleBar.setSubtitle(subtitle)
+                        titleBar.getStatusView().visibility = View.VISIBLE
+                        titleBar.setLogoStatusSize(resources.getDimensionPixelSize(R.dimen.em_title_bar_status_icon_size))
+                    }
+                }
+            }
+        }
+    }
+
+    override fun onPeerTyping(action: String?) {
+        if (TextUtils.equals(action, EaseChatLayout.ACTION_TYPING_BEGIN)) {
+            binding?.titleBar?.setSubtitle(getString(io.agora.uikit.R.string.alert_during_typing))
+            binding?.titleBar?.visibility = View.VISIBLE
+        } else if (TextUtils.equals(action, EaseChatLayout.ACTION_TYPING_END)) {
+            updatePresence()
+        }
+    }
+
+
+    override fun onDestroy() {
+        conversationId?.let {
+            if (it != EaseIM.getCurrentUser()?.id){
+                presenceViewModel?.unsubscribePresences(mutableListOf(it))
+            }
+        }
+        super.onDestroy()
+    }
+
+    override fun fetchChatPresenceSuccess(presence: MutableList<ChatPresence>) {
+        updatePresence()
+    }
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/chat/CustomMessagesAdapter.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/chat/CustomMessagesAdapter.kt
new file mode 100644
index 00000000..29664c11
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/chat/CustomMessagesAdapter.kt
@@ -0,0 +1,52 @@
+package io.agora.chatdemo.page.chat
+
+import android.text.TextUtils
+import android.view.ViewGroup
+import io.agora.chat.callkit.general.EaseCallType
+import io.agora.chat.callkit.utils.EaseCallMsgUtils
+import io.agora.chatdemo.callkit.MultipleInviteViewHolder
+import io.agora.chatdemo.callkit.ChatVoiceCallViewHolder
+import io.agora.chatdemo.callkit.views.ChatRowConferenceInvite
+import io.agora.chatdemo.callkit.views.ChatRowVoiceCall
+import io.agora.uikit.common.ChatMessage
+import io.agora.uikit.common.ChatMessageDirection
+import io.agora.uikit.feature.chat.adapter.EaseMessagesAdapter
+
+class CustomMessagesAdapter: EaseMessagesAdapter() {
+
+    companion object {
+        const val VIEW_TYPE_MESSAGE_CALL_SEND = 1000
+        const val VIEW_TYPE_MESSAGE_CALL_RECEIVE = 1001
+        const val VIEW_TYPE_MESSAGE_INVITE_SEND = 1002
+        const val VIEW_TYPE_MESSAGE_INVITE_RECEIVE = 1003
+    }
+    //继承EaseMessagesAdapter 重写getItemNotEmptyViewType 添加自定义ViewType
+    //下方示例 增加自定义 call 消息提醒类型
+    override fun getItemNotEmptyViewType(position: Int): Int {
+        getItem(position)?.let {
+            val msgType = it.getStringAttribute(EaseCallMsgUtils.CALL_MSG_TYPE,"")
+            val callType = it.getIntAttribute(EaseCallMsgUtils.CALL_TYPE, 0)
+            if (TextUtils.equals(msgType, EaseCallMsgUtils.CALL_MSG_INFO)) {
+                if (callType == EaseCallType.CONFERENCE_VIDEO_CALL.ordinal || callType == EaseCallType.CONFERENCE_VOICE_CALL.ordinal) {
+                    return if (it.direct() == ChatMessageDirection.SEND) VIEW_TYPE_MESSAGE_INVITE_SEND else VIEW_TYPE_MESSAGE_INVITE_RECEIVE
+                }
+                return if (it.direct() == ChatMessageDirection.SEND) VIEW_TYPE_MESSAGE_CALL_SEND else VIEW_TYPE_MESSAGE_CALL_RECEIVE
+            }
+        }
+        return super.getItemNotEmptyViewType(position)
+    }
+
+    // 继承EaseMessagesAdapter getViewHolder 添加自定义ViewHolder 和 ui布局
+    // 下方示例 增加单聊、群聊 call 消息提醒类型布局和事件处理
+    override fun getViewHolder(parent: ViewGroup, viewType: Int): ViewHolder<ChatMessage> {
+        when (viewType) {
+            VIEW_TYPE_MESSAGE_CALL_SEND, VIEW_TYPE_MESSAGE_CALL_RECEIVE -> {
+                return ChatVoiceCallViewHolder(ChatRowVoiceCall(parent.context, isSender = viewType == VIEW_TYPE_MESSAGE_CALL_SEND))
+            }
+            VIEW_TYPE_MESSAGE_INVITE_SEND, VIEW_TYPE_MESSAGE_INVITE_RECEIVE -> {
+                return MultipleInviteViewHolder(ChatRowConferenceInvite(parent.context, isSender = viewType == VIEW_TYPE_MESSAGE_INVITE_SEND))
+            }
+        }
+        return super.getViewHolder(parent, viewType)
+    }
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/contact/ChatContactCheckActivity.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/contact/ChatContactCheckActivity.kt
new file mode 100644
index 00000000..22930916
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/contact/ChatContactCheckActivity.kt
@@ -0,0 +1,59 @@
+package io.agora.chatdemo.page.contact
+
+import androidx.appcompat.content.res.AppCompatResources
+import androidx.lifecycle.ViewModelProvider
+import androidx.lifecycle.lifecycleScope
+import coil.load
+import io.agora.chatdemo.DemoHelper
+import io.agora.chatdemo.common.DemoConstant
+import io.agora.chatdemo.common.room.entity.parse
+import io.agora.chatdemo.common.room.extensions.parseToDbBean
+import io.agora.chatdemo.viewmodel.ProfileInfoViewModel
+import io.agora.uikit.EaseIM
+import io.agora.uikit.common.ChatClient
+import io.agora.uikit.common.ChatLog
+import io.agora.uikit.common.ChatUserInfoType
+import io.agora.uikit.common.bus.EaseFlowBus
+import io.agora.uikit.common.extensions.catchChatException
+import io.agora.uikit.feature.contact.EaseContactCheckActivity
+import io.agora.uikit.model.EaseEvent
+import kotlinx.coroutines.launch
+
+class ChatContactCheckActivity: EaseContactCheckActivity() {
+    private lateinit var model: ProfileInfoViewModel
+
+    override fun initData() {
+        super.initData()
+        model = ViewModelProvider(this)[ProfileInfoViewModel::class.java]
+        lifecycleScope.launch {
+            user?.let { user->
+                model.fetchUserInfoAttribute(listOf(user.userId), listOf(ChatUserInfoType.NICKNAME, ChatUserInfoType.AVATAR_URL))
+                    .catchChatException {
+                        ChatLog.e("ChatContactCheckActivity", "fetchUserInfoAttribute error: ${it.description}")
+                    }
+                    .collect {
+                        it[user.userId]?.parseToDbBean()?.let { u->
+                            u.parse().apply {
+                                EaseIM.updateUsersInfo(mutableListOf(this))
+                                DemoHelper.getInstance().getDataModel().insertUser(this)
+                            }
+                            updateUserInfo()
+                        }
+                    }
+            }
+        }
+    }
+
+    private fun updateUserInfo() {
+        DemoHelper.getInstance().getDataModel().getUser(user?.userId)?.let {
+            val ph = AppCompatResources.getDrawable(this, io.agora.uikit.R.drawable.ease_default_avatar)
+            val ep = AppCompatResources.getDrawable(this, io.agora.uikit.R.drawable.ease_default_avatar)
+            binding.ivAvatar.load(it.parse().avatar ?: ph) {
+                placeholder(ph)
+                error(ep)
+            }
+            binding.tvName.text = it.name?.ifEmpty { it.userId } ?: it.userId
+        }
+    }
+
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/contact/ChatContactDetailActivity.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/contact/ChatContactDetailActivity.kt
new file mode 100644
index 00000000..f45b9337
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/contact/ChatContactDetailActivity.kt
@@ -0,0 +1,156 @@
+package io.agora.chatdemo.page.contact
+
+import android.view.View
+import androidx.core.content.ContextCompat
+import androidx.lifecycle.ViewModelProvider
+import androidx.lifecycle.lifecycleScope
+import io.agora.chatdemo.DemoHelper
+import io.agora.chatdemo.R
+import io.agora.chatdemo.callkit.CallKitManager
+import io.agora.chatdemo.common.DemoConstant
+import io.agora.chatdemo.common.PresenceCache
+import io.agora.chatdemo.common.room.entity.parse
+import io.agora.chatdemo.common.room.extensions.parseToDbBean
+import io.agora.chatdemo.feature.presence.interfaces.IPresenceResultView
+import io.agora.chatdemo.feature.presence.utils.EasePresenceUtil
+import io.agora.chatdemo.feature.presence.viewmodel.PresenceViewModel
+import io.agora.chatdemo.viewmodel.ProfileInfoViewModel
+import io.agora.uikit.EaseIM
+import io.agora.uikit.common.ChatLog
+import io.agora.uikit.common.ChatPresence
+import io.agora.uikit.common.ChatUserInfoType
+import io.agora.uikit.common.bus.EaseFlowBus
+import io.agora.uikit.common.extensions.catchChatException
+import io.agora.uikit.common.extensions.toProfile
+import io.agora.uikit.feature.contact.EaseContactDetailsActivity
+import io.agora.uikit.model.EaseEvent
+import io.agora.uikit.model.EaseMenuItem
+import kotlinx.coroutines.launch
+
+
+class ChatContactDetailActivity: EaseContactDetailsActivity(), IPresenceResultView {
+    private lateinit var model: ProfileInfoViewModel
+    private lateinit var presenceModel: PresenceViewModel
+
+    companion object {
+        private const val TAG = "ChatContactDetailActivity"
+    }
+
+    override fun initView() {
+        super.initView()
+        model = ViewModelProvider(this)[ProfileInfoViewModel::class.java]
+        presenceModel = ViewModelProvider(this)[PresenceViewModel::class.java]
+        presenceModel.attachView(this)
+        updateUserInfo()
+    }
+
+    override fun initEvent() {
+        super.initEvent()
+        EaseFlowBus.with<EaseEvent>(EaseEvent.EVENT.UPDATE.name).register(this) {
+            if (it.isPresenceChange ) {
+                updatePresence()
+            }
+        }
+    }
+
+    override fun initData() {
+        super.initData()
+        user?.let {
+            presenceModel.fetchChatPresence(mutableListOf(it.userId))
+        }
+        lifecycleScope.launch {
+            user?.let { user->
+                model.fetchUserInfoAttribute(listOf(user.userId), listOf(ChatUserInfoType.NICKNAME, ChatUserInfoType.AVATAR_URL))
+                    .catchChatException {
+                        ChatLog.e("ContactDetail", "fetchUserInfoAttribute error: ${it.description}")
+                    }
+                    .collect {
+                        it[user.userId]?.parseToDbBean()?.let {u->
+                            u.parse().apply {
+                                EaseIM.updateUsersInfo(mutableListOf(this))
+                                DemoHelper.getInstance().getDataModel().insertUser(this)
+                            }
+                            updateUserInfo()
+                            notifyUpdateRemarkEvent()
+                        }
+                    }
+            }
+        }
+    }
+
+    private fun updateUserInfo() {
+        DemoHelper.getInstance().getDataModel().getUser(user?.userId)?.let {
+            binding.epPresence.setUserAvatarData(it.parse())
+            binding.tvName.text = it.parse().getNotEmptyName()
+            binding.tvNumber.text = it.userId
+        }
+    }
+
+    override fun getDetailItem(): MutableList<EaseMenuItem>? {
+        val list = super.getDetailItem()
+        val audioItem = EaseMenuItem(
+            title = getString(R.string.detail_item_audio),
+            resourceId = io.agora.uikit.R.drawable.ease_phone_pick,
+            menuId = R.id.contact_item_audio_call,
+            titleColor = ContextCompat.getColor(this, R.color.color_primary),
+            order = 2
+        )
+
+        val videoItem = EaseMenuItem(
+            title = getString(R.string.detail_item_video),
+            resourceId = io.agora.uikit.R.drawable.ease_video_camera,
+            menuId = R.id.contact_item_video_call,
+            titleColor = ContextCompat.getColor(this, R.color.color_primary),
+            order = 3
+        )
+        list?.add(audioItem)
+        list?.add(videoItem)
+        return list
+    }
+
+    override fun onMenuItemClick(item: EaseMenuItem?, position: Int): Boolean {
+        item?.let {
+            when(item.menuId){
+                R.id.contact_item_audio_call -> {
+                    CallKitManager.startSingleAudioCall(user?.userId)
+                    return true
+                }
+                R.id.contact_item_video_call -> {
+                    CallKitManager.startSingleVideoCall(user?.userId)
+                    return true
+                }
+                else -> {
+                    return super.onMenuItemClick(item, position)
+                }
+            }
+        }
+        return false
+    }
+
+
+    private fun notifyUpdateRemarkEvent() {
+        EaseFlowBus.with<EaseEvent>(EaseEvent.EVENT.UPDATE + EaseEvent.TYPE.CONTACT + DemoConstant.EVENT_UPDATE_USER_SUFFIX)
+            .post(lifecycleScope, EaseEvent(DemoConstant.EVENT_UPDATE_USER_SUFFIX, EaseEvent.TYPE.CONTACT, user?.userId))
+    }
+
+    private fun updatePresence(){
+        val map = PresenceCache.getPresenceInfo
+        user?.let { user->
+            map.let {
+                binding.epPresence.getStatusView().visibility = View.VISIBLE
+                binding.epPresence.setUserAvatarData(user.toProfile(),
+                    EasePresenceUtil.getPresenceIcon(mContext,it[user.userId]))
+            }
+        }
+    }
+
+    override fun fetchChatPresenceSuccess(presence: MutableList<ChatPresence>) {
+        ChatLog.e(TAG,"fetchChatPresenceSuccess $presence")
+        updatePresence()
+    }
+
+    override fun fetchChatPresenceFail(code: Int, error: String) {
+        ChatLog.e(TAG,"fetchChatPresenceFail $code $error")
+    }
+
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/contact/ChatContactListFragmentEvent.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/contact/ChatContactListFragmentEvent.kt
new file mode 100644
index 00000000..2dbdb939
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/contact/ChatContactListFragmentEvent.kt
@@ -0,0 +1,121 @@
+package io.agora.chatdemo.page.contact
+
+import android.os.Bundle
+import android.view.View
+import android.view.ViewGroup
+import androidx.core.content.ContextCompat
+import androidx.lifecycle.ViewModelProvider
+import io.agora.chatdemo.R
+import io.agora.chatdemo.common.DemoConstant
+import io.agora.chatdemo.common.PresenceCache
+import io.agora.chatdemo.feature.presence.controller.PresenceController
+import io.agora.chatdemo.feature.presence.utils.EasePresenceUtil
+import io.agora.chatdemo.feature.presence.viewmodel.PresenceViewModel
+import io.agora.uikit.EaseIM
+import io.agora.uikit.common.ChatLog
+import io.agora.uikit.common.bus.EaseFlowBus
+import io.agora.uikit.common.extensions.dpToPx
+import io.agora.uikit.configs.setAvatarStyle
+import io.agora.uikit.configs.setStatusStyle
+import io.agora.uikit.feature.contact.EaseContactsListFragment
+import io.agora.uikit.model.EaseEvent
+import io.agora.uikit.model.EaseUser
+
+class ChatContactListFragmentEvent : EaseContactsListFragment() {
+
+    private var isFirstLoadData = false
+    private val presenceViewModel by lazy { ViewModelProvider(this)[PresenceViewModel::class.java] }
+    private val presenceController by lazy { PresenceController(mContext, presenceViewModel) }
+    companion object{
+        private val TAG = ChatContactListFragmentEvent::class.java.simpleName
+    }
+
+    override fun initView(savedInstanceState: Bundle?) {
+        super.initView(savedInstanceState)
+        binding?.titleContact?.let {
+            it.setTitle("")
+            it.setTitleEndDrawable(R.drawable.contact_title)
+        }
+        updateProfile()
+    }
+
+    override fun initData() {
+        super.initData()
+        EaseFlowBus.with<EaseEvent>(EaseEvent.EVENT.UPDATE + EaseEvent.TYPE.CONTACT + DemoConstant.EVENT_UPDATE_USER_SUFFIX).register(this) {
+            if (it.isContactChange && it.message.isNullOrEmpty().not()) {
+                binding?.listContact?.loadContactData(false)
+            }
+        }
+        EaseFlowBus.with<EaseEvent>(EaseEvent.EVENT.UPDATE + EaseEvent.TYPE.CONTACT).register(this) {
+            if (it.isContactChange && it.event == DemoConstant.EVENT_UPDATE_SELF) {
+                updateProfile()
+            }
+        }
+        EaseFlowBus.with<EaseEvent>(EaseEvent.EVENT.UPDATE.name).register(this) {
+            if (it.isPresenceChange && it.message.equals(EaseIM.getCurrentUser()?.id) ) {
+                updateProfile()
+            }
+        }
+    }
+
+    override fun initListener() {
+        super.initListener()
+        binding?.titleContact?.setLogoClickListener {
+            EaseIM.getCurrentUser()?.id?.let {
+                presenceController.showPresenceStatusDialog(PresenceCache.getUserPresence(it))
+            }
+        }
+    }
+
+    private fun updateProfile(){
+        binding?.titleContact?.let { titlebar->
+            EaseIM.getConfig()?.avatarConfig?.setAvatarStyle(titlebar.getLogoView())
+            EaseIM.getConfig()?.avatarConfig?.setStatusStyle(titlebar.getStatusView(),2.dpToPx(mContext),
+                ContextCompat.getColor(mContext, R.color.demo_background))
+
+            EaseIM.getCurrentUser()?.let { profile->
+                val presence = PresenceCache.getUserPresence(profile.id)
+                presence?.let {
+                    val logoStatus = EasePresenceUtil.getPresenceIcon(mContext,it)
+                    titlebar.setLogoStatusMargin(end = -1, bottom = -1)
+                    titlebar.setLogoStatus(logoStatus)
+                    titlebar.getStatusView().visibility = View.VISIBLE
+                    titlebar.setLogoStatusSize(resources.getDimensionPixelSize(R.dimen.em_title_bar_status_icon_size))
+                }
+                ChatLog.e(TAG,"updateProfile ${profile.id} ${profile.name} ${profile.avatar}")
+                titlebar.setLogo(profile.avatar, io.agora.uikit.R.drawable.ease_default_avatar, 32.dpToPx(mContext))
+                val layoutParams = titlebar.getLogoView()?.layoutParams as? ViewGroup.MarginLayoutParams
+                layoutParams?.marginStart = 12.dpToPx(mContext)
+                titlebar.getTitleView().let { text ->
+                    text.text = ""
+                }
+            }
+        }
+    }
+
+    override fun loadContactListSuccess(userList: MutableList<EaseUser>) {
+        super.loadContactListSuccess(userList)
+        if (!isFirstLoadData){
+            fetchContactInfo(userList)
+            isFirstLoadData = true
+        }
+    }
+
+    override fun loadContactListFail(code: Int, error: String) {
+        super.loadContactListFail(code, error)
+        ChatLog.e(TAG,"loadContactListFail: $code $error")
+    }
+
+    class Builder:EaseContactsListFragment.Builder() {
+        override fun build(): EaseContactsListFragment {
+            if (customFragment == null) {
+                customFragment = ChatContactListFragmentEvent()
+            }
+            if (customFragment is ChatContactListFragmentEvent){
+
+            }
+            return super.build()
+        }
+    }
+
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/contact/ChatNewRequestsActivity.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/contact/ChatNewRequestsActivity.kt
new file mode 100644
index 00000000..f313b53f
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/contact/ChatNewRequestsActivity.kt
@@ -0,0 +1,23 @@
+package io.agora.chatdemo.page.contact
+
+import io.agora.chatdemo.common.helper.LocalNotifyHelper
+import io.agora.uikit.common.ChatClient
+import io.agora.uikit.common.ChatMessage
+import io.agora.uikit.common.bus.EaseFlowBus
+import io.agora.uikit.common.extensions.mainScope
+import io.agora.uikit.feature.invitation.EaseNewRequestsActivity
+import io.agora.uikit.model.EaseEvent
+
+class ChatNewRequestsActivity:EaseNewRequestsActivity() {
+
+    override fun agreeInviteSuccess(userId: String, msg: ChatMessage) {
+        super.agreeInviteSuccess(userId, msg)
+        val notifyMsg = LocalNotifyHelper.createContactNotifyMessage(userId)
+        ChatClient.getInstance().chatManager().saveMessage(notifyMsg)
+        mContext.let {
+            EaseFlowBus.with<EaseEvent>(EaseEvent.EVENT.ADD.name)
+                .post(it.mainScope(), EaseEvent(EaseEvent.EVENT.ADD.name, EaseEvent.TYPE.CONTACT))
+        }
+    }
+
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/conversation/ConversationListFragment.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/conversation/ConversationListFragment.kt
new file mode 100644
index 00000000..23c18ed3
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/conversation/ConversationListFragment.kt
@@ -0,0 +1,136 @@
+package io.agora.chatdemo.page.conversation
+
+import android.os.Bundle
+import android.view.View
+import android.view.ViewGroup
+import androidx.core.content.ContextCompat
+import androidx.lifecycle.ViewModelProvider
+import androidx.recyclerview.widget.LinearLayoutManager
+import io.agora.chatdemo.DemoHelper
+import io.agora.chatdemo.R
+import io.agora.chatdemo.common.DemoConstant
+import io.agora.chatdemo.common.PresenceCache
+import io.agora.chatdemo.feature.presence.controller.PresenceController
+import io.agora.chatdemo.feature.presence.utils.EasePresenceUtil
+import io.agora.chatdemo.feature.presence.viewmodel.PresenceViewModel
+import io.agora.uikit.EaseIM
+import io.agora.uikit.common.ChatLog
+import io.agora.uikit.common.bus.EaseFlowBus
+import io.agora.uikit.common.extensions.dpToPx
+import io.agora.uikit.configs.setAvatarStyle
+import io.agora.uikit.configs.setStatusStyle
+import io.agora.uikit.feature.conversation.EaseConversationListFragment
+import io.agora.uikit.model.EaseConversation
+import io.agora.uikit.model.EaseEvent
+
+class ConversationListFragment: EaseConversationListFragment() {
+
+    private var isFirstLoadData = false
+    private val presenceViewModel by lazy { ViewModelProvider(this)[PresenceViewModel::class.java] }
+    private val presenceController by lazy { PresenceController(mContext,presenceViewModel) }
+
+    override fun initData() {
+        super.initData()
+        initEventBus()
+    }
+
+    override fun initView(savedInstanceState: Bundle?) {
+        super.initView(savedInstanceState)
+
+        binding?.titleConversations?.let {
+            EaseIM.getConfig()?.avatarConfig?.setAvatarStyle(it.getLogoView())
+            EaseIM.getConfig()?.avatarConfig?.setStatusStyle(it.getStatusView(),2.dpToPx(mContext),
+                ContextCompat.getColor(mContext, R.color.demo_background))
+            updateProfile()
+            it.setTitleEndDrawable(R.drawable.conversation_title)
+        }
+    }
+
+    private fun initEventBus() {
+        EaseFlowBus.with<EaseEvent>(EaseEvent.EVENT.UPDATE + EaseEvent.TYPE.CONTACT).register(this) {
+            if (it.isContactChange && it.event == DemoConstant.EVENT_UPDATE_SELF) {
+                updateProfile()
+            }
+        }
+
+        EaseFlowBus.with<EaseEvent>(EaseEvent.EVENT.UPDATE.name).register(this) {
+            if (it.isPresenceChange && it.message.equals(EaseIM.getCurrentUser()?.id) ) {
+                updateProfile()
+            }
+        }
+
+        EaseFlowBus.with<EaseEvent>(EaseEvent.EVENT.UPDATE + EaseEvent.TYPE.CONTACT + DemoConstant.EVENT_UPDATE_USER_SUFFIX).register(this) {
+            if (it.isContactChange && it.message.isNullOrEmpty().not()) {
+                binding?.listConversation?.notifyDataSetChanged()
+            }
+        }
+        EaseFlowBus.with<EaseEvent>(EaseEvent.EVENT.ADD.name).register(viewLifecycleOwner) {
+            if (it.isContactChange) {
+                refreshData()
+            }
+        }
+    }
+
+    override fun initListener() {
+        super.initListener()
+        binding?.titleConversations?.setLogoClickListener {
+            EaseIM.getCurrentUser()?.id?.let {
+                presenceController.showPresenceStatusDialog(PresenceCache.getUserPresence(it))
+            }
+        }
+    }
+
+    private fun updateProfile(){
+        binding?.titleConversations?.let { titlebar->
+            EaseIM.getCurrentUser()?.let { profile->
+                val presence = PresenceCache.getUserPresence(profile.id)
+                presence?.let {
+                    val logoStatus = EasePresenceUtil.getPresenceIcon(mContext,it)
+                    ChatLog.d("ConversationListFragment","logoStatus $logoStatus")
+                    titlebar.setLogoStatusMargin(end = -1, bottom = -1)
+                    titlebar.setLogoStatus(logoStatus)
+                    titlebar.getStatusView().visibility = View.VISIBLE
+                    titlebar.setLogoStatusSize(resources.getDimensionPixelSize(R.dimen.em_title_bar_status_icon_size))
+                }
+                ChatLog.e("ConversationListFragment","updateProfile ${profile.id} ${profile.name} ${profile.avatar}")
+                titlebar.setLogo(profile.avatar, io.agora.uikit.R.drawable.ease_default_avatar, 32.dpToPx(mContext))
+                val layoutParams = titlebar.getLogoView()?.layoutParams as? ViewGroup.MarginLayoutParams
+                layoutParams?.marginStart = 12.dpToPx(mContext)
+                titlebar.getTitleView().let { text ->
+                    text.text = ""
+                }
+            }
+        }
+    }
+
+
+    override fun loadConversationListSuccess(userList: List<EaseConversation>) {
+        if (!isFirstLoadData){
+            fetchFirstVisibleData()
+            isFirstLoadData = true
+        }
+    }
+
+    private fun fetchFirstVisibleData(){
+        binding?.listConversation?.let { layout->
+            (layout.conversationList.layoutManager as? LinearLayoutManager)?.let { manager->
+                layout.post {
+                    val firstVisibleItemPosition = manager.findFirstVisibleItemPosition()
+                    val lastVisibleItemPosition = manager.findLastVisibleItemPosition()
+                    val visibleList = layout.getListAdapter()?.mData?.filterIndexed { index, _ ->
+                        index in firstVisibleItemPosition..lastVisibleItemPosition
+                    }
+                    val fetchList = visibleList?.filter { conv ->
+                        val u = DemoHelper.getInstance().getDataModel().getUser(conv.conversationId)
+                        (u == null || u.updateTimes == 0) && (u?.name.isNullOrEmpty() || u?.avatar.isNullOrEmpty())
+                    }
+                    fetchList?.let {
+                        layout.fetchConvUserInfo(it)
+                    }
+                }
+            }
+        }
+    }
+
+
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/group/ChatCreateGroupActivity.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/group/ChatCreateGroupActivity.kt
new file mode 100644
index 00000000..e24a1d46
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/group/ChatCreateGroupActivity.kt
@@ -0,0 +1,32 @@
+package io.agora.chatdemo.page.group
+
+import androidx.lifecycle.ViewModelProvider
+import androidx.lifecycle.lifecycleScope
+import io.agora.chatdemo.utils.ToastUtils.showToast
+import io.agora.chatdemo.viewmodel.ProfileInfoViewModel
+import io.agora.uikit.common.ChatGroup
+import io.agora.uikit.common.extensions.catchChatException
+import io.agora.uikit.feature.group.EaseCreateGroupActivity
+import kotlinx.coroutines.flow.onCompletion
+import kotlinx.coroutines.flow.onStart
+import kotlinx.coroutines.launch
+
+class ChatCreateGroupActivity: EaseCreateGroupActivity() {
+    private val profileViewModel by lazy { ViewModelProvider(this)[ProfileInfoViewModel::class.java] }
+
+    override fun createGroupSuccess(group: ChatGroup) {
+        lifecycleScope.launch {
+            profileViewModel.getGroupAvatar(group.groupId)
+                .catchChatException { e ->
+                    showToast(e.description)
+                }
+                .onStart {
+                    showLoading(true)
+                }
+                .onCompletion { dismissLoading() }
+                .collect {
+                    super.createGroupSuccess(group)
+                }
+        }
+    }
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/group/ChatGroupDetailActivity.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/group/ChatGroupDetailActivity.kt
new file mode 100644
index 00000000..16ad33d4
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/group/ChatGroupDetailActivity.kt
@@ -0,0 +1,61 @@
+package io.agora.chatdemo.page.group
+
+import androidx.core.content.ContextCompat
+import io.agora.chat.callkit.general.EaseCallType
+import io.agora.chatdemo.R
+import io.agora.chatdemo.callkit.CallKitManager
+import io.agora.chatdemo.common.extensions.internal.parse
+import io.agora.uikit.EaseIM
+import io.agora.uikit.common.ChatGroup
+import io.agora.uikit.feature.group.EaseGroupDetailActivity
+import io.agora.uikit.model.EaseMenuItem
+
+class ChatGroupDetailActivity : EaseGroupDetailActivity(){
+
+    override fun getDetailItem(): MutableList<EaseMenuItem>? {
+        val list = super.getDetailItem()
+        val voiceItem = EaseMenuItem(
+            title = getString(R.string.menu_voice_call),
+            resourceId = io.agora.uikit.R.drawable.ease_phone_pick,
+            menuId = R.id.group_item_voice_call,
+            titleColor = ContextCompat.getColor(this, R.color.color_primary),
+            order = 2,
+            resourceTintColor = ContextCompat.getColor(this, R.color.color_primary)
+        )
+        val videoItem = EaseMenuItem(
+            title = getString(R.string.menu_video_call),
+            resourceId = io.agora.uikit.R.drawable.ease_video_camera,
+            menuId = R.id.group_item_video_call,
+            titleColor = ContextCompat.getColor(this, R.color.color_primary),
+            order = 2,
+            resourceTintColor = ContextCompat.getColor(this, R.color.color_primary)
+        )
+        list?.add(voiceItem)
+        list?.add(videoItem)
+        return list
+    }
+
+    override fun onMenuItemClick(item: EaseMenuItem?, position: Int): Boolean {
+        item?.let {menu->
+            return when(menu.menuId){
+                R.id.group_item_video_call -> {
+                    CallKitManager.startConferenceCall(EaseCallType.CONFERENCE_VIDEO_CALL,this, groupId)
+                    true
+                }
+                R.id.group_item_voice_call -> {
+                    CallKitManager.startConferenceCall(EaseCallType.CONFERENCE_VOICE_CALL,this, groupId)
+                    true
+                }
+                else -> {
+                    super.onMenuItemClick(item, position)
+                }
+            }
+        }
+        return false
+    }
+
+    override fun fetchGroupDetailSuccess(group: ChatGroup) {
+        EaseIM.updateGroupInfo(listOf(group.parse()))
+        super.fetchGroupDetailSuccess(group)
+    }
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/group/repository/GroupRepository.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/group/repository/GroupRepository.kt
new file mode 100644
index 00000000..67b92797
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/group/repository/GroupRepository.kt
@@ -0,0 +1,32 @@
+package io.agora.chatdemo.page.group.repository
+
+import io.agora.chatdemo.base.BaseRepository
+import io.agora.uikit.common.ChatClient
+import io.agora.uikit.common.ChatException
+import io.agora.uikit.common.ChatGroup
+import io.agora.uikit.common.ChatValueCallback
+import kotlin.coroutines.resume
+import kotlin.coroutines.resumeWithException
+import kotlin.coroutines.suspendCoroutine
+
+class GroupRepository: BaseRepository() {
+    val groupManager = ChatClient.getInstance().groupManager()
+
+    /**
+     * Suspend method for [ChatGroupManager.asyncGetJoinedGroupsFromServer()]
+     */
+    suspend fun asyncGetJoinedGroupsFromServer(): List<ChatGroup> {
+        return suspendCoroutine { continuation->
+            groupManager.asyncGetJoinedGroupsFromServer(object : ChatValueCallback<MutableList<ChatGroup>> {
+                override fun onSuccess(value: MutableList<ChatGroup>) {
+                    continuation.resume(value)
+                }
+                override fun onError(error: Int, errorMsg: String?) {
+                    continuation.resumeWithException(ChatException(error, errorMsg))
+                }
+            })
+        }
+    }
+
+
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/login/LoginActivity.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/login/LoginActivity.kt
new file mode 100644
index 00000000..64929908
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/login/LoginActivity.kt
@@ -0,0 +1,61 @@
+package io.agora.chatdemo.page.login
+
+import android.content.Context
+import android.content.Intent
+import android.os.Bundle
+import android.view.LayoutInflater
+import androidx.core.content.ContextCompat
+import androidx.fragment.app.Fragment
+import io.agora.chatdemo.R
+import io.agora.chatdemo.base.BaseInitActivity
+import io.agora.chatdemo.common.DemoConstant
+import io.agora.chatdemo.databinding.DemoActivityLoginBinding
+import io.agora.chatdemo.page.login.fragment.LoginFragment
+import io.agora.chatdemo.page.login.fragment.ServerSetFragment
+import io.agora.uikit.common.bus.EaseFlowBus
+
+class LoginActivity : BaseInitActivity<DemoActivityLoginBinding>() {
+
+    override fun initView(savedInstanceState: Bundle?) {
+        super.initView(savedInstanceState)
+        supportFragmentManager.beginTransaction().replace(R.id.fl_fragment, LoginFragment())
+            .commit()
+    }
+
+    override fun getViewBinding(inflater: LayoutInflater): DemoActivityLoginBinding? {
+        return DemoActivityLoginBinding.inflate(inflater)
+    }
+
+    override fun setActivityTheme() {
+        setFitSystemForTheme(false, ContextCompat.getColor(this, R.color.transparent), true)
+    }
+
+    override fun initData() {
+        super.initData()
+        initEvent()
+    }
+
+    private fun initEvent() {
+        EaseFlowBus.with<String>(DemoConstant.SKIP_DEVELOPER_CONFIG).register(this) {
+            if (it == LoginFragment::class.java.simpleName) {
+                replace(ServerSetFragment())
+            }
+        }
+    }
+
+    private fun replace(fragment: Fragment) {
+        supportFragmentManager.beginTransaction().setCustomAnimations(
+            R.anim.slide_in_from_right,
+            R.anim.slide_out_to_left,
+            R.anim.slide_in_from_left,
+            R.anim.slide_out_to_right
+        ).replace(R.id.fl_fragment, fragment).addToBackStack(null).commit()
+    }
+
+    companion object {
+        fun startAction(context: Context) {
+            val intent = Intent(context, LoginActivity::class.java)
+            context.startActivity(intent)
+        }
+    }
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/login/fragment/LoginFragment.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/login/fragment/LoginFragment.kt
new file mode 100644
index 00000000..024d677e
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/login/fragment/LoginFragment.kt
@@ -0,0 +1,281 @@
+package io.agora.chatdemo.page.login.fragment
+
+import android.content.Intent
+import android.graphics.Color
+import android.graphics.PorterDuff
+import android.graphics.PorterDuffColorFilter
+import android.graphics.drawable.Drawable
+import android.os.Build
+import android.os.Bundle
+import android.os.SystemClock
+import android.text.Editable
+import android.text.InputType
+import android.text.TextUtils
+import android.text.TextWatcher
+import android.text.method.LinkMovementMethod
+import android.view.KeyEvent
+import android.view.LayoutInflater
+import android.view.View
+import android.view.ViewGroup
+import android.view.inputmethod.EditorInfo
+import android.widget.TextView
+import android.widget.TextView.OnEditorActionListener
+import androidx.core.content.ContextCompat
+import androidx.lifecycle.ViewModelProvider
+import androidx.lifecycle.lifecycleScope
+import io.agora.chatdemo.DemoHelper
+import io.agora.chatdemo.MainActivity
+import io.agora.chatdemo.R
+import io.agora.chatdemo.common.DemoConstant
+import io.agora.chatdemo.common.dialog.SimpleDialog
+import io.agora.chatdemo.common.extensions.internal.changePwdDrawable
+import io.agora.chatdemo.common.extensions.internal.clearEditTextListener
+import io.agora.chatdemo.common.extensions.internal.showRightDrawable
+import io.agora.chatdemo.common.helper.DeveloperModeHelper
+import io.agora.chatdemo.databinding.DemoFragmentLoginBinding
+import io.agora.chatdemo.page.login.viewModel.LoginViewModel
+import io.agora.chatdemo.utils.ToastUtils.showToast
+import io.agora.uikit.base.EaseBaseFragment
+import io.agora.uikit.common.ChatClient
+import io.agora.uikit.common.ChatError
+import io.agora.uikit.common.bus.EaseFlowBus
+import io.agora.uikit.common.extensions.catchChatException
+import io.agora.uikit.common.extensions.hideSoftKeyboard
+import kotlinx.coroutines.flow.SharingStarted
+import kotlinx.coroutines.flow.onCompletion
+import kotlinx.coroutines.flow.onStart
+import kotlinx.coroutines.flow.stateIn
+import kotlinx.coroutines.launch
+
+class LoginFragment : EaseBaseFragment<DemoFragmentLoginBinding>(),
+    View.OnClickListener, TextWatcher,OnEditorActionListener {
+    private var mUserId: String? = null
+    private var mCode: String? = null
+    private lateinit var mFragmentViewModel: LoginViewModel
+    private var clear: Drawable? = null
+    private var eyeOpen: Drawable? = null
+    private var eyeClose: Drawable? = null
+    private val mHits = LongArray(COUNT)
+    private var isDeveloperMode = false
+    private var isShowingDialog = false
+
+    override fun getViewBinding(
+        inflater: LayoutInflater,
+        container: ViewGroup?
+    ): DemoFragmentLoginBinding {
+        return DemoFragmentLoginBinding.inflate(inflater)
+    }
+
+    override fun initListener() {
+        super.initListener()
+        binding?.run {
+            etLoginId.addTextChangedListener(this@LoginFragment)
+            etLoginCode.addTextChangedListener(this@LoginFragment)
+            tvLoginDeveloper.setOnClickListener(this@LoginFragment)
+            tvVersion.setOnClickListener(this@LoginFragment)
+            btnLogin.setOnClickListener(this@LoginFragment)
+            etLoginCode.setOnEditorActionListener(this@LoginFragment)
+            etLoginId.clearEditTextListener()
+            root.setOnClickListener {
+                mContext.hideSoftKeyboard()
+            }
+        }
+    }
+
+    override fun onCreate(savedInstanceState: Bundle?) {
+        super.onCreate(savedInstanceState)
+        retainInstance = true
+        mFragmentViewModel = ViewModelProvider(this)[LoginViewModel::class.java]
+    }
+
+    override fun initData() {
+        super.initData()
+        binding?.run {
+            etLoginId.setText(ChatClient.getInstance().currentUser)
+            tvVersion.text = "V${ChatClient.VERSION}"
+            tvAgreement.movementMethod = LinkMovementMethod.getInstance()
+            tvAgreement.setHintTextColor(Color.TRANSPARENT)
+
+            if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.Q) {
+                val drawableCursor = etLoginId.textCursorDrawable
+                drawableCursor?.colorFilter = PorterDuffColorFilter(mContext.getColor(R.color.color_primary), PorterDuff.Mode.SRC_IN)
+                etLoginId.textCursorDrawable = drawableCursor
+                etLoginCode.textCursorDrawable = drawableCursor
+                val idDrawableIndicator = etLoginId.textSelectHandle
+                val codeDrawableIndicator = etLoginCode.textSelectHandle
+                idDrawableIndicator?.colorFilter = PorterDuffColorFilter(mContext.getColor(R.color.color_primary), PorterDuff.Mode.SRC_IN)
+                codeDrawableIndicator?.colorFilter = PorterDuffColorFilter(mContext.getColor(R.color.color_primary), PorterDuff.Mode.SRC_IN)
+            }
+
+        }
+        eyeClose = ContextCompat.getDrawable(mContext, R.drawable.sign_eye_slash)
+        eyeOpen = ContextCompat.getDrawable(mContext, R.drawable.sign_eye)
+        clear = ContextCompat.getDrawable(mContext, R.drawable.sign_clear_icon)
+        binding?.etLoginId?.showRightDrawable(clear)
+        binding?.etLoginCode?.inputType = InputType.TYPE_CLASS_TEXT or InputType.TYPE_TEXT_VARIATION_PASSWORD
+        isDeveloperMode = DeveloperModeHelper.isDeveloperMode()
+        resetView(isDeveloperMode)
+    }
+
+    override fun onClick(v: View) {
+        when (v.id) {
+            R.id.tv_version -> {
+                System.arraycopy(mHits, 1, mHits, 0, mHits.size - 1)
+                mHits[mHits.size - 1] = SystemClock.uptimeMillis()
+                if (mHits[0] >= SystemClock.uptimeMillis() - DURATION && !isShowingDialog) {
+                    isShowingDialog = true
+                    showOpenDeveloperDialog()
+                }
+            }
+            R.id.btn_login -> {
+                mContext.hideSoftKeyboard()
+                loginToServer()
+            }
+            R.id.tv_login_developer -> {
+                EaseFlowBus.with<String>(DemoConstant.SKIP_DEVELOPER_CONFIG).post(lifecycleScope, LoginFragment::class.java.simpleName)
+            }
+
+        }
+    }
+
+    private fun loginToServer() {
+        if (TextUtils.isEmpty(mUserId) || TextUtils.isEmpty(mCode)) {
+            showToast(mContext.getString(R.string.em_login_btn_info_incomplete))
+            return
+        }
+        lifecycleScope.launch {
+            if (isDeveloperMode){
+                mFragmentViewModel.login(mUserId!!, mCode!!)
+                    .onStart { showLoading(true) }
+                    .onCompletion { dismissLoading() }
+                    .catchChatException { e ->
+                        if (e.errorCode == ChatError.USER_AUTHENTICATION_FAILED) {
+                            showToast(R.string.demo_error_user_authentication_failed)
+                        } else {
+                            showToast(e.description)
+                        }
+                    }
+                    .stateIn(lifecycleScope, SharingStarted.WhileSubscribed(stopTimeoutMillis), null)
+                    .collect {
+                        if (it != null) {
+                            DemoHelper.getInstance().getDataModel().initDb()
+                            startActivity(Intent(mContext, MainActivity::class.java))
+                            mContext.finish()
+                        }
+                    }
+            }else{
+                lifecycleScope.launch {
+                    mFragmentViewModel.loginFromAppServer(mUserId!!, mCode!!)
+                        .onStart {
+                            showLoading(true)
+                        }
+                        .onCompletion {
+                            dismissLoading()
+                        }
+                        .catchChatException { e ->
+                            if (e.errorCode == ChatError.USER_AUTHENTICATION_FAILED) {
+                                showToast(R.string.demo_error_user_authentication_failed)
+                            } else {
+                                showToast(e.description)
+                            }
+                        }
+                        .stateIn(lifecycleScope, SharingStarted.WhileSubscribed(stopTimeoutMillis), null)
+                        .collect {
+                            if (it != null) {
+                                DemoHelper.getInstance().getDataModel().initDb()
+                                startActivity(Intent(mContext, MainActivity::class.java))
+                                mContext.finish()
+                            }
+                        }
+                }
+            }
+        }
+    }
+
+
+    private fun showOpenDeveloperDialog() {
+        SimpleDialog.Builder(mContext)
+            .setTitle(
+                if (isDeveloperMode) getString(R.string.server_close_develop_mode) else getString(
+                    R.string.server_open_develop_mode
+                )
+            )
+            .setPositiveButton{
+                isDeveloperMode = !isDeveloperMode
+                DeveloperModeHelper.setDeveloperMode(isDeveloperMode)
+                binding?.etLoginId?.setText("")
+                resetView(isDeveloperMode)
+            }
+            .setOnDismissListener {
+                isShowingDialog = false
+            }
+            .setCanceledOnTouchOutside(false)
+            .build()
+            .show()
+    }
+
+    override fun beforeTextChanged(s: CharSequence, start: Int, count: Int, after: Int) {}
+    override fun onTextChanged(s: CharSequence, start: Int, before: Int, count: Int) {}
+    override fun afterTextChanged(s: Editable) {
+        binding?.run {
+            mUserId = etLoginId.text.toString().trim { it <= ' ' }
+            mCode = etLoginCode.text.toString().trim { it <= ' ' }
+            etLoginId.showRightDrawable(clear)
+            etLoginCode.showRightDrawable(eyeClose)
+            setButtonEnable(!TextUtils.isEmpty(mUserId) && !TextUtils.isEmpty(mCode))
+        }
+    }
+
+    private fun setButtonEnable(enable: Boolean) {
+        binding?.run {
+            btnLogin.isEnabled = enable
+            if (etLoginCode.hasFocus()) {
+                etLoginCode.imeOptions =
+                    if (enable) EditorInfo.IME_ACTION_DONE else EditorInfo.IME_ACTION_PREVIOUS
+            } else if (etLoginId.hasFocus()) {
+                etLoginCode.imeOptions =
+                    if (enable) EditorInfo.IME_ACTION_DONE else EditorInfo.IME_ACTION_NEXT
+            }
+        }
+    }
+
+    override fun onEditorAction(v: TextView, actionId: Int, event: KeyEvent): Boolean {
+        if (actionId == EditorInfo.IME_ACTION_DONE) {
+            if (!TextUtils.isEmpty(mUserId) && !TextUtils.isEmpty(mCode)) {
+                mContext.hideSoftKeyboard()
+                loginToServer()
+                return true
+            }
+        }
+        return false
+    }
+
+    private fun resetView(isDeveloperMode: Boolean) {
+        binding?.run {
+            etLoginCode.setText("")
+            etLoginCode.changePwdDrawable(
+                eyeOpen,
+                eyeClose,
+                null,
+                null,
+                null
+            )
+            etLoginCode.inputType = InputType.TYPE_CLASS_TEXT or InputType.TYPE_TEXT_VARIATION_PASSWORD
+            etLoginCode.showRightDrawable(null)
+            if (!isDeveloperMode) {
+                tvLoginDeveloper.visibility = View.GONE
+                DeveloperModeHelper.setEnableCustom(false)
+                DeveloperModeHelper.setDeveloperMode(false)
+            }else{
+                tvLoginDeveloper.visibility = View.VISIBLE
+            }
+        }
+    }
+
+    companion object {
+        private const val TAG = "LoginFragment"
+        private const val COUNT: Int = 5
+        private const val DURATION = (3 * 1000).toLong()
+        private const val stopTimeoutMillis: Long = 5000
+    }
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/login/fragment/ServerSetFragment.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/login/fragment/ServerSetFragment.kt
new file mode 100644
index 00000000..55120056
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/login/fragment/ServerSetFragment.kt
@@ -0,0 +1,221 @@
+package io.agora.chatdemo.page.login.fragment
+
+import android.os.Bundle
+import android.text.Editable
+import android.text.InputType
+import android.view.LayoutInflater
+import android.view.ViewGroup
+import androidx.core.content.ContextCompat
+import io.agora.chatdemo.DemoHelper
+import io.agora.chatdemo.R
+import io.agora.chatdemo.common.dialog.SimpleDialog
+import io.agora.chatdemo.common.extensions.internal.addDefaultTextChangedListener
+import io.agora.chatdemo.common.helper.DeveloperModeHelper
+import io.agora.chatdemo.databinding.DemoFragmentServerSetBinding
+import io.agora.uikit.base.EaseBaseFragment
+import kotlin.system.exitProcess
+
+class ServerSetFragment: EaseBaseFragment<DemoFragmentServerSetBinding>() {
+
+    private val changeArray = BooleanArray(4)
+    private var isEnableCustomServer = false
+    override fun getViewBinding(
+        inflater: LayoutInflater,
+        container: ViewGroup?
+    ): DemoFragmentServerSetBinding? {
+        return DemoFragmentServerSetBinding.inflate(inflater)
+    }
+
+    override fun initView(savedInstanceState: Bundle?) {
+        super.initView(savedInstanceState)
+        binding?.toolbarServer?.let {
+            it.inflateMenu(R.menu.demo_server_set_menu)
+            enableSaveMenu(false)
+        }
+        binding?.etAppkey?.inputType = InputType.TYPE_CLASS_TEXT
+    }
+
+    override fun initListener() {
+        super.initListener()
+        binding?.toolbarServer?.setNavigationOnClickListener {
+            activity?.onBackPressed()
+        }
+        binding?.toolbarServer?.setOnMenuItemClickListener {
+            when(it.itemId) {
+                R.id.action_server_set_save -> {
+                    saveSettings()
+                    true
+                }
+                else -> false
+            }
+        }
+        binding?.etAppkey?.addDefaultTextChangedListener {
+            it?.let { s ->
+                changeArray[0] = s.isNotEmpty()
+                changeSaveMenu(s)
+            }
+        }
+        binding?.etServerAddress?.addDefaultTextChangedListener {
+            it?.let { s ->
+                changeArray[1] = s.isNotEmpty()
+                changeSaveMenu(s)
+            }
+        }
+        binding?.etServerPort?.addDefaultTextChangedListener {
+            it?.let { s ->
+                changeArray[2] = s.isNotEmpty()
+                changeSaveMenu(s)
+            }
+        }
+        binding?.etServerRest?.addDefaultTextChangedListener {
+            it?.let { s ->
+                changeArray[3] = s.isNotEmpty()
+                changeSaveMenu(s)
+            }
+        }
+        binding?.switchSpecifyServer?.setOnCheckedChangeListener { _, isChecked ->
+            isEnableCustomServer = isChecked
+            makeCustomServerItemEnable(isChecked)
+        }
+    }
+
+    private fun saveSettings() {
+        if (checkChange()) {
+            DemoHelper.getInstance().getDataModel().enableCustomSet(true)
+            DemoHelper.getInstance().getDataModel().enableCustomServer(isEnableCustomServer)
+            binding?.etAppkey?.text?.let {
+                if (it.isNotEmpty()) {
+                    val appkey = it.toString().trim()
+                    if (appkey.contains("#")) {
+                        DemoHelper.getInstance().getDataModel().setCustomAppKey(it.toString().trim())
+                    } else {
+                        checkAppkeyDialog()
+                        return
+                    }
+
+                }
+            }
+            binding?.etServerAddress?.text?.let {
+                if (it.isNotEmpty()) {
+                    DemoHelper.getInstance().getDataModel().setIMServer(it.toString().trim())
+                }
+            }
+            binding?.etServerPort?.text?.let {
+                if (it.isNotEmpty()) {
+                    DemoHelper.getInstance().getDataModel().setIMServerPort(it.toString().trim().toInt())
+                }
+            }
+            binding?.etServerRest?.text?.let {
+                if (it.isNotEmpty()) {
+                    DemoHelper.getInstance().getDataModel().setRestServer(it.toString().trim())
+                }
+            }
+            if (isEnableCustomServer && checkServerSettingChange()) {
+                showAlertDialog()
+            } else {
+                mContext.onBackPressed()
+            }
+        } else {
+            DemoHelper.getInstance().getDataModel().enableCustomSet(false)
+            mContext.onBackPressed()
+        }
+    }
+
+    private fun showAlertDialog() {
+        SimpleDialog.Builder(mContext)
+            .setTitle(getString(R.string.server_set_dialog_title))
+            .setSubtitle(getString(R.string.server_set_dialog_content))
+            .setPositiveButton(getString(R.string.server_set_dialog_confirm_button_text)) {
+                exitProcess(1)
+            }
+            .build()
+            .show()
+    }
+
+    private fun checkAppkeyDialog() {
+        SimpleDialog.Builder(mContext)
+            .setTitle(getString(R.string.server_set_illegal_appkey))
+            .setPositiveButton {
+                // do nothing
+            }
+            .dismissNegativeButton()
+            .build()
+            .show()
+    }
+
+    override fun initData() {
+        super.initData()
+        DeveloperModeHelper.isCustomSetEnable().let {
+            if (it) {
+                DemoHelper.getInstance().getDataModel().getCustomAppKey()?.let { appKey ->
+                    binding?.etAppkey?.setText(appKey)
+                }
+                DemoHelper.getInstance().getDataModel().isCustomServerEnable().let { enable ->
+                    isEnableCustomServer = enable
+                    binding?.switchSpecifyServer?.isChecked = enable
+                    makeCustomServerItemEnable(enable)
+                }
+                DemoHelper.getInstance().getDataModel().getIMServer()?.let { server ->
+                    if (server.isEmpty().not()) {
+                        binding?.etServerAddress?.setText(server)
+                    }
+
+                }
+                DemoHelper.getInstance().getDataModel().getIMServerPort().let { port ->
+                    if (port != 0) {
+                        binding?.etServerPort?.setText(port.toString())
+                    }
+                }
+                DemoHelper.getInstance().getDataModel().getRestServer()?.let { rest ->
+                    if (rest.isEmpty().not()) {
+                        binding?.etServerRest?.setText(rest)
+                    }
+                }
+            }
+        }
+        makeCustomServerItemEnable(binding?.switchSpecifyServer?.isChecked ?: false)
+    }
+
+    private fun makeCustomServerItemEnable(enable: Boolean) {
+        binding?.etServerAddress?.isEnabled = enable
+        binding?.etServerPort?.isEnabled = enable
+        binding?.etServerRest?.isEnabled = enable
+    }
+
+    private fun changeSaveMenu(s: Editable) {
+        if (s.isNotEmpty()) {
+            enableSaveMenu()
+        } else {
+            enableSaveMenu(checkChange())
+        }
+    }
+
+    private fun checkChange(): Boolean {
+        changeArray.forEach {
+            if (it) {
+                return true
+            }
+        }
+        return false
+    }
+
+    private fun checkServerSettingChange(): Boolean {
+        changeArray.forEachIndexed { index, b ->
+            if (index > 0 && b) {
+                return true
+            }
+        }
+        return false
+    }
+
+    private fun enableSaveMenu(enable: Boolean = true) {
+        binding?.toolbarServer?.let {
+            if (enable) {
+                it.setMenuTitleColor(ContextCompat.getColor(mContext, R.color.color_primary))
+            } else {
+                it.setMenuTitleColor(ContextCompat.getColor(mContext, R.color.demo_on_background_high))
+            }
+        }
+
+    }
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/login/viewModel/LoginViewModel.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/login/viewModel/LoginViewModel.kt
new file mode 100644
index 00000000..8011c76d
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/login/viewModel/LoginViewModel.kt
@@ -0,0 +1,46 @@
+package io.agora.chatdemo.page.login.viewModel
+
+import android.app.Application
+import androidx.lifecycle.AndroidViewModel
+import io.agora.chatdemo.page.splash.repository.ChatClientRepository
+import kotlinx.coroutines.ExperimentalCoroutinesApi
+import kotlinx.coroutines.flow.flatMapConcat
+import kotlinx.coroutines.flow.flow
+
+class LoginViewModel(application: Application) : AndroidViewModel(application) {
+    private val mRepository: ChatClientRepository = ChatClientRepository()
+
+    /**
+     * Login to Chat Server.
+     * @param userName
+     * @param pwd
+     * @param isTokenFlag
+     */
+    fun login(userName: String, pwd: String,agoraUid:Int = 0,isTokenFlag: Boolean = false) =
+        flow {
+            emit(mRepository.loginToServer(userName, pwd, agoraUid, isTokenFlag))
+        }
+
+    /**
+     * Login from app server.
+     * @param userName
+     * @param userPassword
+     */
+    @OptIn(ExperimentalCoroutinesApi::class)
+    fun loginFromAppServer(userName: String, userPassword: String) =
+        flow {
+            emit(mRepository.loginFromServer(userName, userPassword))
+        } .flatMapConcat { result ->
+            flow { emit(mRepository.loginToServer(result.chatUserName!!, result.token!!,result.agoraUid, true)) }
+        }
+
+    /**
+     * Logout from Chat server.
+     */
+    fun logout() =
+        flow {
+            emit(mRepository.logout(true))
+        }
+
+
+}
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/me/CameraAndCroppingController.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/me/CameraAndCroppingController.kt
new file mode 100644
index 00000000..59353467
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/me/CameraAndCroppingController.kt
@@ -0,0 +1,145 @@
+package io.agora.chatdemo.page.me
+
+import android.app.Activity
+import android.content.ContentValues
+import android.content.Context
+import android.content.Intent
+import android.graphics.Bitmap
+import android.net.Uri
+import android.os.Build
+import android.provider.MediaStore
+import androidx.activity.result.ActivityResultLauncher
+import androidx.core.content.FileProvider
+import com.yalantis.ucrop.UCrop
+import io.agora.chatdemo.BuildConfig
+import io.agora.chatdemo.utils.CameraAndCropFileUtils
+import io.agora.uikit.common.ChatImageUtils
+import io.agora.uikit.common.ChatLog
+import io.agora.uikit.common.extensions.isSdcardExist
+import java.io.File
+
+class CameraAndCroppingController(
+    var context: Context
+) {
+    companion object {
+        const val AUTHORITY = "${BuildConfig.APPLICATION_ID}.fileProvider"
+    }
+    private var cameraFile: File? = null
+    private var imageCropFile:File? = null
+
+    private var resultImageUri:Uri? = null
+    private var cropImageUri:Uri? = null
+
+    fun selectPicFromCamera(launcher: ActivityResultLauncher<Intent>?){
+        val takePicture = Intent(MediaStore.ACTION_IMAGE_CAPTURE)
+        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.S_V2){
+            if (takePicture.resolveActivity(context.packageManager) != null) {
+                val values = ContentValues()
+                values.put(MediaStore.Images.Media.TITLE, "MyPic")
+                values.put(
+                    MediaStore.Images.Media.DESCRIPTION,
+                    "Photo taken on " + System.currentTimeMillis()
+                )
+                resultImageUri = context.contentResolver.insert(
+                    MediaStore.Images.Media.EXTERNAL_CONTENT_URI,
+                    values
+                )
+                takePicture.putExtra(MediaStore.EXTRA_OUTPUT, resultImageUri)
+            }
+        }else{
+            if (!isSdcardExist()) {
+                return
+            }
+            cameraFile = CameraAndCropFileUtils.createImageFile( context, false)
+            cameraFile?.let {
+                takePicture.putExtra("outputFormat", Bitmap.CompressFormat.JPEG.toString())
+                if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.R){
+                    // 如果是 11 以上系统 通过MediaStore获取 uri
+                    ChatLog.e("CameraAndCroppingController","selectPicFromCamera version >= 11 putExtra: ${CameraAndCropFileUtils.uri}")
+                    takePicture.putExtra(MediaStore.EXTRA_OUTPUT,CameraAndCropFileUtils.uri)
+                }else if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.N){
+                    // 如果是 7.0 且低于 11 系统 需要使用FileProvider
+                    takePicture.addFlags(Intent.FLAG_GRANT_READ_URI_PERMISSION)
+                    val imgUri = FileProvider.getUriForFile(context, AUTHORITY, it)
+                    ChatLog.e("CameraAndCroppingController","selectPicFromCamera 7 <= version < 11 putExtra: $imgUri")
+                    takePicture.putExtra(MediaStore.EXTRA_OUTPUT, imgUri)
+                }else{
+                    // 低于 7.0 系统
+                    ChatLog.e("CameraAndCroppingController","selectPicFromCamera version < 7 putExtra: ${Uri.fromFile(it)}")
+                    takePicture.putExtra(MediaStore.EXTRA_OUTPUT, Uri.fromFile(it))
+                }
+            }
+        }
+        launcher?.launch(takePicture)
+    }
+
+    fun resultForCamera(data: Intent?):Uri?{
+        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.S_V2){
+            return resultImageUri
+        }else{
+            cameraFile?.let {
+                //判断文件是否存在
+                if (it.exists()){
+                    if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.R){
+                        // 如果是 11 以上系统 通过MediaStore获取 uri
+                        resultImageUri = CameraAndCropFileUtils.uri
+                        ChatLog.e("CameraAndCroppingController","resultForCamera version >= 11 putExtra: $resultImageUri")
+                    }else if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.N){
+                        // 如果是 7.0 且低于 11 系统 需要使用FileProvider 创建一个content类型的Uri
+                        resultImageUri = FileProvider.getUriForFile(context, AUTHORITY, it)
+                        ChatLog.e("CameraAndCroppingController","resultForCamera 7 <= version < 11 putExtra: $resultImageUri")
+                    }else{
+                        resultImageUri = Uri.fromFile(it)
+                        ChatLog.e("CameraAndCroppingController","resultForCamera version < 7 putExtra: $resultImageUri")
+                    }
+                }
+            }
+        }
+        return resultImageUri
+    }
+
+    fun gotoCrop(sourceUri: Uri){
+        val values = ContentValues()
+        values.put(MediaStore.Images.Media.TITLE, "MyCrop")
+        values.put(
+            MediaStore.Images.Media.DESCRIPTION,
+            "Crop taken on " + System.currentTimeMillis()
+        )
+        cropImageUri = context.contentResolver.insert(
+            MediaStore.Images.Media.EXTERNAL_CONTENT_URI,
+            values
+        )
+        cropImageUri?.let {
+            UCrop.of(sourceUri, it)
+                .withAspectRatio(1f, 1f)
+                .withMaxResultSize(500, 500)
+                .start(context as Activity)
+        }
+    }
+
+    fun resultForCropFile(data: Intent?):File?{
+        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.S_V2){
+            CameraAndCropFileUtils.getCropFile(context,cropImageUri)
+        }else{
+            if (imageCropFile != null && imageCropFile?.absolutePath != null){
+                imageCropFile?.let {
+                    return it
+                }
+            }
+        }
+        return null
+    }
+
+    fun getImageCropUri():Uri?{
+        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.S_V2){
+            return cropImageUri
+        }else{
+            imageCropFile?.let {
+                val uri = Uri.parse(it.absolutePath)
+                return ChatImageUtils.checkDegreeAndRestoreImage(context, uri)
+            }
+        }
+       return null
+    }
+
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/me/activity/AboutActivity.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/me/activity/AboutActivity.kt
new file mode 100644
index 00000000..f53a746d
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/me/activity/AboutActivity.kt
@@ -0,0 +1,65 @@
+package io.agora.chatdemo.page.me.activity
+
+import android.os.Bundle
+import android.view.LayoutInflater
+import android.view.View
+import io.agora.chatdemo.R
+import io.agora.chatdemo.databinding.DemoActivityAboutBinding
+import io.agora.uikit.EaseIM
+import io.agora.uikit.base.EaseBaseActivity
+import io.agora.uikit.common.ChatClient
+
+class AboutActivity: EaseBaseActivity<DemoActivityAboutBinding>(), View.OnClickListener {
+    companion object{
+        const val Documentation = "https://"
+        const val Platform = "/overview/product-overview?platform=web"
+        const val BaseUrl = "https://www."
+    }
+    override fun getViewBinding(inflater: LayoutInflater): DemoActivityAboutBinding? {
+        return DemoActivityAboutBinding.inflate(inflater)
+    }
+
+    override fun onCreate(savedInstanceState: Bundle?) {
+        super.onCreate(savedInstanceState)
+        initView()
+        initListener()
+    }
+
+    private fun initView(){
+        binding.let {
+            it.tvVersion.text = getString(R.string.about_version, ChatClient.VERSION)
+            it.tvKitVersion.text = getString(R.string.about_uikit_version,EaseIM.version)
+        }
+    }
+
+    private fun initListener(){
+        binding.let {
+            it.titleBar.setNavigationOnClickListener{
+                mContext.onBackPressed()
+            }
+            it.arrowItemDocumentation.setOnClickListener(this)
+            it.arrowItemSales.setOnClickListener(this)
+            it.arrowItemDemoRepo.setOnClickListener(this)
+            it.arrowItemMore.setOnClickListener(this)
+        }
+    }
+
+    override fun onClick(v: View?) {
+        when(v?.id){
+            R.id.arrow_item_documentation -> {
+                WebViewActivity.actionStart(this@AboutActivity,WebViewLoadType.RemoteUrl,"$Documentation${binding.arrowItemDocumentation.getSubTitle()}$Platform")
+            }
+            R.id.arrow_item_sales -> {
+                WebViewActivity.actionStart(this@AboutActivity,WebViewLoadType.RemoteUrl,"$BaseUrl${binding.arrowItemSales.getSubTitle()}")
+            }
+            R.id.arrow_item_demo_repo -> {
+                WebViewActivity.actionStart(this@AboutActivity,WebViewLoadType.RemoteUrl,"$BaseUrl${binding.arrowItemDemoRepo.getSubTitle()}")
+            }
+            R.id.arrow_item_more -> {
+                WebViewActivity.actionStart(this@AboutActivity,WebViewLoadType.RemoteUrl,"$BaseUrl${binding.arrowItemMore.getSubTitle()}")
+            }
+            else -> {}
+        }
+    }
+
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/me/activity/CurrencyActivity.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/me/activity/CurrencyActivity.kt
new file mode 100644
index 00000000..71d505ad
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/me/activity/CurrencyActivity.kt
@@ -0,0 +1,141 @@
+package io.agora.chatdemo.page.me.activity
+
+import android.app.Activity
+import android.content.Intent
+import android.os.Bundle
+import android.os.Handler
+import android.os.Looper
+import android.view.LayoutInflater
+import android.view.View
+import androidx.activity.result.ActivityResult
+import androidx.activity.result.ActivityResultLauncher
+import androidx.activity.result.contract.ActivityResultContracts
+import androidx.appcompat.app.AppCompatDelegate
+import io.agora.chatdemo.DemoHelper
+import io.agora.chatdemo.R
+import io.agora.chatdemo.bean.LanguageType
+import io.agora.chatdemo.common.DemoConstant
+import io.agora.chatdemo.common.PreferenceManager
+import io.agora.chatdemo.common.extensions.internal.setSwitchDefaultStyle
+import io.agora.chatdemo.databinding.DemoActivityCurrencyBinding
+import io.agora.uikit.EaseIM
+import io.agora.uikit.base.EaseBaseActivity
+
+class CurrencyActivity: EaseBaseActivity<DemoActivityCurrencyBinding>(),View.OnClickListener {
+    private var targetLanguage:String? = ""
+    override fun getViewBinding(inflater: LayoutInflater): DemoActivityCurrencyBinding {
+        return DemoActivityCurrencyBinding.inflate(inflater)
+    }
+    companion object {
+        private const val LANGUAGE_TYPE_TARGET = 1
+        private const val RESULT_CHOICE_TARGET_LANGUAGE = 101
+        private const val RESULT_LANGUAGE_TAG = "language_tag"
+        private const val RESULT_LANGUAGE_CODE = "language_code"
+        private const val LANGUAGE_TYPE = "language_type"
+    }
+
+    private val launcherToTargetLanguage: ActivityResultLauncher<Intent> = registerForActivityResult(
+        ActivityResultContracts.StartActivityForResult()
+    ) { result -> onActivityResult(result, RESULT_CHOICE_TARGET_LANGUAGE) }
+
+    override fun onCreate(savedInstanceState: Bundle?) {
+        super.onCreate(savedInstanceState)
+        initView()
+        initListener()
+    }
+
+    private fun initView(){
+        initSwitch()
+        initLanguage()
+    }
+
+    private fun initListener(){
+        binding.let {
+            it.switchItemDark.setOnClickListener(this)
+            it.arrowItemFeature.setOnClickListener(this)
+            it.arrowItemTargetLanguage.setOnClickListener(this)
+            it.titleBar.setNavigationOnClickListener{
+                mContext.onBackPressed()
+            }
+        }
+    }
+
+    private fun initSwitch(){
+        val isBlack = DemoHelper.getInstance().getDataModel().getBoolean(DemoConstant.IS_BLACK_THEME)
+
+        val handler = Looper.myLooper()?.let { Handler(it) }
+
+        handler?.postDelayed({
+            binding.switchItemDark.setChecked(isBlack)
+            binding.switchItemDark.setSwitchDefaultStyle()
+        }, 200)
+
+    }
+
+    private fun initLanguage(){
+        val spTagLanguage = PreferenceManager.getValue(DemoConstant.TARGET_LANGUAGE, LanguageType.EN.value)
+
+        if (spTagLanguage == LanguageType.ZH.value){
+            targetLanguage = getString(R.string.currency_language_zh_cn)
+        }else if (spTagLanguage == LanguageType.EN.value){
+            targetLanguage = getString(R.string.currency_language_en)
+        }
+        updateLanguage()
+    }
+
+    private fun onActivityResult(result: ActivityResult, requestCode: Int) {
+        if (result.resultCode == Activity.RESULT_OK) {
+            result.data?.let {
+                if (it.hasExtra(RESULT_LANGUAGE_TAG) && it.hasExtra(RESULT_LANGUAGE_CODE)){
+                    val tag = it.getStringExtra(RESULT_LANGUAGE_TAG)
+                    val code = it.getStringExtra(RESULT_LANGUAGE_CODE)
+                    when (requestCode) {
+                        RESULT_CHOICE_TARGET_LANGUAGE -> {
+                            targetLanguage = tag
+                            code?.let { languageCode->
+                                PreferenceManager.putValue(DemoConstant.TARGET_LANGUAGE, languageCode)
+                                EaseIM.getConfig()?.chatConfig?.targetTranslationLanguage = languageCode
+                            }
+                        }
+                        else -> {}
+                    }
+                }
+                updateLanguage()
+            }
+        }
+    }
+
+    private fun changeTheme(isChecked: Boolean){
+        DemoHelper.getInstance().getDataModel().putBoolean(DemoConstant.IS_BLACK_THEME, isChecked)
+        AppCompatDelegate.setDefaultNightMode(if (isChecked) AppCompatDelegate.MODE_NIGHT_YES else AppCompatDelegate.MODE_NIGHT_NO)
+    }
+
+    private fun updateLanguage(){
+        binding.let {
+            it.arrowItemTargetLanguage.setContent(targetLanguage?:"")
+        }
+    }
+
+    override fun onClick(v: View?) {
+        when(v?.id){
+            R.id.arrow_item_feature -> {
+                startActivity(Intent(this@CurrencyActivity,FeaturesActivity::class.java))
+            }
+            R.id.arrow_item_target_language -> {
+                val intent = Intent(this@CurrencyActivity, LanguageSettingActivity::class.java)
+                intent.putExtra(LANGUAGE_TYPE, LANGUAGE_TYPE_TARGET)
+                launcherToTargetLanguage.launch(intent)
+            }
+            R.id.switch_item_dark -> {
+                binding.switchItemDark.switch?.let { switch ->
+                    val isChecked = switch.isChecked.not()
+                    binding.switchItemDark.setChecked(isChecked)
+                    changeTheme(isChecked)
+                }
+            }
+            else -> {}
+        }
+    }
+
+
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/me/activity/EditUserNicknameActivity.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/me/activity/EditUserNicknameActivity.kt
new file mode 100644
index 00000000..2b93c08a
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/me/activity/EditUserNicknameActivity.kt
@@ -0,0 +1,101 @@
+package io.agora.chatdemo.page.me.activity
+
+import android.content.Intent
+import android.os.Bundle
+import android.text.Editable
+import android.text.TextWatcher
+import android.view.LayoutInflater
+import androidx.core.content.ContextCompat
+import io.agora.chatdemo.R
+import io.agora.chatdemo.databinding.DemoActivityMeInformationEditBinding
+import io.agora.uikit.EaseIM
+import io.agora.uikit.base.EaseBaseActivity
+import io.agora.uikit.model.EaseProfile
+
+open class EditUserNicknameActivity: EaseBaseActivity<DemoActivityMeInformationEditBinding>() {
+    var selfProfile: EaseProfile? = null
+    private var newName:String = ""
+
+    companion object{
+        private const val RESULT_REFRESH = "isRefresh"
+    }
+
+    override fun getViewBinding(inflater: LayoutInflater): DemoActivityMeInformationEditBinding {
+       return DemoActivityMeInformationEditBinding.inflate(inflater)
+    }
+
+    override fun onCreate(savedInstanceState: Bundle?) {
+        super.onCreate(savedInstanceState)
+        selfProfile = EaseIM.getCurrentUser()
+        initTitle()
+        initListener()
+        showKeyboard(binding.etName)
+    }
+
+    open fun initTitle(){
+        binding.run {
+            titleBar.setTitle(getString(R.string.main_about_me_information_edit_nick_name))
+            selfProfile?.let {
+                etName.setText(it.name)
+            }
+            etName.requestFocus()
+            showKeyboard(etName)
+        }
+        binding.inputNameCount.text = resources.getString(
+            R.string.main_about_me_information_change_name_count
+            ,selfProfile?.name?.length ?: 0)
+    }
+
+    open fun initListener(){
+        binding.titleBar.setNavigationOnClickListener { mContext.onBackPressed() }
+        binding.etName.addTextChangedListener(object : TextWatcher {
+            override fun beforeTextChanged(s: CharSequence?, start: Int, count: Int, after: Int) {
+
+            }
+
+            override fun onTextChanged(s: CharSequence, start: Int, before: Int, count: Int) {
+
+            }
+
+            override fun afterTextChanged(s: Editable) {
+                val length = s.toString().trim().length
+                if (length == 0){
+                    binding.inputNameCount.text =
+                        resources.getString(R.string.main_about_me_information_change_name_count, 0)
+                }else{
+                    binding.inputNameCount.text =
+                        resources.getString(R.string.main_about_me_information_change_name_count, length)
+
+                }
+                updateSaveView(binding.etName.text.length)
+            }
+        })
+        binding.titleBar.setOnMenuItemClickListener { item ->
+            when (item?.itemId) {
+                io.agora.uikit.R.id.action_save -> {
+                    updateUserInfo()
+                }
+
+                else -> {}
+            }
+            true
+        }
+    }
+
+    open fun updateSaveView(length: Int){
+        binding.titleBar.setMenuTitleColor(
+            ContextCompat.getColor(mContext,
+            if (length != 0) R.color.color_primary
+            else R.color.demo_on_background_high))
+    }
+
+    private fun updateUserInfo(){
+        newName = binding.etName.text.trim().toString()
+        val resultIntent = Intent()
+        resultIntent.putExtra(RESULT_REFRESH, true)
+        resultIntent.putExtra("nickname", newName)
+        setResult(RESULT_OK,resultIntent)
+        finish()
+    }
+
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/me/activity/FeaturesActivity.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/me/activity/FeaturesActivity.kt
new file mode 100644
index 00000000..2c155d11
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/me/activity/FeaturesActivity.kt
@@ -0,0 +1,89 @@
+package io.agora.chatdemo.page.me.activity
+
+import android.os.Bundle
+import android.view.LayoutInflater
+import android.view.View
+import io.agora.chatdemo.DemoHelper
+import io.agora.chatdemo.R
+import io.agora.chatdemo.common.DemoConstant
+import io.agora.chatdemo.common.extensions.internal.setSwitchDefaultStyle
+import io.agora.chatdemo.databinding.DemoActivityFeaturesBinding
+import io.agora.uikit.EaseIM
+import io.agora.uikit.base.EaseBaseActivity
+
+class FeaturesActivity: EaseBaseActivity<DemoActivityFeaturesBinding>(),View.OnClickListener {
+    override fun getViewBinding(inflater: LayoutInflater): DemoActivityFeaturesBinding {
+        return DemoActivityFeaturesBinding.inflate(inflater)
+    }
+
+    override fun onCreate(savedInstanceState: Bundle?) {
+        super.onCreate(savedInstanceState)
+        initView()
+        initListener()
+    }
+
+    fun initView(){
+        val enableTranslation = DemoHelper.getInstance().getDataModel().getBoolean(DemoConstant.FEATURES_TRANSLATION,true)
+        val enableThread = DemoHelper.getInstance().getDataModel().getBoolean(DemoConstant.FEATURES_THREAD,true)
+        val enableReaction = DemoHelper.getInstance().getDataModel().getBoolean(DemoConstant.FEATURES_REACTION,true)
+        val isTyping = DemoHelper.getInstance().getDataModel().getBoolean(DemoConstant.IS_TYPING_ON,true)
+        binding.switchItemTranslation.setChecked(enableTranslation)
+        binding.switchItemTranslation.setSwitchDefaultStyle()
+        binding.switchItemTopic.setChecked(enableThread)
+        binding.switchItemTopic.setSwitchDefaultStyle()
+        binding.switchItemReaction.setChecked(enableReaction)
+        binding.switchItemReaction.setSwitchDefaultStyle()
+        binding.switchItemTyping.setChecked(isTyping)
+        binding.switchItemTyping.setSwitchDefaultStyle()
+    }
+
+    fun initListener(){
+        binding.let {
+            it.titleBar.setNavigationOnClickListener{
+                mContext.onBackPressed()
+            }
+            it.switchItemTranslation.setOnClickListener(this)
+            it.switchItemTopic.setOnClickListener(this)
+            it.switchItemReaction.setOnClickListener(this)
+            it.switchItemTyping.setOnClickListener(this)
+        }
+    }
+
+    override fun onClick(v: View?) {
+        when(v?.id){
+            R.id.switch_item_translation -> {
+                binding.switchItemTranslation.switch?.let { switch ->
+                    val isChecked = switch.isChecked.not()
+                    binding.switchItemTranslation.setChecked(isChecked)
+                    EaseIM.getConfig()?.chatConfig?.enableTranslationMessage = isChecked
+                    DemoHelper.getInstance().getDataModel().putBoolean(DemoConstant.FEATURES_TRANSLATION,isChecked)
+                }
+            }
+            R.id.switch_item_topic -> {
+                binding.switchItemTopic.switch?.let { switch ->
+                    val isChecked = switch.isChecked.not()
+                    binding.switchItemTopic.setChecked(isChecked)
+                    EaseIM.getConfig()?.chatConfig?.enableChatThreadMessage = isChecked
+                    DemoHelper.getInstance().getDataModel().putBoolean(DemoConstant.FEATURES_THREAD,isChecked)
+                }
+            }
+            R.id.switch_item_reaction -> {
+                binding.switchItemReaction.switch?.let { switch ->
+                    val isChecked = switch.isChecked.not()
+                    binding.switchItemReaction.setChecked(isChecked)
+                    EaseIM.getConfig()?.chatConfig?.enableMessageReaction = isChecked
+                    DemoHelper.getInstance().getDataModel().putBoolean(DemoConstant.FEATURES_REACTION,isChecked)
+                }
+            }
+            R.id.switch_item_typing -> {
+                binding.switchItemTyping.switch?.let { switch ->
+                    val isChecked = switch.isChecked.not()
+                    binding.switchItemTyping.setChecked(isChecked)
+                    EaseIM.getConfig()?.chatConfig?.enableChatTyping = isChecked
+                    DemoHelper.getInstance().getDataModel().putBoolean(DemoConstant.IS_TYPING_ON,isChecked)
+                }
+            }
+            else -> {}
+        }
+    }
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/me/activity/LanguageSettingActivity.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/me/activity/LanguageSettingActivity.kt
new file mode 100644
index 00000000..9a37b869
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/me/activity/LanguageSettingActivity.kt
@@ -0,0 +1,196 @@
+package io.agora.chatdemo.page.me.activity
+
+import android.annotation.SuppressLint
+import android.content.Intent
+import android.os.Bundle
+import android.text.SpannableString
+import android.text.Spanned
+import android.text.style.ForegroundColorSpan
+import android.view.LayoutInflater
+import android.view.View
+import android.view.ViewGroup
+import android.widget.CheckBox
+import android.widget.TextView
+import androidx.core.content.ContextCompat
+import androidx.recyclerview.widget.LinearLayoutManager
+import androidx.recyclerview.widget.RecyclerView
+import io.agora.chatdemo.R
+import io.agora.chatdemo.bean.Language
+import io.agora.chatdemo.bean.LanguageType
+import io.agora.chatdemo.common.DemoConstant
+import io.agora.chatdemo.common.PreferenceManager
+import io.agora.chatdemo.databinding.DemoActivityLanguageBinding
+import io.agora.chatdemo.interfaces.LanguageListItemSelectListener
+import io.agora.uikit.base.EaseBaseActivity
+
+class LanguageSettingActivity: EaseBaseActivity<DemoActivityLanguageBinding>() {
+    private var tagList:MutableList<Language> = mutableListOf()
+    private var languageAdapter:LanguageAdapter? = null
+    private var languageTag:String = ""
+    private var languageCode:String = ""
+    private var languageType:Int = 0
+    private var selectedPosition: Int = -1
+
+    override fun getViewBinding(inflater: LayoutInflater): DemoActivityLanguageBinding {
+        return DemoActivityLanguageBinding.inflate(inflater)
+    }
+
+    companion object {
+        private const val RESULT_LANGUAGE_TAG = "language_tag"
+        private const val RESULT_LANGUAGE_CODE = "language_code"
+        private const val LANGUAGE_TYPE = "language_type"
+        private const val LANGUAGE_TYPE_TARGET = 1
+    }
+
+    override fun onCreate(savedInstanceState: Bundle?) {
+        super.onCreate(savedInstanceState)
+        intent.hasExtra(LANGUAGE_TYPE).apply {
+            languageType = intent.getIntExtra(LANGUAGE_TYPE,0)
+        }
+        initView()
+        initListener()
+    }
+
+    fun initView(){
+        defaultLanguage()
+        binding.let {
+            languageAdapter = LanguageAdapter(tagList)
+            val layoutManager = LinearLayoutManager(mContext)
+            it.rlSheetList.layoutManager = layoutManager
+            it.rlSheetList.adapter = this.languageAdapter
+            when(languageType){
+                LANGUAGE_TYPE_TARGET -> {
+                    binding.titleBar.setTitle(getString(R.string.currency_target_language))
+                    PreferenceManager.getValue(DemoConstant.TARGET_LANGUAGE,
+                        LanguageType.EN.value).let { tag->
+                        val index = tagList.indexOfFirst { language-> language.type.value == tag }
+                        languageCode = tag
+                        selectedPosition = index
+                        if (selectedPosition != -1){
+                            languageAdapter?.setSelectPosition(selectedPosition)
+                        }
+                    }
+                }
+                else -> {}
+            }
+            updateConfirm()
+        }
+    }
+
+    fun initListener(){
+        languageAdapter?.setLanguageListItemClickListener(object : LanguageListItemSelectListener{
+            override fun onSelectListener(position: Int,language:Language) {
+                languageTag = language.tag
+                languageCode = language.type.value
+                selectedPosition = position
+                updateConfirm()
+            }
+        })
+        binding.titleBar.setOnMenuItemClickListener { item->
+            when (item.itemId){
+                R.id.action_language_confirm -> {
+                    chengLanguage()
+                }
+                else -> {}
+            }
+            true
+        }
+        binding.titleBar.setNavigationOnClickListener{
+            mContext.onBackPressed()
+        }
+
+    }
+
+    fun updateConfirm(){
+        binding.let {
+            it.titleBar.getToolBar().let { tb ->
+                tb.menu.findItem(R.id.action_language_confirm)?.let { menuItem->
+                    menuItem.isVisible = true
+                    menuItem.title?.let { tl ->
+                        val spannable = SpannableString(menuItem.title)
+                        spannable.setSpan(
+                            ForegroundColorSpan(ContextCompat.getColor(mContext,
+                                if (selectedPosition != -1){
+                                    R.color.color_primary
+                                }else{
+                                    R.color.demo_on_background_high
+                                })
+                            )
+                            , 0, tl.length, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE)
+                        menuItem.title = spannable
+                    }
+                }
+            }
+        }
+    }
+
+    private fun chengLanguage(){
+        val resultIntent = Intent()
+        resultIntent.putExtra(RESULT_LANGUAGE_TAG,languageTag)
+        resultIntent.putExtra(RESULT_LANGUAGE_CODE,languageCode)
+        setResult(RESULT_OK,resultIntent)
+        finish()
+    }
+
+    private fun defaultLanguage(){
+        tagList = mutableListOf(
+            Language(LanguageType.ZH,getString(R.string.currency_language_zh_cn)),
+            Language(LanguageType.EN,getString(R.string.currency_language_en))
+        )
+    }
+
+    class LanguageAdapter(
+        private val languageList: MutableList<Language>?,
+    ) : RecyclerView.Adapter<LanguageAdapter.ViewHolder>(){
+        private lateinit var listener: LanguageListItemSelectListener
+        private var selectPosition:Int = -1
+
+        inner class ViewHolder(itemView: View) : RecyclerView.ViewHolder(itemView) {
+            val textView: TextView = itemView.findViewById(R.id.language_tag)
+            val tagCb: CheckBox = itemView.findViewById(R.id.language_cb)
+        }
+
+        override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): ViewHolder {
+            val view = LayoutInflater.from(parent.context).inflate(R.layout.ease_layout_language_item, parent, false)
+            return ViewHolder(view)
+        }
+
+        override fun getItemCount(): Int {
+            return languageList?.size ?: 0
+        }
+
+        override fun onBindViewHolder(holder: ViewHolder, @SuppressLint("RecyclerView") position: Int) {
+            languageList?.let {
+                holder.textView.text = it[position].tag
+                holder.tagCb.isChecked = selectPosition == position
+
+                holder.tagCb.isClickable = false
+
+                holder.itemView.setOnClickListener {
+                    if (position == selectPosition) {
+                        holder.tagCb.isChecked = false
+                        selectPosition = -1
+                    }else{
+                        holder.tagCb.isChecked = true
+                        selectPosition = position
+                    }
+                    notifyDataSetChanged()
+
+                    if (holder.tagCb.isChecked){
+                        listener.onSelectListener(position,languageList[selectPosition])
+                    }
+                }
+            }
+        }
+
+        fun setSelectPosition(selectPosition:Int){
+            this.selectPosition = selectPosition
+            notifyDataSetChanged()
+        }
+
+        fun setLanguageListItemClickListener(listener: LanguageListItemSelectListener){
+            this.listener = listener
+        }
+
+    }
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/me/activity/NotifyActivity.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/me/activity/NotifyActivity.kt
new file mode 100644
index 00000000..75cf1be7
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/me/activity/NotifyActivity.kt
@@ -0,0 +1,104 @@
+package io.agora.chatdemo.page.me.activity
+
+import android.os.Bundle
+import android.view.LayoutInflater
+import androidx.lifecycle.ViewModelProvider
+import androidx.lifecycle.lifecycleScope
+import io.agora.chatdemo.DemoHelper
+import io.agora.chatdemo.databinding.DemoActivityNotifyBinding
+import io.agora.chatdemo.viewmodel.PushViewModel
+import io.agora.uikit.base.EaseBaseActivity
+import io.agora.uikit.common.ChatLog
+import io.agora.uikit.common.ChatPushRemindType
+import io.agora.uikit.common.extensions.catchChatException
+import kotlinx.coroutines.launch
+
+class NotifyActivity: EaseBaseActivity<DemoActivityNotifyBinding>() {
+
+    private  var pushViewModel: PushViewModel? = null
+
+    override fun getViewBinding(inflater: LayoutInflater): DemoActivityNotifyBinding? {
+        return DemoActivityNotifyBinding.inflate(inflater)
+    }
+
+    override fun onCreate(savedInstanceState: Bundle?) {
+        super.onCreate(savedInstanceState)
+        initView()
+        initListener()
+        initData()
+    }
+
+    private fun initData() {
+        pushViewModel = ViewModelProvider(this)[PushViewModel::class.java]
+        pushViewModel?.let {
+            lifecycleScope.launch {
+                it.getSilentModeForApp()
+                    .catchChatException {
+                        ChatLog.e("notify", "initData: ${it.description}")
+                    }
+                    .collect {
+                        it.remindType?.let { remindType ->
+                            if (remindType == ChatPushRemindType.NONE) {
+                                DemoHelper.getInstance().getDataModel().setAppPushSilent(true)
+                                binding.switchItemNotify.setChecked(true)
+                            } else {
+                                DemoHelper.getInstance().getDataModel().setAppPushSilent(false)
+                                binding.switchItemNotify.setChecked(false)
+                            }
+                        }
+                    }
+            }
+        }
+    }
+
+    private fun initView(){
+        initSwitch()
+    }
+
+    private fun initSwitch(){
+//        binding.switchItemNotify.setSwitchTarckDrawable(com.hyphenate.easeui.R.drawable.ease_switch_track_selector)
+//        binding.switchItemNotify.setSwitchThumbDrawable(com.hyphenate.easeui.R.drawable.ease_switch_thumb_selector)
+    }
+
+    private fun initListener(){
+        binding.let {
+            it.titleBar.setNavigationOnClickListener{
+                mContext.onBackPressed()
+            }
+            it.switchItemNotify.setOnClickListener {
+                binding.switchItemNotify.switch?.let { switch ->
+                    val isChecked = switch.isChecked
+                    changeAppSilentModel(isChecked.not())
+                }
+            }
+        }
+    }
+
+    private fun changeAppSilentModel(checked: Boolean) {
+        lifecycleScope.launch {
+            if (checked) {
+                pushViewModel?.let {
+                    it.setSilentModeForApp()
+                        .catchChatException {
+                            ChatLog.e("notify", "changeAppSilentModel: ${it.description}")
+                        }
+                        .collect {
+                            DemoHelper.getInstance().getDataModel().setAppPushSilent(true)
+                            binding.switchItemNotify.setChecked(true)
+                        }
+                }
+            } else {
+                pushViewModel?.let {
+                    it.clearSilentModeForApp()
+                        .catchChatException {
+                            ChatLog.e("notify", "changeAppSilentModel: ${it.description}")
+                        }
+                        .collect {
+                            DemoHelper.getInstance().getDataModel().setAppPushSilent(false)
+                            binding.switchItemNotify.setChecked(false)
+                        }
+                }
+            }
+        }
+    }
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/me/activity/UserInformationActivity.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/me/activity/UserInformationActivity.kt
new file mode 100644
index 00000000..2693bb17
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/me/activity/UserInformationActivity.kt
@@ -0,0 +1,409 @@
+package io.agora.chatdemo.page.me.activity
+
+import android.Manifest
+import android.app.Activity
+import android.content.Intent
+import android.net.Uri
+import android.os.Build
+import android.os.Bundle
+import android.text.TextUtils
+import android.view.LayoutInflater
+import android.view.View
+import android.widget.ImageView
+import androidx.activity.result.ActivityResult
+import androidx.activity.result.ActivityResultLauncher
+import androidx.activity.result.PickVisualMediaRequest
+import androidx.activity.result.contract.ActivityResultContracts
+import androidx.appcompat.content.res.AppCompatResources
+import androidx.core.content.ContextCompat
+import androidx.lifecycle.ViewModelProvider
+import androidx.lifecycle.lifecycleScope
+import coil.load
+import com.yalantis.ucrop.UCrop
+import io.agora.chatdemo.DemoHelper
+import io.agora.chatdemo.R
+import io.agora.chatdemo.common.DemoConstant
+import io.agora.chatdemo.common.helper.DeveloperModeHelper
+import io.agora.chatdemo.databinding.DemoActivityMeInformationBinding
+import io.agora.chatdemo.page.me.CameraAndCroppingController
+import io.agora.chatdemo.utils.CameraAndCropFileUtils
+import io.agora.chatdemo.viewmodel.ProfileInfoViewModel
+import io.agora.uikit.EaseIM
+import io.agora.uikit.base.EaseBaseActivity
+import io.agora.uikit.common.ChatImageUtils
+import io.agora.uikit.common.ChatLog
+import io.agora.uikit.common.bus.EaseFlowBus
+import io.agora.uikit.common.dialog.SimpleListSheetDialog
+import io.agora.uikit.common.extensions.catchChatException
+import io.agora.uikit.common.extensions.dpToPx
+import io.agora.uikit.common.extensions.mainScope
+import io.agora.uikit.common.extensions.showToast
+import io.agora.uikit.common.permission.PermissionCompat
+import io.agora.uikit.common.utils.EaseCompat
+import io.agora.uikit.common.utils.EaseFileUtils
+import io.agora.uikit.configs.setAvatarStyle
+import io.agora.uikit.interfaces.SimpleListSheetItemClickListener
+import io.agora.uikit.model.EaseEvent
+import io.agora.uikit.model.EaseMenuItem
+import io.agora.uikit.model.EaseProfile
+import kotlinx.coroutines.flow.SharingStarted
+import kotlinx.coroutines.flow.onCompletion
+import kotlinx.coroutines.flow.onStart
+import kotlinx.coroutines.flow.stateIn
+import kotlinx.coroutines.launch
+import java.io.File
+
+
+class UserInformationActivity: EaseBaseActivity<DemoActivityMeInformationBinding>(),
+    View.OnClickListener {
+
+    private val cameraAndCroppingController: CameraAndCroppingController by lazy {
+        CameraAndCroppingController(mContext)
+    }
+    private var selfProfile: EaseProfile? = null
+    private var showSelectDialog: SimpleListSheetDialog? = null
+    private var imageUri:Uri?= null
+    private lateinit var model: ProfileInfoViewModel
+
+    override fun getViewBinding(inflater: LayoutInflater): DemoActivityMeInformationBinding? {
+        return DemoActivityMeInformationBinding.inflate(inflater)
+    }
+    companion object {
+        private const val REQUEST_CODE_STORAGE_PICTURE = 111
+        private const val REQUEST_CODE_CAMERA = 112
+        private const val REQUEST_CODE_LOCAL_EDIT = 113
+        private const val RESULT_CODE_CAMERA = 114
+        private const val RESULT_CODE_LOCAL = 115
+        private const val RESULT_CODE_UPDATE_NAME = 116
+        private const val RESULT_REFRESH = "isRefresh"
+    }
+
+    private val requestCameraPermission: ActivityResultLauncher<Array<String>> =
+        registerForActivityResult(
+            ActivityResultContracts.RequestMultiplePermissions()
+        ) { result ->
+            onRequestResult(
+                result,
+                REQUEST_CODE_CAMERA
+            )
+        }
+
+    private val requestImagePermission: ActivityResultLauncher<Array<String>> =
+        registerForActivityResult(
+            ActivityResultContracts.RequestMultiplePermissions()
+        ) { result ->
+            onRequestResult(
+                result,
+                REQUEST_CODE_STORAGE_PICTURE
+            )
+        }
+
+    private val launcherToCamera: ActivityResultLauncher<Intent> = registerForActivityResult(
+        ActivityResultContracts.StartActivityForResult()
+    ) { result -> onActivityResult(result, RESULT_CODE_CAMERA)
+    }
+    private val launcherToAlbum: ActivityResultLauncher<Intent> = registerForActivityResult(
+        ActivityResultContracts.StartActivityForResult()
+    ) { result -> onActivityResult(result, RESULT_CODE_LOCAL) }
+
+    private val launcherToUpdateName: ActivityResultLauncher<Intent> = registerForActivityResult(
+        ActivityResultContracts.StartActivityForResult()
+    ) { result -> onActivityResult(result, RESULT_CODE_UPDATE_NAME) }
+
+
+    private val launcherToMedia = registerForActivityResult(ActivityResultContracts.PickVisualMedia()) { uri ->
+        // Callback is invoked after the user selects a media item or closes the
+        if (uri != null) {
+            ChatLog.d("launcherToMedia", "Selected URI: $uri")
+            cameraAndCroppingController.gotoCrop(uri)
+        } else {
+            ChatLog.d("launcherToMedia", "No media selected")
+        }
+    }
+
+    override fun onCreate(savedInstanceState: Bundle?) {
+        super.onCreate(savedInstanceState)
+        initView()
+        initListener()
+        initData()
+    }
+
+    private fun initView(){
+        EaseIM.getConfig()?.avatarConfig?.setAvatarStyle(binding.ivAvatar)
+        binding.run {
+            ivAvatar.setRadius(8.dpToPx(this@UserInformationActivity))
+            ivAvatar.scaleType = ImageView.ScaleType.CENTER_CROP
+        }
+        updateLocalData()
+    }
+
+    private fun initListener(){
+        binding.run {
+            titleBar.setNavigationOnClickListener{ finish() }
+            avatarLayout.setOnClickListener(this@UserInformationActivity)
+            nickNameLayout.setOnClickListener(this@UserInformationActivity)
+        }
+    }
+
+    private fun initData(){
+        model = ViewModelProvider(this)[ProfileInfoViewModel::class.java]
+    }
+
+    private fun updateLocalData(){
+        binding.run {
+            selfProfile = EaseIM.getCurrentUser()
+            selfProfile?.let { profile->
+                val ph = AppCompatResources.getDrawable(this@UserInformationActivity, io.agora.uikit.R.drawable.ease_default_avatar)
+                val ep = AppCompatResources.getDrawable(this@UserInformationActivity, io.agora.uikit.R.drawable.ease_default_avatar)
+                ivAvatar.load(profile.avatar ?: ph) {
+                    placeholder(ph)
+                    error(ep)
+                }
+                tvNickName.text = profile.getNotEmptyName()
+            }
+        }
+    }
+
+    private fun showSelectDialog(){
+        val context = this@UserInformationActivity
+        showSelectDialog = SimpleListSheetDialog(
+            context = context,
+            itemList = mutableListOf(
+                EaseMenuItem(
+                    menuId = R.id.about_information_camera,
+                    title = getString(R.string.main_about_me_information_camera),
+                    titleColor = ContextCompat.getColor(context, R.color.color_primary)
+                ),
+                EaseMenuItem(
+                    menuId = R.id.about_information_picture,
+                    title = getString(R.string.main_about_me_information_picture),
+                    titleColor = ContextCompat.getColor(context, R.color.color_primary)
+                )
+            ),
+            itemListener = object : SimpleListSheetItemClickListener {
+                override fun onItemClickListener(position: Int, menu: EaseMenuItem) {
+                    simpleMenuItemClickListener(menu)
+                    showSelectDialog?.dismiss()
+                }
+            })
+        supportFragmentManager.let { showSelectDialog?.show(it,"image_select_dialog") }
+    }
+
+    fun simpleMenuItemClickListener(menu: EaseMenuItem){
+        when(menu.menuId){
+            R.id.about_information_camera -> {
+                if (PermissionCompat.checkPermission(
+                        mContext,
+                        requestCameraPermission,
+                        Manifest.permission.CAMERA,
+                    )
+                ) {
+                    cameraAndCroppingController.selectPicFromCamera(launcherToCamera)
+                }
+            }
+            R.id.about_information_picture -> {
+                if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.S_V2){
+                    val mimeType = "image/*"
+                    launcherToMedia.launch(PickVisualMediaRequest(ActivityResultContracts.PickVisualMedia.SingleMimeType(mimeType)))
+                }else{
+                    if (PermissionCompat.checkMediaPermission(
+                            mContext,
+                            requestImagePermission,
+                            Manifest.permission.READ_MEDIA_IMAGES
+                        )
+                    ) {
+                        selectPicFromLocal(launcherToAlbum)
+                    }
+                }
+            }
+            else -> {}
+        }
+    }
+
+
+    private fun onRequestResult(result: Map<String, Boolean>?, requestCode: Int) {
+        if (!result.isNullOrEmpty()) {
+            for ((key, value) in result) {
+                ChatLog.e("UserInformationActivity", "onRequestResult: $key  $value")
+            }
+            if (PermissionCompat.getMediaAccess(mContext) !== PermissionCompat.StorageAccess.Denied) {
+                if (requestCode == REQUEST_CODE_STORAGE_PICTURE) {
+                    selectPicFromLocal(launcherToAlbum)
+                }else if (requestCode == REQUEST_CODE_CAMERA){
+                    cameraAndCroppingController.selectPicFromCamera(launcherToCamera)
+                }else if (requestCode == REQUEST_CODE_LOCAL_EDIT){
+                    imageUri?.let { cameraAndCroppingController.gotoCrop(it) }
+                }
+            }
+        }
+    }
+
+    /**
+     * It's the result from ActivityResultLauncher.
+     * @param result
+     * @param requestCode
+     */
+    private fun onActivityResult(result: ActivityResult, requestCode: Int) {
+        if (result.resultCode == Activity.RESULT_OK) {
+            val data = result.data
+            when (requestCode) {
+                RESULT_CODE_CAMERA -> { // capture new image
+                    onActivityResultForCamera(data)
+                }
+                RESULT_CODE_LOCAL -> {
+                    onActivityResultForLocalPhotos(data)
+                }
+                RESULT_CODE_UPDATE_NAME -> {
+                    data?.let {
+                        if (it.hasExtra(RESULT_REFRESH) && it.getBooleanExtra(RESULT_REFRESH,false)){
+                            it.getStringExtra("nickname")?.let { name ->
+                                updateUsername(name)
+                            }
+                        }
+                    }
+                }
+            }
+        }
+    }
+
+    override fun onActivityResult(requestCode: Int, resultCode: Int, data: Intent?) {
+        super.onActivityResult(requestCode, resultCode, data)
+        data?.let {
+            if (resultCode == RESULT_OK && requestCode == UCrop.REQUEST_CROP) {
+                val resultUri = UCrop.getOutput(data)
+                resultUri?.let { it1 ->
+                    val result = ChatImageUtils.checkDegreeAndRestoreImage(mContext,it1)
+                    imageUri = result
+                    val path = CameraAndCropFileUtils.getAbsolutePathFromUri(mContext, result)
+                    ChatLog.e("UserInformationActivity","onActivityResult corp path $path")
+                    path?.let {
+                        uploadFile(it)
+                    }
+                }
+            } else if (resultCode == UCrop.RESULT_ERROR) {
+                val cropError = UCrop.getError(data)
+                ChatLog.e("UserInformationActivity","onActivityResult corp error ${cropError?.message}")
+            } else {
+
+            }
+        }
+    }
+
+    private fun onActivityResultForCamera(data: Intent?) {
+        val imageUri = cameraAndCroppingController.resultForCamera(data)
+        val result = ChatImageUtils.checkDegreeAndRestoreImage(mContext,imageUri)
+        this.imageUri = result
+        imageUri?.let {
+            cameraAndCroppingController.gotoCrop(it)
+        }
+    }
+
+    private fun onActivityResultForLocalPhotos(data: Intent?) {
+        if (data != null) {
+            val selectedImage = data.data
+            if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.S_V2){
+                selectedImage?.let { cameraAndCroppingController.gotoCrop(it) }
+            }else{
+                if (selectedImage != null) {
+                    var filePath: String = EaseFileUtils.getFilePath(mContext, selectedImage)
+                    if (!TextUtils.isEmpty(filePath) && File(filePath).exists()) {
+                        imageUri = Uri.parse(filePath)
+                    } else {
+                        imageUri = selectedImage
+                        selectedImage.path?.let {
+                            filePath = it
+                        }
+                    }
+                    imageUri?.let { cameraAndCroppingController.gotoCrop(it) }
+                }
+            }
+        }
+    }
+
+    /**
+     * select local image
+     */
+    private fun selectPicFromLocal(launcher: ActivityResultLauncher<Intent>?) {
+        EaseCompat.openImageByLauncher(launcher, mContext)
+    }
+
+    private fun updateUserAvatar(){
+        selfProfile = EaseIM.getCurrentUser()
+        EaseFlowBus.with<EaseEvent>(EaseEvent.EVENT.UPDATE + EaseEvent.TYPE.CONTACT)
+            .post(lifecycleScope, EaseEvent(DemoConstant.EVENT_UPDATE_SELF, EaseEvent.TYPE.CONTACT))
+    }
+
+    private fun updateUsername(nickname: String){
+        lifecycleScope.launch {
+            model.updateUserNickName(nickname)
+                .onStart {
+                    showLoading(true)
+                }
+                .onCompletion { dismissLoading() }
+                .catchChatException { e ->
+                    ChatLog.e("TAG", "updateUserNickName fail error message = " + e.description)
+                    mainScope().launch {
+                        mContext.showToast("updateUsername error ${e.errorCode} ${e.description}")
+                    }
+                }
+                .stateIn(lifecycleScope, SharingStarted.WhileSubscribed(5000), null)
+                .collect {
+
+                    EaseIM.getCurrentUser()?.let {profile ->
+                        profile.name = nickname
+                        DemoHelper.getInstance().getDataModel().insertUser(profile)
+                        EaseIM.updateCurrentUser(profile)
+                    }
+                    binding.tvNickName.text = nickname
+                    EaseFlowBus.with<EaseEvent>(EaseEvent.EVENT.UPDATE + EaseEvent.TYPE.CONTACT)
+                        .post(lifecycleScope, EaseEvent(DemoConstant.EVENT_UPDATE_SELF, EaseEvent.TYPE.CONTACT))
+                }
+        }
+    }
+
+    private fun uploadFile(filePath:String?){
+        ChatLog.e("UserInformationActivity","uploadFile filePath $filePath")
+        val scaledImage = ChatImageUtils.getScaledImageByUri(this,filePath)
+        lifecycleScope.launch {
+            model.uploadAvatar(scaledImage)
+                .onStart {
+                    showLoading(true)
+                }
+                .onCompletion { dismissLoading() }
+                .catchChatException { e ->
+                    ChatLog.e("UserInformationActivity", "uploadAvatar fail error message = " + e.description)
+                    mainScope().launch {
+                        mContext.showToast("uploadFile error ${e.errorCode} ${e.description}")
+                    }
+                }
+                .stateIn(lifecycleScope, SharingStarted.WhileSubscribed(5000), null)
+                .collect {
+                    it?.let {
+                        binding.ivAvatar.setImageURI(imageUri)
+                        updateUserAvatar()
+                    }
+                }
+        }
+    }
+
+    override fun onClick(v: View?) {
+       when(v?.id){
+           R.id.avatar_layout -> {
+               if (!DeveloperModeHelper.isDeveloperMode()){
+                   showSelectDialog()
+               }else{
+                   mainScope().launch {
+                       mContext.showToast(mContext.getString(R.string.main_information_checked_model))
+                   }
+               }
+           }
+           R.id.nick_name_layout -> {
+               launcherToUpdateName.launch(Intent(
+                   this@UserInformationActivity,
+                   EditUserNicknameActivity::class.java))
+           }
+           else -> {}
+       }
+    }
+
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/me/activity/WebViewActivity.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/me/activity/WebViewActivity.kt
new file mode 100644
index 00000000..d8d6d331
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/me/activity/WebViewActivity.kt
@@ -0,0 +1,77 @@
+package io.agora.chatdemo.page.me.activity
+
+import android.annotation.SuppressLint
+import android.content.Context
+import android.content.Intent
+import android.os.Bundle
+import android.util.Log
+import android.view.LayoutInflater
+import android.webkit.WebViewClient
+import io.agora.chatdemo.databinding.DemoActivityWebviewBinding
+import io.agora.uikit.base.EaseBaseActivity
+
+class WebViewActivity : EaseBaseActivity<DemoActivityWebviewBinding>() {
+    private var url = "https://www.agora.io/en/"
+
+    override fun getViewBinding(inflater: LayoutInflater): DemoActivityWebviewBinding? {
+        return DemoActivityWebviewBinding.inflate(inflater)
+    }
+
+    @SuppressLint("SetJavaScriptEnabled")
+    override fun onCreate(savedInstanceState: Bundle?) {
+        super.onCreate(savedInstanceState)
+        if ( intent.hasExtra(LOAD_TYPE) ){
+            val type =  WebViewLoadType.from(intent.getIntExtra(LOAD_TYPE,0))
+            if (type == WebViewLoadType.LocalHtml){
+                url = "Html"
+            } else if (type == WebViewLoadType.RemoteUrl){
+                url = intent.getStringExtra(LOAD_URL)?:""
+            }
+        }
+        binding.let {
+            val webSettings = it.wbView.settings
+            webSettings.javaScriptEnabled = true
+            it.wbView.webViewClient = WebViewClient()
+            it.wbView.loadUrl(url)
+            it.titleBar.setNavigationOnClickListener{
+                mContext.onBackPressed()
+            }
+        }
+    }
+
+    companion object {
+        private const val LOAD_TYPE = "webView_load_type"
+        private const val LOAD_URL = "webView_url"
+        fun actionStart(context: Context,type:WebViewLoadType,url:String?=null) {
+            Intent(context, WebViewActivity::class.java).apply {
+                putExtra(LOAD_TYPE, type.ordinal)
+                url?.let {
+                    if (it.isNotEmpty()){
+                        putExtra(LOAD_URL,it)
+                    }
+                }
+                context.startActivity(this)
+            }
+        }
+    }
+}
+
+enum class WebViewLoadType(val value:Int){
+    RemoteUrl(0),
+    LocalHtml(1),
+    LocalUrl(2);
+
+    companion object {
+        fun from(value: Int): WebViewLoadType {
+            val types = WebViewLoadType.values()
+            val length = types.size
+            for (i in 0 until length) {
+                val type = types[i]
+                if (type.value == value) {
+                    return type
+                }
+            }
+            return RemoteUrl
+        }
+    }
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/me/fragment/AboutMeFragment.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/me/fragment/AboutMeFragment.kt
new file mode 100644
index 00000000..d456b5ac
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/me/fragment/AboutMeFragment.kt
@@ -0,0 +1,261 @@
+package io.agora.chatdemo.page.me.fragment
+
+import android.content.ClipData
+import android.content.ClipboardManager
+import android.content.Context
+import android.content.Intent
+import android.os.Bundle
+import android.view.LayoutInflater
+import android.view.View
+import android.view.ViewGroup
+import androidx.core.content.ContextCompat
+import androidx.lifecycle.ViewModelProvider
+import androidx.lifecycle.lifecycleScope
+import io.agora.chatdemo.DemoApplication
+import io.agora.chatdemo.DemoHelper
+import io.agora.chatdemo.R
+import io.agora.chatdemo.common.DemoConstant
+import io.agora.chatdemo.common.PresenceCache
+import io.agora.chatdemo.databinding.DemoFragmentAboutMeBinding
+import io.agora.chatdemo.feature.presence.controller.PresenceController
+import io.agora.chatdemo.feature.presence.interfaces.IPresenceResultView
+import io.agora.chatdemo.feature.presence.utils.EasePresenceUtil
+import io.agora.chatdemo.feature.presence.viewmodel.PresenceViewModel
+import io.agora.chatdemo.page.login.LoginActivity
+import io.agora.chatdemo.page.login.viewModel.LoginViewModel
+import io.agora.chatdemo.page.me.activity.AboutActivity
+import io.agora.chatdemo.page.me.activity.CurrencyActivity
+import io.agora.chatdemo.page.me.activity.NotifyActivity
+import io.agora.chatdemo.page.me.activity.UserInformationActivity
+import io.agora.uikit.EaseIM
+import io.agora.uikit.base.EaseBaseFragment
+import io.agora.uikit.common.ChatClient
+import io.agora.uikit.common.ChatLog
+import io.agora.uikit.common.ChatPresence
+import io.agora.uikit.common.bus.EaseFlowBus
+import io.agora.uikit.common.dialog.CustomDialog
+import io.agora.uikit.common.extensions.catchChatException
+import io.agora.uikit.common.extensions.dpToPx
+import io.agora.uikit.configs.setStatusStyle
+import io.agora.uikit.feature.contact.EaseBlockListActivity
+import io.agora.uikit.model.EaseEvent
+import io.agora.uikit.widget.EaseCustomAvatarView
+import kotlinx.coroutines.launch
+
+class AboutMeFragment: EaseBaseFragment<DemoFragmentAboutMeBinding>(), View.OnClickListener,
+    EaseCustomAvatarView.OnPresenceClickListener, IPresenceResultView {
+
+    /**
+     * The clipboard manager.
+     */
+    private val clipboard by lazy { mContext.getSystemService(Context.CLIPBOARD_SERVICE) as ClipboardManager }
+
+    private lateinit var loginViewModel: LoginViewModel
+
+    private val presenceViewModel by lazy { ViewModelProvider(this)[PresenceViewModel::class.java] }
+    private val presenceController by lazy { PresenceController(mContext,presenceViewModel) }
+
+    companion object{
+        private val TAG = AboutMeFragment::class.java.simpleName
+    }
+
+    override fun getViewBinding(
+        inflater: LayoutInflater,
+        container: ViewGroup?
+    ): DemoFragmentAboutMeBinding {
+        return DemoFragmentAboutMeBinding.inflate(inflater)
+    }
+
+    override fun initView(savedInstanceState: Bundle?) {
+        super.initView(savedInstanceState)
+        initPresence()
+        initStatus()
+    }
+    override fun initViewModel() {
+        super.initViewModel()
+        loginViewModel = ViewModelProvider(this)[LoginViewModel::class.java]
+        presenceViewModel.attachView(this)
+    }
+
+    override fun initListener() {
+        super.initListener()
+        binding?.run {
+            epPresence.setOnPresenceClickListener(this@AboutMeFragment)
+            tvNumber.setOnClickListener(this@AboutMeFragment)
+            itemPresence.setOnClickListener(this@AboutMeFragment)
+            itemInformation.setOnClickListener(this@AboutMeFragment)
+            itemCurrency.setOnClickListener(this@AboutMeFragment)
+            itemNotify.setOnClickListener(this@AboutMeFragment)
+            itemPrivacy.setOnClickListener(this@AboutMeFragment)
+            itemAbout.setOnClickListener(this@AboutMeFragment)
+            aboutMeLogout.setOnClickListener(this@AboutMeFragment)
+        }
+    }
+
+    override fun onDestroyView() {
+        super.onDestroyView()
+    }
+
+    override fun initData() {
+        super.initData()
+        fetchCurrentPresence()
+        initEvent()
+    }
+
+    private fun initEvent() {
+        EaseFlowBus.with<EaseEvent>(EaseEvent.EVENT.UPDATE.name).register(this) {
+            if (it.isPresenceChange && it.message.equals(EaseIM.getCurrentUser()?.id) ) {
+                updatePresence()
+            }
+        }
+
+        EaseFlowBus.with<EaseEvent>(EaseEvent.EVENT.UPDATE + EaseEvent.TYPE.CONTACT).register(this) {
+            if (it.isContactChange && it.event == DemoConstant.EVENT_UPDATE_SELF) {
+                updatePresence(true)
+            }
+        }
+    }
+
+    private fun initPresence(){
+        binding?.run {
+            var name:String? = ChatClient.getInstance().currentUser
+            val id = getString(R.string.main_about_me_id,ChatClient.getInstance().currentUser?:"")
+            EaseIM.getConfig()?.avatarConfig?.setStatusStyle(epPresence.getStatusView(),4.dpToPx(mContext),
+                ContextCompat.getColor(mContext, R.color.demo_background))
+            epPresence.setPresenceStatusMargin(end = -4, bottom = -4)
+            epPresence.setPresenceStatusSize(resources.getDimensionPixelSize(io.agora.uikit.R.dimen.ease_contact_status_icon_size))
+
+            val layoutParams = epPresence.getUserAvatar().layoutParams
+            layoutParams.width = 100.dpToPx(mContext)
+            layoutParams.height = 100.dpToPx(mContext)
+            epPresence.getUserAvatar().layoutParams = layoutParams
+
+            EaseIM.getCurrentUser()?.let {
+                epPresence.setUserAvatarData(it)
+                name = it.getRemarkOrName()
+            }
+            tvName.text = name
+            tvNumber.text = id
+        }
+    }
+
+    private fun updatePresence(isRefreshAvatar:Boolean = false){
+        EaseIM.getCurrentUser()?.let { user->
+            val presence = PresenceCache.getUserPresence(user.id)
+            presence?.let {
+                if (isRefreshAvatar){
+                    binding?.epPresence?.setUserAvatarData(user)
+                }else{
+                    binding?.epPresence?.setUserStatusData(EasePresenceUtil.getPresenceIcon(mContext,it))
+                    binding?.epPresence?.getStatusView()?.visibility = View.VISIBLE
+                    val subtitle = EasePresenceUtil.getPresenceString(mContext,it)
+                    binding?.itemPresence?.setContent(subtitle)
+                }
+            }?:kotlin.run {
+                binding?.epPresence?.setUserAvatarData(user)
+            }
+            binding?.tvName?.text = user.getNotEmptyName()
+        }
+    }
+
+    private fun initStatus(){
+        val isSilent = EaseIM.checkMutedConversationList(ChatClient.getInstance().currentUser)
+        if (isSilent) {
+            binding?.icNotice?.visibility = View.VISIBLE
+        }else{
+            binding?.icNotice?.visibility = View.GONE
+        }
+    }
+
+    private fun logout() {
+        lifecycleScope.launch {
+            loginViewModel.logout()
+                .catchChatException { e ->
+                    ChatLog.e(TAG, "logout failed: ${e.description}")
+                }
+                .collect {
+                    DemoHelper.getInstance().getDataModel().clearCache()
+                    PresenceCache.clear()
+                    DemoApplication.getInstance().getLifecycleCallbacks().skipToTarget(
+                        LoginActivity::class.java)
+                }
+        }
+    }
+
+
+    private fun fetchCurrentPresence(){
+        presenceViewModel.fetchPresenceStatus(mutableListOf(ChatClient.getInstance().currentUser))
+    }
+
+    override fun onPresenceClick(v: View?) {
+
+    }
+
+    override fun onClick(v: View?) {
+        when(v?.id){
+            R.id.item_presence -> {
+                EaseIM.getCurrentUser()?.id?.let {
+                    presenceController.showPresenceStatusDialog(PresenceCache.getUserPresence(it))
+                }
+            }
+            R.id.item_information -> {
+                startActivity(Intent(mContext, UserInformationActivity::class.java))
+            }
+            R.id.item_currency -> {
+                startActivity(Intent(mContext, CurrencyActivity::class.java))
+            }
+            R.id.item_notify -> {
+                startActivity(Intent(mContext, NotifyActivity::class.java))
+            }
+            R.id.item_privacy -> {
+                startActivity(Intent(mContext, EaseBlockListActivity::class.java))
+            }
+            R.id.item_about -> {
+                startActivity(Intent(mContext, AboutActivity::class.java))
+            }
+            R.id.about_me_logout -> {
+                showLogoutDialog()
+            }
+            R.id.tv_number -> {
+                val indexOfSpace = binding?.tvNumber?.text?.indexOf(":")
+                indexOfSpace?.let {
+                    if (indexOfSpace != -1) {
+                        val substring = binding?.tvNumber?.text?.substring(indexOfSpace + 1)
+                        clipboard.setPrimaryClip(
+                            ClipData.newPlainText(
+                                null,
+                                substring
+                            )
+                        )
+                    }
+                }
+
+            }
+            else -> {}
+        }
+    }
+
+    private fun showLogoutDialog(){
+        val logoutDialog = CustomDialog(
+            context = mContext,
+            title = resources.getString(R.string.demo_login_out_hint),
+            isEditTextMode = false,
+            onLeftButtonClickListener = {
+
+            },
+            onRightButtonClickListener = {
+                logout()
+            }
+        )
+        logoutDialog.show()
+    }
+
+    override fun fetchPresenceStatusSuccess(presence: MutableList<ChatPresence>) {
+        updatePresence()
+    }
+
+    override fun fetchPresenceStatusFail(code: Int, message: String?) {
+
+    }
+
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/splash/SplashActivity.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/splash/SplashActivity.kt
new file mode 100644
index 00000000..679a7f6e
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/splash/SplashActivity.kt
@@ -0,0 +1,106 @@
+package io.agora.chatdemo.page.splash
+
+import android.animation.Animator
+import android.content.Intent
+import android.view.LayoutInflater
+import android.view.View
+import androidx.annotation.StringRes
+import androidx.appcompat.app.AppCompatActivity
+import androidx.core.content.ContextCompat
+import androidx.lifecycle.ViewModelProvider
+import androidx.lifecycle.lifecycleScope
+import io.agora.chatdemo.DemoHelper
+import io.agora.chatdemo.MainActivity
+import io.agora.chatdemo.R
+import io.agora.chatdemo.base.BaseInitActivity
+import io.agora.chatdemo.common.dialog.SimpleDialog
+import io.agora.chatdemo.common.dialog.fragment.DemoAgreementDialogFragment
+import io.agora.chatdemo.common.dialog.fragment.DemoDialogFragment
+import io.agora.chatdemo.databinding.DemoSplashActivityBinding
+import io.agora.chatdemo.page.login.LoginActivity
+import io.agora.chatdemo.page.splash.viewModel.SplashViewModel
+import io.agora.uikit.common.ChatLog
+import io.agora.uikit.common.extensions.catchChatException
+import kotlinx.coroutines.flow.SharingStarted
+import kotlinx.coroutines.flow.stateIn
+import kotlinx.coroutines.launch
+import kotlin.system.exitProcess
+
+class SplashActivity : BaseInitActivity<DemoSplashActivityBinding>() {
+    private lateinit var model: SplashViewModel
+
+    override fun getViewBinding(inflater: LayoutInflater): DemoSplashActivityBinding? {
+        return DemoSplashActivityBinding.inflate(inflater)
+    }
+
+    override fun setActivityTheme() {
+        setFitSystemForTheme(false, ContextCompat.getColor(this, R.color.transparent), true)
+    }
+
+    override fun initData() {
+        super.initData()
+        model = ViewModelProvider(this)[SplashViewModel::class.java]
+        binding.ivSplash.animate()
+            .alpha(1f)
+            .setDuration(500)
+            .setListener(object : Animator.AnimatorListener {
+                override fun onAnimationStart(animation: Animator) {}
+                override fun onAnimationEnd(animation: Animator) {
+                    checkIfAgreePrivacy()
+                }
+
+                override fun onAnimationCancel(animation: Animator) {}
+                override fun onAnimationRepeat(animation: Animator) {}
+            })
+            .start()
+        binding.tvProduct.animate()
+            .alpha(1f)
+            .setDuration(500)
+            .start()
+    }
+
+    private fun checkIfAgreePrivacy() {
+        checkSDKValid()
+    }
+
+    private fun checkSDKValid() {
+        if (DemoHelper.getInstance().hasAppKey.not()) {
+            showAlertDialog(R.string.splash_not_appkey)
+        } else {
+            if (DemoHelper.getInstance().isSDKInited().not()) {
+                showAlertDialog(R.string.splash_not_init)
+            } else {
+                loginSDK()
+            }
+        }
+    }
+
+    private fun showAlertDialog(@StringRes title: Int) {
+        SimpleDialog.Builder(mContext)
+            .setTitle(getString(title))
+            .setPositiveButton(getString(R.string.confirm)) {
+                exitProcess(1)
+            }
+            .dismissNegativeButton()
+            .show()
+    }
+
+    private fun loginSDK() {
+        lifecycleScope.launch {
+            model.loginData()
+                .catchChatException { e ->
+                    ChatLog.e("TAG", "error message = " + e.description)
+                    LoginActivity.startAction(mContext)
+                    finish()
+                }
+                .stateIn(lifecycleScope, SharingStarted.WhileSubscribed(5000), false)
+                .collect {
+                    if (it) {
+                        DemoHelper.getInstance().getDataModel().initDb()
+                        startActivity(Intent(mContext, MainActivity::class.java))
+                        finish()
+                    }
+                }
+        }
+    }
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/splash/repository/ChatClientRepository.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/splash/repository/ChatClientRepository.kt
new file mode 100644
index 00000000..d7085e50
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/splash/repository/ChatClientRepository.kt
@@ -0,0 +1,263 @@
+package io.agora.chatdemo.page.splash.repository
+
+import android.util.Log
+import io.agora.chatdemo.BuildConfig
+import io.agora.chatdemo.DemoHelper
+import io.agora.chatdemo.base.BaseRepository
+import io.agora.chatdemo.bean.LoginResult
+import io.agora.chatdemo.common.ErrorCode
+import io.agora.chatdemo.common.helper.DeveloperModeHelper
+import io.agora.cloud.HttpClientManager
+import io.agora.uikit.EaseIM
+import io.agora.uikit.common.ChatClient
+import io.agora.uikit.common.ChatError
+import io.agora.uikit.common.ChatException
+import io.agora.uikit.common.ChatLog
+import io.agora.uikit.common.ChatValueCallback
+import io.agora.uikit.feature.invitation.helper.EaseNotificationMsgManager
+import io.agora.uikit.model.EaseProfile
+import io.agora.uikit.model.EaseUser
+import kotlinx.coroutines.Dispatchers
+import kotlinx.coroutines.withContext
+import org.json.JSONException
+import org.json.JSONObject
+import kotlin.coroutines.Continuation
+import kotlin.coroutines.resume
+import kotlin.coroutines.resumeWithException
+import kotlin.coroutines.suspendCoroutine
+
+
+/**
+ * As the repository of ChatManager, handles ChatManager related logic
+ */
+class ChatClientRepository: BaseRepository() {
+
+    companion object {
+        private const val LOGIN_URL = BuildConfig.APP_SERVER_PROTOCOL + "://" + BuildConfig.APP_SERVER_DOMAIN +
+                BuildConfig.APP_SERVER_URL
+    }
+
+    /**
+     * 登录过后需要加载的数据
+     * @return
+     */
+    suspend fun loadAllInfoFromAgora(): Boolean =
+        withContext(Dispatchers.IO) {
+            suspendCoroutine { continuation ->
+                ChatLog.e("login info","isLoggedInBefore ${ChatClient.getInstance().isLoggedInBefore} - autoLogin ${ChatClient.getInstance().options.autoLogin}")
+                if (ChatClient.getInstance().isLoggedInBefore && ChatClient.getInstance().options.autoLogin) {
+                    loadAllConversationsAndGroups()
+                    continuation.resume(true)
+                } else {
+                    continuation.resumeWithException(ChatException(ErrorCode.EM_NOT_LOGIN, ""))
+                }
+            }
+        }
+
+
+    /**
+     * Login to app server and get token.
+     */
+    suspend fun loginFromServer(userName: String, userPassword: String): LoginResult =
+        withContext(Dispatchers.IO) {
+            suspendCoroutine { continuation ->
+                loginFromAppServer(userName, userPassword, object : ChatValueCallback<LoginResult> {
+                    override fun onSuccess(value: LoginResult) {
+                        continuation.resume(value)
+                    }
+
+                    override fun onError(code: Int, error: String?) {
+                        continuation.resumeWithException(ChatException(code, error))
+                    }
+                })
+            }
+        }
+
+    /**
+     * logout
+     * @param unbindDeviceToken
+     * @return
+     */
+    suspend fun logout(unbindDeviceToken: Boolean): Int =
+        withContext(Dispatchers.IO) {
+            suspendCoroutine { continuation ->
+                EaseIM.logout(unbindDeviceToken, onSuccess = {
+                    continuation.resume(ChatError.EM_NO_ERROR)
+                }, onError = { code, error ->
+                    continuation.resumeWithException(ChatException(code, error))
+                })
+            }
+        }
+
+    /**
+     * Get all unread message count.
+     */
+    suspend fun getAllUnreadMessageCount(): Int =
+        withContext(Dispatchers.IO) {
+            val systemConversation = EaseNotificationMsgManager.getInstance().getConversation()
+            val systemUnread = systemConversation.unreadMsgCount
+            val allUnread = ChatClient.getInstance().chatManager().unreadMessageCount
+            ChatLog.d("ChatClientRepository","getAllUnreadMessageCount ${allUnread - systemUnread}")
+            allUnread - systemUnread
+        }
+
+    /**
+     * Get all unread request count.
+     */
+    suspend fun getRequestUnreadCount():Int =
+        withContext(Dispatchers.IO) {
+            val systemConversation = EaseNotificationMsgManager.getInstance().getConversation()
+            ChatLog.d("ChatClientRepository","getRequestUnreadCount ${systemConversation.unreadMsgCount}")
+            systemConversation.unreadMsgCount
+        }
+
+    /**
+     * 从本地数据库加载所有的对话及群组
+     */
+    private fun loadAllConversationsAndGroups() {
+        // 从本地数据库加载所有的对话及群组
+        ChatClient.getInstance().chatManager().loadAllConversations()
+        ChatClient.getInstance().groupManager().loadAllGroups()
+    }
+
+    private fun successForCallBack(agoraUid: Int,continuation: Continuation<EaseUser>) {
+        DemoHelper.getInstance().getDataModel().setCurrentUserAgoraUid(agoraUid)
+        // get current user id
+        val currentUser = ChatClient.getInstance().currentUser
+        val user = EaseUser(currentUser)
+        continuation.resume(user)
+
+        // ** manually load all local groups and conversation
+        loadAllConversationsAndGroups()
+    }
+
+
+    private fun loginFromAppServer(
+        userName: String,
+        token: String,
+        callBack: ChatValueCallback<LoginResult>
+    ) {
+        try {
+            val headers: MutableMap<String, String> = HashMap()
+            headers["Content-Type"] = "application/json"
+            val request = JSONObject()
+            request.putOpt("userAccount", userName)
+            request.putOpt("userPassword", token)
+            val url: String = LOGIN_URL
+            ChatLog.d("LoginToAppServer url : ", url)
+            val response = HttpClientManager.httpExecute(
+                url,
+                headers,
+                request.toString(),
+                HttpClientManager.Method_POST
+            )
+            val code = response.code
+            val responseInfo = response.content
+            if (code == 200) {
+                ChatLog.d("LoginToAppServer success : ", responseInfo)
+                val `object` = JSONObject(responseInfo)
+                val result = LoginResult()
+                if (`object`.has("accessToken")){
+                    result.accessToken = `object`.getString("accessToken")
+                }
+                if (`object`.has("token")){
+                    result.token = `object`.getString("token")
+                }
+                if (`object`.has("expireTimestamp")){
+                    result.expireTimestamp = `object`.getLong("expireTimestamp")
+                }
+                if (`object`.has("chatUserName")){
+                    result.chatUserName = `object`.getString("chatUserName")
+                }
+                if (`object`.has("agoraUid")){
+                    result.agoraUid = `object`.getInt("agoraUid")
+                }
+                if (`object`.has("avatarUrl")){
+                    result.avatarUrl = `object`.getString("avatarUrl")
+                }
+                result.code = code
+                callBack.onSuccess(result)
+            } else {
+                var errorInfo: String? = null
+                responseInfo?.let {
+                    try {
+                        val responseObject = JSONObject(responseInfo)
+                        Log.e("apex","login response $responseObject")
+//                        errorInfo = responseObject.getString("errorInfo")
+//                        if (errorInfo.contains("phone number illegal")) {
+//                            errorInfo = DemoApplication.getInstance().getString(R.string.em_login_phone_illegal)
+//                        } else if (errorInfo.contains("verification code error") || errorInfo.contains(
+//                                "send SMS to get mobile phone verification code"
+//                            )
+//                        ) {
+//                            errorInfo = DemoApplication.getInstance().getString(R.string.em_login_illegal_code)
+//                        }
+                    } catch (e: JSONException) {
+                        e.printStackTrace()
+                        errorInfo = responseInfo
+                    }
+                    callBack.onError(code, errorInfo)
+                }?:kotlin.run {
+                    callBack.onError(code, responseInfo)
+                }
+            }
+        } catch (e: Exception) {
+            callBack.onError(ChatError.NETWORK_ERROR, e.message)
+        }
+    }
+
+    /**
+     * Login to the server, you can choose password login or token login
+     * @param userName
+     * @param pwd
+     * @param isTokenFlag
+     * @return
+     */
+    suspend fun loginToServer(
+        userName: String,
+        pwd: String,
+        agoraUid:Int,
+        isTokenFlag: Boolean
+    ): EaseUser =
+        withContext(Dispatchers.IO) {
+            suspendCoroutine { continuation ->
+                if (ChatClient.getInstance().isLoggedIn.not()) {
+                    if (DeveloperModeHelper.isCustomSetEnable()) {
+                        DemoHelper.getInstance().getDataModel().getCustomAppKey().let {
+                            if (it.isNotEmpty()) {
+                                ChatClient.getInstance().changeAppkey(it)
+                            }else{
+                                ChatClient.getInstance().options.enableDNSConfig(true)
+                                ChatClient.getInstance().changeAppkey(BuildConfig.AGORA_CHAT_APPKEY)
+                            }
+                        }
+                    } else {
+                        ChatClient.getInstance().options.enableDNSConfig(true)
+                        ChatClient.getInstance().changeAppkey(BuildConfig.AGORA_CHAT_APPKEY)
+                    }
+                }
+                if (isTokenFlag) {
+                    EaseIM.login(EaseProfile(userName), pwd, onSuccess = {
+                        successForCallBack(agoraUid,continuation)
+                    }, onError = { code, error ->
+                        if(code == ChatError.USER_ALREADY_LOGIN){
+                            if (EaseIM.getCurrentUser()?.id == userName){
+                                successForCallBack(agoraUid,continuation)
+                            }else{
+                                EaseIM.logout(true)
+                                continuation.resumeWithException(ChatException(code, error))
+                            }
+                        }else{
+                            continuation.resumeWithException(ChatException(code, error))
+                        }
+                    })
+                } else {
+                    EaseIM.login(userName, pwd, onSuccess = {
+                        successForCallBack(agoraUid,continuation)
+                    }, onError = { code, error ->
+                        continuation.resumeWithException(ChatException(code, error))
+                    })
+                }
+            }
+        }
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/splash/viewModel/SplashViewModel.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/splash/viewModel/SplashViewModel.kt
new file mode 100644
index 00000000..25ed4443
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/page/splash/viewModel/SplashViewModel.kt
@@ -0,0 +1,15 @@
+package io.agora.chatdemo.page.splash.viewModel
+
+import android.app.Application
+import androidx.lifecycle.AndroidViewModel
+import io.agora.chatdemo.page.splash.repository.ChatClientRepository
+import kotlinx.coroutines.flow.flow
+
+class SplashViewModel(application: Application) : AndroidViewModel(application) {
+    private val mRepository: ChatClientRepository = ChatClientRepository()
+
+    fun loginData() = flow {
+        emit(mRepository.loadAllInfoFromAgora())
+    }
+
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/repository/ProfileInfoRepository.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/repository/ProfileInfoRepository.kt
new file mode 100644
index 00000000..147772e5
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/repository/ProfileInfoRepository.kt
@@ -0,0 +1,245 @@
+package io.agora.chatdemo.repository
+
+import io.agora.CallBack
+import io.agora.chat.UserInfo
+import io.agora.chatdemo.BuildConfig
+import io.agora.chatdemo.DemoHelper
+import io.agora.chatdemo.base.BaseRepository
+import io.agora.chatdemo.common.suspend.fetUserInfo
+import io.agora.chatdemo.common.suspend.updateOwnAttribute
+import io.agora.cloud.HttpCallback
+import io.agora.cloud.HttpClientManager
+import io.agora.uikit.EaseIM
+import io.agora.uikit.common.ChatClient
+import io.agora.uikit.common.ChatError
+import io.agora.uikit.common.ChatException
+import io.agora.uikit.common.ChatHttpClientManagerBuilder
+import io.agora.uikit.common.ChatLog
+import io.agora.uikit.common.ChatUserInfo
+import io.agora.uikit.common.ChatUserInfoType
+import io.agora.uikit.common.ChatValueCallback
+import io.agora.uikit.model.EaseProfile
+import kotlinx.coroutines.Dispatchers
+import kotlinx.coroutines.withContext
+import org.json.JSONException
+import org.json.JSONObject
+import kotlin.coroutines.resume
+import kotlin.coroutines.resumeWithException
+import kotlin.coroutines.suspendCoroutine
+
+class ProfileInfoRepository: BaseRepository()  {
+
+    companion object {
+        private const val UPLOAD_AVATAR_URL = BuildConfig.APP_SERVER_PROTOCOL + "://" + BuildConfig.APP_SERVER_DOMAIN +
+                BuildConfig.APP_BASE_USER
+        private const val GROUP_AVATAR_URL = BuildConfig.APP_SERVER_PROTOCOL + "://" + BuildConfig.APP_SERVER_DOMAIN +
+                BuildConfig.APP_BASE_GROUP
+    }
+
+    suspend fun getUserInfoAttribute(userIds: List<String>, attributes: List<ChatUserInfoType>): Map<String, ChatUserInfo> =
+        withContext(Dispatchers.IO) {
+            ChatClient.getInstance().userInfoManager().fetUserInfo(userIds,attributes)
+        }
+
+    suspend fun synchronizeProfile(isSyncFromServer:Boolean): EaseProfile? =
+        withContext(Dispatchers.IO) {
+            val currentProfile = EaseIM.getCurrentUser()?:EaseProfile(ChatClient.getInstance().currentUser)
+            val user = DemoHelper.getInstance().getDataModel().getUser(currentProfile.id)
+            ChatLog.e("ProfileInfoRepository","synchronizeProfile $user $isSyncFromServer - $currentProfile")
+            suspendCoroutine { continuation ->
+                if (user == null || isSyncFromServer){
+                    currentProfile.let { profile->
+                        val ids = mutableListOf(profile.id)
+                        val type = mutableListOf(ChatUserInfoType.NICKNAME,ChatUserInfoType.AVATAR_URL)
+                        ChatClient.getInstance().userInfoManager().fetchUserInfoByAttribute(ids.toTypedArray(),type.toTypedArray(),object :
+                            ChatValueCallback<MutableMap<String, UserInfo>> {
+                            override fun onSuccess(value: MutableMap<String, UserInfo>?) {
+                                ChatLog.e("ProfileInfoRepository","fetchUserInfoByAttribute onSuccess ${profile.id} - $value")
+                                value?.let { map->
+                                    if (value.containsKey(profile.id)){
+                                        map[profile.id]?.let {
+                                            profile.name = it.nickname
+                                            profile.avatar = it.avatarUrl
+                                            DemoHelper.getInstance().getDataModel().insertUser(profile)
+                                            EaseIM.updateUsersInfo(mutableListOf(profile))
+                                            continuation.resume(profile)
+                                        }
+                                    }
+                                }
+                            }
+
+                            override fun onError(error: Int, errorMsg: String?) {
+                                ChatLog.e("ProfileInfoRepository","fetchUserInfoByAttribute onError$error $errorMsg")
+                                continuation.resumeWithException(ChatException(error, errorMsg))
+                            }
+                        })
+                    }
+                }else{
+                    ChatLog.e("ProfileInfoRepository","fetchLocalUserInfo")
+                    currentProfile.let {
+                        it.name = user.name
+                        it.avatar = user.avatar
+                        EaseIM.updateUsersInfo(mutableListOf(it))
+                    }
+                    continuation.resume(currentProfile)
+                }
+            }
+        }
+
+    suspend fun setUserRemark(username:String,remark:String): Int =
+        withContext(Dispatchers.IO) {
+            suspendCoroutine { continuation ->
+                ChatClient.getInstance().contactManager().asyncSetContactRemark(username,remark,object :
+                    CallBack {
+                    override fun onSuccess() {
+                        continuation.resume(ChatError.EM_NO_ERROR)
+                    }
+
+                    override fun onError(code: Int, error: String?) {
+                        continuation.resumeWithException(ChatException(code, error))
+                    }
+                })
+            }
+        }
+
+    suspend fun getGroupAvatar(groupId:String?): String =
+        withContext(Dispatchers.IO) {
+            suspendCoroutine { continuation ->
+                getGroupAvatarFromServer(groupId,object : ChatValueCallback<String>{
+                    override fun onSuccess(value: String?) {
+                        value?.let {
+                            continuation.resume(it)
+                        }
+                    }
+
+                    override fun onError(code: Int, errorMsg: String?) {
+                        continuation.resumeWithException(ChatException(code, errorMsg))
+                    }
+                })
+            }
+        }
+
+    /**
+     * Update the nickname of the current user to chat server.
+     * @param nickname The new nickname.
+     */
+    suspend fun updateNickname(nickname: String) =
+        withContext(Dispatchers.IO) {
+            ChatClient.getInstance().userInfoManager().updateOwnAttribute(ChatUserInfoType.NICKNAME, nickname)
+        }
+
+    /**
+     * Upload avatar url to chat server.
+     * @param remoteUrl The remote url of the avatar
+     */
+    suspend fun uploadAvatarToChatServer(remoteUrl: String) =
+        withContext(Dispatchers.IO) {
+            ChatClient.getInstance().userInfoManager().updateOwnAttribute(ChatUserInfoType.AVATAR_URL, remoteUrl)
+        }
+
+    /**
+     * 上传头像
+     * @return
+     */
+    suspend fun uploadAvatar(filePath: String?): String =
+        withContext(Dispatchers.IO) {
+            suspendCoroutine { continuation ->
+                uploadAvatarToAppServer(filePath,object : ChatValueCallback<String>{
+                    override fun onSuccess(value: String?) {
+                        value?.let {
+                            continuation.resume(it)
+                        }
+                    }
+
+                    override fun onError(error: Int, errorMsg: String?) {
+                        continuation.resumeWithException(ChatException(error, errorMsg))
+                    }
+                })
+            }
+        }
+
+    private fun uploadAvatarToAppServer(
+        filePath: String?,
+        callBack: ChatValueCallback<String>
+    ){
+        try {
+            ChatLog.e("ProfileInfoRepository","uploadAvatarToAppServer $filePath")
+            if (filePath.isNullOrEmpty()){
+                callBack.onError(ChatError.INVALID_URL," invalid url.")
+                return
+            }
+            ChatLog.e("ProfileInfoRepository","uploadAvatarToAppServer ${UPLOAD_AVATAR_URL +"/${ChatClient.getInstance().currentUser}"+BuildConfig.APP_UPLOAD_AVATAR}")
+                ChatHttpClientManagerBuilder()
+                    .uploadFile(filePath)
+                    .setParam("file",filePath)
+                    .setUrl(UPLOAD_AVATAR_URL +"/${ChatClient.getInstance().currentUser}"+BuildConfig.APP_UPLOAD_AVATAR)
+                    .execute(object : HttpCallback {
+                        override fun onSuccess(result: String?) {
+                            result?.let {
+                                val url = try {
+                                val jsonObject = JSONObject(it)
+                                jsonObject.getString("avatarUrl")
+                            } catch (e: Exception) {
+                                e.printStackTrace()
+                                ""
+                            }
+                                callBack.onSuccess(url)
+                            } ?: callBack.onError(ChatError.NETWORK_ERROR,"result url is null.")
+                        }
+
+                        override fun onError(code: Int, msg: String?) {
+                            callBack.onError(code,msg)
+                        }
+
+                        override fun onProgress(total: Long, pos: Long) {
+
+                        }
+                    })
+        } catch (e: Exception) {
+            callBack.onError(ChatError.NETWORK_ERROR, e.message)
+        }
+    }
+
+    private fun getGroupAvatarFromServer(
+        groupId: String?,
+        callBack: ChatValueCallback<String>
+    ){
+        try {
+            if (groupId.isNullOrEmpty()){
+                callBack.onError(ChatError.GROUP_INVALID_ID, "The group ID is incorrect")
+                return
+            }
+            val headers: MutableMap<String, String> = HashMap()
+            headers["Content-Type"] = "application/json"
+            val url: String = GROUP_AVATAR_URL + "/$groupId" +BuildConfig.APP_GROUP_AVATAR
+            val response = HttpClientManager.httpExecute(
+                url,
+                headers, "",
+                HttpClientManager.Method_GET
+            )
+            val code = response.code
+            val responseInfo = response.content
+            if (code == 200) {
+                val `object` = JSONObject(responseInfo)
+                val avatarUrl = `object`.getString("avatarUrl")
+                callBack.onSuccess(avatarUrl)
+            } else {
+                if (responseInfo != null && responseInfo.isNotEmpty()) {
+                    var errorInfo: String? = null
+                    try {
+                        val responseObject = JSONObject(responseInfo)
+                        errorInfo = responseObject.getString("errorInfo")
+                    } catch (e: JSONException) {
+                        e.printStackTrace()
+                        errorInfo = responseInfo
+                    }
+                    callBack.onError(code, errorInfo)
+                } else {
+                    callBack.onError(code, responseInfo)
+                }
+            }
+        } catch (e: Exception) {
+            callBack.onError(ChatError.NETWORK_ERROR, e.message)
+        }
+    }
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/repository/PushRepository.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/repository/PushRepository.kt
new file mode 100644
index 00000000..95c1fbff
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/repository/PushRepository.kt
@@ -0,0 +1,30 @@
+package io.agora.chatdemo.repository
+
+import io.agora.chatdemo.base.BaseRepository
+import io.agora.chatdemo.common.suspend.getSilentModeForApp
+import io.agora.chatdemo.common.suspend.setSilentModeForApp
+import io.agora.uikit.common.ChatClient
+import io.agora.uikit.common.ChatSilentModeParam
+import kotlinx.coroutines.Dispatchers
+import kotlinx.coroutines.withContext
+
+class PushRepository: BaseRepository() {
+    private val pushManager = ChatClient.getInstance().pushManager()
+
+    /**
+     * Make app interruption-free
+     */
+    suspend fun setSilentModeForApp(silentModeParam: ChatSilentModeParam) =
+        withContext(Dispatchers.IO) {
+            pushManager.setSilentModeForApp(silentModeParam)
+        }
+
+    /**
+     * Get the silent mode for the App.
+     */
+    suspend fun getSilentModeForApp() =
+        withContext(Dispatchers.IO) {
+            pushManager.getSilentModeForApp()
+        }
+
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/uikit/UIKitManager.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/uikit/UIKitManager.kt
new file mode 100644
index 00000000..0536a17a
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/uikit/UIKitManager.kt
@@ -0,0 +1,148 @@
+package io.agora.chatdemo.uikit
+
+import android.content.Context
+import android.content.Intent
+import io.agora.chatdemo.DemoHelper
+import io.agora.chatdemo.callkit.CallKitManager
+import io.agora.chatdemo.common.extensions.internal.toProfile
+import io.agora.chatdemo.page.chat.ChatActivity
+import io.agora.chatdemo.page.contact.ChatContactCheckActivity
+import io.agora.chatdemo.page.contact.ChatContactDetailActivity
+import io.agora.chatdemo.page.contact.ChatNewRequestsActivity
+import io.agora.chatdemo.page.group.ChatCreateGroupActivity
+import io.agora.chatdemo.page.group.ChatGroupDetailActivity
+import io.agora.chatdemo.repository.ProfileInfoRepository
+import io.agora.uikit.EaseIM
+import io.agora.uikit.common.ChatClient
+import io.agora.uikit.common.ChatMessage
+import io.agora.uikit.common.ChatUserInfoType
+import io.agora.uikit.common.extensions.toProfile
+import io.agora.uikit.common.impl.OnValueSuccess
+import io.agora.uikit.feature.chat.activities.EaseChatActivity
+import io.agora.uikit.feature.contact.EaseContactCheckActivity
+import io.agora.uikit.feature.contact.EaseContactDetailsActivity
+import io.agora.uikit.feature.group.EaseCreateGroupActivity
+import io.agora.uikit.feature.group.EaseGroupDetailActivity
+import io.agora.uikit.feature.invitation.EaseNewRequestsActivity
+import io.agora.uikit.model.EaseGroupProfile
+import io.agora.uikit.model.EaseProfile
+import io.agora.uikit.provider.EaseCustomActivityRoute
+import io.agora.uikit.provider.EaseGroupProfileProvider
+import io.agora.uikit.provider.EaseSettingsProvider
+import io.agora.uikit.provider.EaseUserProfileProvider
+import io.agora.uikit.widget.EaseImageView
+import kotlinx.coroutines.CoroutineScope
+import kotlinx.coroutines.Dispatchers
+import kotlinx.coroutines.launch
+
+object UIKitManager {
+
+    fun addUIKitSettings(context: Context) {
+        addProviders(context)
+        setUIKitConfigs(context)
+    }
+
+    fun addProviders(context: Context) {
+        EaseIM.setUserProfileProvider(object : EaseUserProfileProvider {
+                override fun getUser(userId: String?): EaseProfile? {
+                    return DemoHelper.getInstance().getDataModel().getAllContacts()[userId]?.toProfile()
+                }
+
+                override fun fetchUsers(
+                    userIds: List<String>,
+                    onValueSuccess: OnValueSuccess<List<EaseProfile>>
+                ) {
+                    // fetch users from server and call call onValueSuccess.onSuccess(users) after successfully getting users
+                    CoroutineScope(Dispatchers.IO).launch {
+                        if (userIds.isEmpty()) {
+                            onValueSuccess(mutableListOf())
+                            return@launch
+                        }
+                        val users = ProfileInfoRepository().getUserInfoAttribute(userIds, mutableListOf(ChatUserInfoType.NICKNAME, ChatUserInfoType.AVATAR_URL))
+                        val callbackList = users.values.map { it.toProfile() }
+                        if (callbackList.isNotEmpty()) {
+                            DemoHelper.getInstance().getDataModel().insertUsers(callbackList)
+                            DemoHelper.getInstance().getDataModel().updateUsersTimes(callbackList)
+//                            EaseIM.updateUsersInfo(callbackList)
+                            callbackList.map {
+                                DemoHelper.getInstance().getDataModel().updateUserCache(it.id)
+                                CallKitManager.setEaseCallKitUserInfo(it.id)
+                            }
+                        }
+                        onValueSuccess(callbackList)
+                    }
+                }
+            })
+            .setGroupProfileProvider(object : EaseGroupProfileProvider {
+
+                override fun getGroup(id: String?): EaseGroupProfile? {
+                    ChatClient.getInstance().groupManager().getGroup(id)?.let {
+                        return EaseGroupProfile(it.groupId, it.groupName, it.extension)
+                    }
+                    return null
+                }
+
+                override fun fetchGroups(
+                    groupIds: List<String>,
+                    onValueSuccess: OnValueSuccess<List<EaseGroupProfile>>
+                ) {
+
+                }
+            })
+            .setSettingsProvider(object : EaseSettingsProvider {
+                override fun isMsgNotifyAllowed(message: ChatMessage?): Boolean {
+                    return true
+                }
+
+                override fun isMsgSoundAllowed(message: ChatMessage?): Boolean {
+                    return false
+                }
+
+                override fun isMsgVibrateAllowed(message: ChatMessage?): Boolean {
+                    return false
+                }
+
+                override val isSpeakerOpened: Boolean
+                    get() = true
+
+            })
+            .setCustomActivityRoute(object : EaseCustomActivityRoute {
+                override fun getActivityRoute(intent: Intent): Intent? {
+                    intent.component?.className?.let {
+                        when(it) {
+                            EaseChatActivity::class.java.name -> {
+                                intent.setClass(context, ChatActivity::class.java)
+                            }
+                            EaseGroupDetailActivity::class.java.name -> {
+                                intent.setClass(context, ChatGroupDetailActivity::class.java)
+                            }
+                            EaseContactDetailsActivity::class.java.name -> {
+                                intent.setClass(context, ChatContactDetailActivity::class.java)
+                            }
+                            EaseCreateGroupActivity::class.java.name -> {
+                                intent.setClass(context, ChatCreateGroupActivity::class.java)
+                            }
+                            EaseContactCheckActivity::class.java.name ->{
+                                intent.setClass(context, ChatContactCheckActivity::class.java)
+                            }
+                            EaseNewRequestsActivity::class.java.name -> {
+                                intent.setClass(context, ChatNewRequestsActivity::class.java)
+                            }
+                            else -> {
+                                return intent
+                            }
+                        }
+                    }
+                    return intent
+                }
+
+            })
+    }
+
+    fun setUIKitConfigs(context: Context) {
+        EaseIM.getConfig()?.avatarConfig?.let {
+            it.avatarShape = EaseImageView.ShapeType.ROUND
+            it.avatarRadius = context.resources.getDimensionPixelSize(io.agora.uikit.R.dimen.ease_corner_extra_small)
+        }
+    }
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/utils/CameraAndCropFileUtils.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/utils/CameraAndCropFileUtils.kt
new file mode 100644
index 00000000..bd0d9dd1
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/utils/CameraAndCropFileUtils.kt
@@ -0,0 +1,90 @@
+package io.agora.chatdemo.utils
+
+import android.annotation.SuppressLint
+import android.content.ContentValues
+import android.content.Context
+import android.database.Cursor
+import android.net.Uri
+import android.os.Build
+import android.os.Environment
+import android.os.Environment.DIRECTORY_PICTURES
+import android.provider.MediaStore
+import io.agora.uikit.common.ChatLog
+import io.agora.uikit.common.ChatPathUtils
+import java.io.File
+import java.text.SimpleDateFormat
+import java.util.Date
+
+
+object CameraAndCropFileUtils {
+
+    //用于获取与应用程序相关联的特定类型的文件目录，如果你不想将文件放在特定的子目录，可以传递 null 将文件放在根目录。
+    // 在存储在这些目录的文件，不需要申请WRITE_EXTERNAL_STORAGE权限。
+    private val rootSavePath = ChatPathUtils.getInstance().imagePath
+
+    // 用于获取用户可以看到的公共目录 比如 "Music", "Pictures"等 在这个路径下的文件即使在应用卸载后依然存在。
+    // 需要申请WRITE_EXTERNAL_STORAGE权限。
+    private val rootPublicFolderPath = Environment.getExternalStoragePublicDirectory(DIRECTORY_PICTURES).absolutePath
+
+    var uri: Uri? = null
+
+    @SuppressLint("SimpleDateFormat")
+    fun createImageFile(context: Context, isCrop: Boolean): File? {
+        return try {
+            val timeStamp: String = SimpleDateFormat("yyyyMMdd_HHmmss").format(Date())
+            var fileName = ""
+            fileName = if (isCrop) {
+                "IMG_" + timeStamp + "_CROP.jpg"
+            } else {
+                "IMG_$timeStamp.jpg"
+            }
+            val imgFile: File
+            if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.R) {
+                //如果 version >= 11 需要将图片文件创建到公共目录 比如 "Music", "Pictures"等
+                ChatLog.e("CameraAndCropFileUtils","createImageFile version >= 11 需要将图片文件创建到公共目录 ${Environment.getExternalStoragePublicDirectory(DIRECTORY_PICTURES).toString() + File.separator + fileName}")
+                imgFile = File(rootPublicFolderPath+ File.separator + fileName)
+                // 通过 MediaStore API 插入file 为了拿到系统裁剪要保存到的uri（因为App没有权限不能访问公共存储空间，需要通过 MediaStore API来操作）
+                val values = ContentValues()
+                values.put(MediaStore.Images.Media.DATA, imgFile.absolutePath)
+                values.put(MediaStore.Images.Media.DISPLAY_NAME, fileName)
+                values.put(MediaStore.Images.Media.MIME_TYPE, "image/jpeg")
+                uri = context.contentResolver.insert(MediaStore.Images.Media.EXTERNAL_CONTENT_URI, values)
+                ChatLog.e("CameraAndCropFileUtils","createImageFile version >= 11 创建成功 Uri: $uri")
+            } else {
+                imgFile = File(rootSavePath ,File.separator + fileName)
+                ChatLog.e("CameraAndCropFileUtils","createImageFile version < 11 ${imgFile.absolutePath}")
+            }
+            imgFile
+        } catch (e: Exception) {
+            e.printStackTrace()
+            null
+        }
+    }
+
+    fun getCropFile(context: Context, uri: Uri?): File? {
+        val proj = arrayOf(MediaStore.Images.Media.DATA)
+        val cursor = context.contentResolver.query(uri!!, proj, null, null, null)
+        if (cursor!!.moveToFirst()) {
+            val columnIndex = cursor.getColumnIndexOrThrow(MediaStore.Images.Media.DATA)
+            val path = cursor.getString(columnIndex)
+            cursor.close()
+            return File(path)
+        }
+        return null
+    }
+
+    fun getAbsolutePathFromUri(context: Context, uri: Uri): String? {
+        var absolutePath: String? = null
+        val projection = arrayOf(MediaStore.MediaColumns.DATA)
+        val cursor: Cursor? = context.contentResolver.query(uri, projection, null, null, null)
+        cursor?.let {
+            if (it.moveToFirst()) {
+                val columnIndex = cursor.getColumnIndexOrThrow(MediaStore.MediaColumns.DATA)
+                absolutePath = cursor.getString(columnIndex)
+            }
+            cursor.close()
+        }
+        return absolutePath
+    }
+
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/utils/LanguageUtil.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/utils/LanguageUtil.kt
new file mode 100644
index 00000000..844a2c05
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/utils/LanguageUtil.kt
@@ -0,0 +1,12 @@
+package io.agora.chatdemo.utils
+
+import androidx.appcompat.app.AppCompatDelegate
+import androidx.core.os.LocaleListCompat
+
+object LanguageUtil {
+    fun changeLanguage(languageCode:String){
+        val appLocale: LocaleListCompat = LocaleListCompat.forLanguageTags(languageCode)
+        // Call this on the main thread as it may require Activity.restart()
+        AppCompatDelegate.setApplicationLocales(appLocale)
+    }
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/utils/ToastUtils.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/utils/ToastUtils.kt
new file mode 100644
index 00000000..7479a517
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/utils/ToastUtils.kt
@@ -0,0 +1,401 @@
+package io.agora.chatdemo.utils
+
+import android.annotation.SuppressLint
+import android.content.Context
+import android.os.Build
+import android.os.Handler
+import android.os.Looper
+import android.os.Message
+import android.text.TextUtils
+import android.view.Gravity
+import android.view.LayoutInflater
+import android.view.View
+import android.view.WindowManager
+import android.widget.ImageView
+import android.widget.TextView
+import android.widget.Toast
+import androidx.annotation.StringRes
+import io.agora.chatdemo.DemoApplication
+import io.agora.chatdemo.R
+import io.agora.uikit.EaseIM
+import io.agora.uikit.common.extensions.dpToPx
+import io.agora.uikit.common.extensions.mainScope
+import kotlinx.coroutines.launch
+
+/**
+ * Toast工具类，统一Toast样式，处理重复显示的问题，处理7.1.x版本crash的问题
+ */
+object ToastUtils {
+    private const val DEFAULT = 0
+    private const val SUCCESS = 1
+    private const val FAIL = 2
+    private const val TOAST_LAST_TIME = 1000
+    private var toast: Toast? = null
+    private const val DISMISS = 2
+    private val handler: Handler = object : Handler(Looper.getMainLooper()) {
+        override fun handleMessage(msg: Message) {
+            super.handleMessage(msg)
+            when (msg.what) {
+                DISMISS -> synchronized(ToastUtils::class.java) {
+                    if (toast != null) {
+                        toast?.cancel()
+                        toast = null
+                    }
+                }
+            }
+        }
+    }
+
+    /**
+     * 弹出成功的toast
+     * @param message
+     */
+    fun showSuccessToast(message: String?) {
+        showCenterToast(null, message, SUCCESS, TOAST_LAST_TIME)
+    }
+
+    /**
+     * 弹出成功的toast
+     * @param message
+     */
+    fun showSuccessToast(@StringRes message: Int) {
+        showCenterToast(0, message, SUCCESS, TOAST_LAST_TIME)
+    }
+
+    /**
+     * 弹出失败的toast
+     * @param message
+     */
+    fun showFailToast(message: String?) {
+        showCenterToast(null, message, FAIL, TOAST_LAST_TIME)
+    }
+
+    /**
+     * 弹出失败的toast
+     * @param message
+     */
+    fun showFailToast(@StringRes message: Int) {
+        showCenterToast(0, message, FAIL, TOAST_LAST_TIME)
+    }
+
+    /**
+     * 弹出默认的toast
+     * @param message
+     */
+    fun showToast(message: String?) {
+        if (TextUtils.isEmpty(message)) {
+            return
+        }
+        showBottomToast(null, message, DEFAULT, TOAST_LAST_TIME)
+    }
+
+    /**
+     * 弹出默认的toast
+     * @param message
+     */
+    fun showToast(@StringRes message: Int) {
+        showBottomToast(0, message, DEFAULT, TOAST_LAST_TIME)
+    }
+
+    /**
+     * 弹出成功的toast，有标题
+     * @param title
+     * @param message
+     */
+    fun showSuccessToast(title: String?, message: String?) {
+        if (TextUtils.isEmpty(message)) {
+            return
+        }
+        showCenterToast(title, message, SUCCESS, TOAST_LAST_TIME)
+    }
+
+    /**
+     * 弹出成功的toast，有标题
+     * @param title
+     * @param message
+     */
+    fun showSuccessToast(@StringRes title: Int, @StringRes message: Int) {
+        showCenterToast(title, message, SUCCESS, TOAST_LAST_TIME)
+    }
+
+    /**
+     * 弹出失败的toast，有标题
+     * @param title
+     * @param message
+     */
+    fun showFailToast(title: String?, message: String?) {
+        if (TextUtils.isEmpty(message)) {
+            return
+        }
+        showCenterToast(title, message, FAIL, TOAST_LAST_TIME)
+    }
+
+    /**
+     * 弹出失败的toast，有标题
+     * @param title
+     * @param message
+     */
+    fun showFailToast(@StringRes title: Int, @StringRes message: Int) {
+        showCenterToast(title, message, FAIL, TOAST_LAST_TIME)
+    }
+
+    /**
+     * 弹出成功的toast，有标题，可以设置显示时长
+     * @param title
+     * @param message
+     * @param duration
+     */
+    fun showSuccessToast(title: String?, message: String?, duration: Int) {
+        if (TextUtils.isEmpty(message)) {
+            return
+        }
+        showCenterToast(title, message, SUCCESS, duration)
+    }
+
+    /**
+     * 弹出成功的toast，有标题，可以设置显示时长
+     * @param title
+     * @param message
+     * @param duration
+     */
+    fun showSuccessToast(@StringRes title: Int, @StringRes message: Int, duration: Int) {
+        showCenterToast(title, message, SUCCESS, duration)
+    }
+
+    /**
+     * 弹出失败的toast，有标题，可以设置显示时长
+     * @param title
+     * @param message
+     * @param duration
+     */
+    fun showFailToast(title: String?, message: String?, duration: Int) {
+        if (TextUtils.isEmpty(message)) {
+            return
+        }
+        showCenterToast(title, message, FAIL, duration)
+    }
+
+    /**
+     * 弹出失败的toast，有标题，可以设置显示时长
+     * @param title
+     * @param message
+     * @param duration
+     */
+    fun showFailToast(@StringRes title: Int, @StringRes message: Int, duration: Int) {
+        showCenterToast(title, message, FAIL, duration)
+    }
+
+    /**
+     * 弹出toast，无图标，无标题，可以设置显示时长
+     * @param message
+     * @param duration
+     */
+    fun showToast(message: String?, duration: Int) {
+        if (TextUtils.isEmpty(message)) {
+            return
+        }
+        showCenterToast(null, message, DEFAULT, duration)
+    }
+
+    /**
+     * 弹出toast，无图标，无标题，可以设置显示时长
+     * @param message
+     * @param duration
+     */
+    fun showToast(@StringRes message: Int, duration: Int) {
+        showCenterToast(0, message, DEFAULT, duration)
+    }
+
+    /**
+     * 在屏幕中部显示，在此处传入application
+     * @param title
+     * @param message
+     * @param type
+     * @param duration
+     */
+    fun showCenterToast(title: String?, message: String?, type: Int, duration: Int) {
+        if (TextUtils.isEmpty(message)) {
+            return
+        }
+        showToast(EaseIM.getContext(), title, message, type, duration, Gravity.CENTER)
+    }
+
+    /**
+     * 在屏幕中部显示，在此处传入application
+     * @param title
+     * @param message
+     * @param type
+     * @param duration
+     */
+    fun showCenterToast(@StringRes title: Int, @StringRes message: Int, type: Int, duration: Int) {
+        showToast(DemoApplication.getInstance(), title, message, type, duration, Gravity.CENTER)
+    }
+
+    /**
+     * 在屏幕底部显示，在此处传入application
+     * @param title
+     * @param message
+     * @param type
+     * @param duration
+     */
+    fun showBottomToast(title: String?, message: String?, type: Int, duration: Int) {
+        if (TextUtils.isEmpty(message)) {
+            return
+        }
+        showToast(DemoApplication.getInstance(), title, message, type, duration, Gravity.BOTTOM)
+    }
+
+    /**
+     * 在屏幕底部显示，在此处传入application
+     * @param title
+     * @param message
+     * @param type
+     * @param duration
+     */
+    fun showBottomToast(@StringRes title: Int, @StringRes message: Int, type: Int, duration: Int) {
+        showToast(DemoApplication.getInstance(), title, message, type, duration, Gravity.BOTTOM)
+    }
+
+    /**
+     * 此处判断toast不为空，选择cancel，是因为toast因为类型不同（是否显示图片）或者是否有标题，会导致不同的toast展示
+     * @param context
+     * @param title
+     * @param message
+     * @param type
+     * @param duration
+     * @param gravity
+     */
+    fun showToast(
+        context: Context?,
+        @StringRes title: Int,
+        @StringRes message: Int,
+        type: Int,
+        duration: Int,
+        gravity: Int
+    ) {
+        showToast(
+            context,
+            if (title == 0) null else context?.getString(title),
+            context?.getString(message),
+            type,
+            duration,
+            gravity
+        )
+    }
+
+    /**
+     * 此处判断toast不为空，选择cancel，是因为toast因为类型不同（是否显示图片）或者是否有标题，会导致不同的toast展示
+     * @param context
+     * @param title
+     * @param message
+     * @param type
+     * @param duration
+     * @param gravity
+     */
+    fun showToast(
+        context: Context?,
+        title: String?,
+        message: String?,
+        type: Int,
+        duration: Int,
+        gravity: Int
+    ) {
+        if (TextUtils.isEmpty(message)) {
+            return
+        }
+        //保证在主线程中展示toast
+        context?.mainScope()?.launch {
+            synchronized(ToastUtils::class.java) {
+                if (toast != null) {
+                    toast?.cancel()
+                }
+                toast = getToast(context, title, message, type, duration, gravity)
+                toast?.show()
+                handler.removeCallbacksAndMessages(null)
+                handler.sendEmptyMessageDelayed(DISMISS, 2000)
+            }
+        }
+    }
+
+    private fun getToast(
+        context: Context?,
+        title: String?,
+        message: String?,
+        type: Int,
+        duration: Int,
+        gravity: Int
+    ): Toast {
+        val toast = Toast(context)
+        val toastView: View = LayoutInflater.from(context).inflate(R.layout.demo_toast_layout, null)
+        toast.setView(toastView)
+        val ivToast = toastView.findViewById<ImageView>(R.id.iv_toast)
+        val tvToastTitle = toastView.findViewById<TextView>(R.id.tv_toast_title)
+        val tvToastContent = toastView.findViewById<TextView>(R.id.tv_toast_content)
+        if (TextUtils.isEmpty(title)) {
+            tvToastTitle.visibility = View.GONE
+        } else {
+            tvToastTitle.visibility = View.VISIBLE
+            tvToastTitle.text = title
+        }
+        if (!TextUtils.isEmpty(message)) {
+            tvToastContent.text = message
+        }
+        ivToast.visibility = View.VISIBLE
+        if (type == SUCCESS) {
+            ivToast.setImageResource(R.drawable.em_toast_success)
+        } else if (type == FAIL) {
+            ivToast.setImageResource(R.drawable.em_toast_fail)
+        } else {
+            ivToast.visibility = View.GONE
+        }
+        var yOffset = 0
+        if (gravity == Gravity.BOTTOM || gravity == Gravity.TOP) {
+            yOffset = 50.dpToPx(context!!)
+        }
+        toast.duration = duration
+        toast.setGravity(gravity, 0, yOffset)
+        hookToast(toast)
+        return toast
+    }
+
+    /**
+     * 为了解决7.1.x版本toast可以导致crash的问题
+     * @param toast
+     */
+    @SuppressLint("SoonBlockedPrivateApi")
+    private fun hookToast(toast: Toast) {
+        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.P) {
+            return
+        }
+        val cToast: Class<Toast> = Toast::class.java
+        try {
+            //TN是private的
+            val fTn = cToast.getDeclaredField("mTN")
+            fTn.isAccessible = true
+
+            //获取tn对象
+            val oTn = fTn[toast]
+            //获取TN的class，也可以直接通过Field.getType()获取。
+            val cTn: Class<*> = oTn.javaClass
+            val fHandle = cTn.getDeclaredField("mHandler")
+
+            //重新set->mHandler
+            fHandle.isAccessible = true
+            fHandle[oTn] = HandlerProxy(fHandle[oTn] as Handler)
+        } catch (e: NoSuchFieldException) {
+            e.printStackTrace()
+        } catch (e: IllegalAccessException) {
+            e.printStackTrace()
+        }
+    }
+
+    private class HandlerProxy(private val mHandler: Handler) : Handler() {
+        override fun handleMessage(msg: Message) {
+            try {
+                mHandler.handleMessage(msg)
+            } catch (e: WindowManager.BadTokenException) {
+                //ignore
+            }
+        }
+    }
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/viewmodel/MainViewModel.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/viewmodel/MainViewModel.kt
new file mode 100644
index 00000000..cf57d592
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/viewmodel/MainViewModel.kt
@@ -0,0 +1,59 @@
+package io.agora.chatdemo.viewmodel
+
+import androidx.lifecycle.viewModelScope
+import io.agora.chatdemo.interfaces.IMainRequest
+import io.agora.chatdemo.interfaces.IMainResultView
+import io.agora.chatdemo.page.splash.repository.ChatClientRepository
+import io.agora.uikit.viewmodel.EaseBaseViewModel
+import kotlinx.coroutines.CoroutineScope
+import kotlinx.coroutines.Dispatchers
+import kotlinx.coroutines.flow.collectLatest
+import kotlinx.coroutines.flow.flow
+import kotlinx.coroutines.flow.flowOn
+import kotlinx.coroutines.flow.map
+import kotlinx.coroutines.launch
+
+class MainViewModel: EaseBaseViewModel<IMainResultView>(), IMainRequest {
+    private val chatRepository by lazy { ChatClientRepository() }
+    override fun getUnreadMessageCount() {
+        viewModelScope.launch {
+            flow {
+                emit(chatRepository.getAllUnreadMessageCount())
+            }
+            .map {
+                if (it <= 0) {
+                    null
+                } else if (it > 99) {
+                    "99+"
+                } else {
+                    it.toString()
+                }
+            }
+            .flowOn(Dispatchers.Main)
+            .collectLatest {
+                view?.getUnreadCountSuccess(it)
+            }
+        }
+    }
+
+    override fun getRequestUnreadCount() {
+        viewModelScope.launch {
+            flow {
+                emit(chatRepository.getRequestUnreadCount())
+            }
+                .map {
+                    if (it <= 0) {
+                        null
+                    } else if (it > 99) {
+                        "99+"
+                    } else {
+                        it.toString()
+                    }
+                }
+                .flowOn(Dispatchers.Main)
+                .collectLatest {
+                    view?.getRequestUnreadCountSuccess(it)
+                }
+        }
+    }
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/viewmodel/ProfileInfoViewModel.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/viewmodel/ProfileInfoViewModel.kt
new file mode 100644
index 00000000..90d64b81
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/viewmodel/ProfileInfoViewModel.kt
@@ -0,0 +1,65 @@
+package io.agora.chatdemo.viewmodel
+
+import android.app.Application
+import androidx.lifecycle.AndroidViewModel
+import io.agora.chatdemo.DemoHelper
+import io.agora.chatdemo.repository.ProfileInfoRepository
+import io.agora.uikit.EaseIM
+import io.agora.uikit.common.ChatClient
+import io.agora.uikit.common.ChatUserInfoType
+import kotlinx.coroutines.ExperimentalCoroutinesApi
+import kotlinx.coroutines.flow.flatMapConcat
+import kotlinx.coroutines.flow.flow
+
+class ProfileInfoViewModel(application: Application) : AndroidViewModel(application)  {
+    private val mRepository: ProfileInfoRepository = ProfileInfoRepository()
+    @OptIn(ExperimentalCoroutinesApi::class)
+    fun uploadAvatar(filePath: String?) =
+        flow {
+            emit(mRepository.uploadAvatar(filePath))
+        }.flatMapConcat { result ->
+            EaseIM.getCurrentUser()?.let {
+                it.avatar = result
+                DemoHelper.getInstance().getDataModel().insertUser(it)
+                EaseIM.updateCurrentUser(it)
+            }
+            flow {
+                emit(mRepository.uploadAvatarToChatServer(result))
+            }
+        }
+
+    /**
+     * Update user nickname.
+     */
+    fun updateUserNickName(nickName:String) =
+        flow {
+            emit(mRepository.updateNickname(nickName))
+        }
+
+    fun setUserRemark(username:String,remark:String) = flow {
+        emit(mRepository.setUserRemark(username,remark))
+    }
+
+    fun fetchLocalUserRemark(userId:String):String?{
+        val contact = ChatClient.getInstance().contactManager().fetchContactFromLocal(userId)
+        return contact?.remark
+    }
+
+    fun synchronizeProfile(isSyncFromServer:Boolean = false) =
+        flow {
+            emit(mRepository.synchronizeProfile(isSyncFromServer))
+        }
+
+    fun getGroupAvatar(groupId:String?) = flow {
+        emit(mRepository.getGroupAvatar(groupId))
+    }
+
+    /**
+     * Fetch the user info attribute.
+     */
+    fun fetchUserInfoAttribute(userIds: List<String>, attributes: List<ChatUserInfoType>) =
+        flow {
+            emit(mRepository.getUserInfoAttribute(userIds, attributes))
+        }
+
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/kotlin/io/agora/chatdemo/viewmodel/PushViewModel.kt b/app-kotlin/src/main/kotlin/io/agora/chatdemo/viewmodel/PushViewModel.kt
new file mode 100644
index 00000000..ce696f8f
--- /dev/null
+++ b/app-kotlin/src/main/kotlin/io/agora/chatdemo/viewmodel/PushViewModel.kt
@@ -0,0 +1,27 @@
+package io.agora.chatdemo.viewmodel
+
+import androidx.lifecycle.ViewModel
+import io.agora.chatdemo.repository.PushRepository
+import io.agora.uikit.common.ChatPushRemindType
+import io.agora.uikit.common.ChatSilentModeParam
+import io.agora.uikit.common.ChatSilentModelType
+import kotlinx.coroutines.flow.flow
+
+class PushViewModel: ViewModel() {
+    private val mRepository = PushRepository()
+
+    fun setSilentModeForApp() =
+            flow {
+                emit(mRepository.setSilentModeForApp(ChatSilentModeParam(ChatSilentModelType.REMIND_TYPE).setRemindType(ChatPushRemindType.NONE)))
+            }
+
+    fun clearSilentModeForApp() =
+            flow {
+                emit(mRepository.setSilentModeForApp(ChatSilentModeParam(ChatSilentModelType.REMIND_TYPE).setRemindType(ChatPushRemindType.ALL)))
+            }
+
+    fun getSilentModeForApp() =
+            flow {
+                emit(mRepository.getSilentModeForApp())
+            }
+}
\ No newline at end of file
diff --git a/app-kotlin/src/main/res/anim/slide_in_from_left.xml b/app-kotlin/src/main/res/anim/slide_in_from_left.xml
new file mode 100644
index 00000000..47f2995b
--- /dev/null
+++ b/app-kotlin/src/main/res/anim/slide_in_from_left.xml
@@ -0,0 +1,14 @@
+<?xml version="1.0" encoding="utf-8"?>
+<set xmlns:android="http://schemas.android.com/apk/res/android" >
+
+    <translate
+        android:duration="200"
+        android:fromXDelta="-100%p"
+        android:toXDelta="0" />
+
+    <alpha
+        android:fromAlpha="0.5"
+        android:toAlpha="1.0"
+        android:duration="200"/>
+
+</set>
\ No newline at end of file
diff --git a/app-kotlin/src/main/res/anim/slide_in_from_right.xml b/app-kotlin/src/main/res/anim/slide_in_from_right.xml
new file mode 100644
index 00000000..aec7fa61
--- /dev/null
+++ b/app-kotlin/src/main/res/anim/slide_in_from_right.xml
@@ -0,0 +1,14 @@
+<?xml version="1.0" encoding="utf-8"?>
+<set xmlns:android="http://schemas.android.com/apk/res/android" >
+
+    <translate
+        android:duration="200"
+        android:fromXDelta="100%p"
+        android:toXDelta="0" />
+
+    <alpha
+        android:fromAlpha="0.5"
+        android:toAlpha="1.0"
+        android:duration="200"/>
+
+</set>
\ No newline at end of file
diff --git a/app-kotlin/src/main/res/anim/slide_out_to_left.xml b/app-kotlin/src/main/res/anim/slide_out_to_left.xml
new file mode 100644
index 00000000..4338463c
--- /dev/null
+++ b/app-kotlin/src/main/res/anim/slide_out_to_left.xml
@@ -0,0 +1,14 @@
+<?xml version="1.0" encoding="utf-8"?>
+<set xmlns:android="http://schemas.android.com/apk/res/android" >
+
+    <translate
+        android:duration="200"
+        android:fromXDelta="0"
+        android:toXDelta="-100%p" />
+
+    <alpha
+        android:fromAlpha="1.0"
+        android:toAlpha="0.5"
+        android:duration="200"/>
+
+</set>
\ No newline at end of file
diff --git a/app-kotlin/src/main/res/anim/slide_out_to_right.xml b/app-kotlin/src/main/res/anim/slide_out_to_right.xml
new file mode 100644
index 00000000..36af2c7e
--- /dev/null
+++ b/app-kotlin/src/main/res/anim/slide_out_to_right.xml
@@ -0,0 +1,14 @@
+<?xml version="1.0" encoding="utf-8"?>
+<set xmlns:android="http://schemas.android.com/apk/res/android" >
+
+    <translate
+        android:duration="200"
+        android:fromXDelta="0"
+        android:toXDelta="100%p" />
+
+    <alpha
+        android:fromAlpha="1.0"
+        android:toAlpha="0.5"
+        android:duration="200"/>
+
+</set>
\ No newline at end of file
diff --git a/app-kotlin/src/main/res/color/demo_dialog_btn_text_color_selector.xml b/app-kotlin/src/main/res/color/demo_dialog_btn_text_color_selector.xml
new file mode 100644
index 00000000..7bc87620
--- /dev/null
+++ b/app-kotlin/src/main/res/color/demo_dialog_btn_text_color_selector.xml
@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?>
+<selector xmlns:tools="http://schemas.android.com/tools" xmlns:android="http://schemas.android.com/apk/res/android" tools:ignore="MissingDefaultResource">
+    <item android:state_checked="true" android:state_pressed="true" android:color="#ffe9e9e9"/>
+    <item android:state_pressed="false" android:color="#ff333333"/>
+</selector>
\ No newline at end of file
diff --git a/app-kotlin/src/main/res/color/demo_main_tab_text_selector.xml b/app-kotlin/src/main/res/color/demo_main_tab_text_selector.xml
new file mode 100644
index 00000000..52936082
--- /dev/null
+++ b/app-kotlin/src/main/res/color/demo_main_tab_text_selector.xml
@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?>
+<selector xmlns:android="http://schemas.android.com/apk/res/android">
+    <item android:color="@color/em_main_color_tab_selected" android:state_selected="true"/>
+    <item android:color="@color/em_main_color_tab_normal"/>
+</selector>
\ No newline at end of file
diff --git a/app-kotlin/src/main/res/drawable-hdpi/contact_title.png b/app-kotlin/src/main/res/drawable-hdpi/contact_title.png
new file mode 100644
index 00000000..e8b6db09
Binary files /dev/null and b/app-kotlin/src/main/res/drawable-hdpi/contact_title.png differ
diff --git a/app-kotlin/src/main/res/drawable-hdpi/conversation_title.png b/app-kotlin/src/main/res/drawable-hdpi/conversation_title.png
new file mode 100644
index 00000000..7711b90c
Binary files /dev/null and b/app-kotlin/src/main/res/drawable-hdpi/conversation_title.png differ
diff --git a/app-kotlin/src/main/res/drawable-v24/ic_launcher_foreground.xml b/app-kotlin/src/main/res/drawable-v24/ic_launcher_foreground.xml
new file mode 100644
index 00000000..2b068d11
--- /dev/null
+++ b/app-kotlin/src/main/res/drawable-v24/ic_launcher_foreground.xml
@@ -0,0 +1,30 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:aapt="http://schemas.android.com/aapt"
+    android:width="108dp"
+    android:height="108dp"
+    android:viewportWidth="108"
+    android:viewportHeight="108">
+    <path android:pathData="M31,63.928c0,0 6.4,-11 12.1,-13.1c7.2,-2.6 26,-1.4 26,-1.4l38.1,38.1L107,108.928l-32,-1L31,63.928z">
+        <aapt:attr name="android:fillColor">
+            <gradient
+                android:endX="85.84757"
+                android:endY="92.4963"
+                android:startX="42.9492"
+                android:startY="49.59793"
+                android:type="linear">
+                <item
+                    android:color="#44000000"
+                    android:offset="0.0" />
+                <item
+                    android:color="#00000000"
+                    android:offset="1.0" />
+            </gradient>
+        </aapt:attr>
+    </path>
+    <path
+        android:fillColor="#FFFFFF"
+        android:fillType="nonZero"
+        android:pathData="M65.3,45.828l3.8,-6.6c0.2,-0.4 0.1,-0.9 -0.3,-1.1c-0.4,-0.2 -0.9,-0.1 -1.1,0.3l-3.9,6.7c-6.3,-2.8 -13.4,-2.8 -19.7,0l-3.9,-6.7c-0.2,-0.4 -0.7,-0.5 -1.1,-0.3C38.8,38.328 38.7,38.828 38.9,39.228l3.8,6.6C36.2,49.428 31.7,56.028 31,63.928h46C76.3,56.028 71.8,49.428 65.3,45.828zM43.4,57.328c-0.8,0 -1.5,-0.5 -1.8,-1.2c-0.3,-0.7 -0.1,-1.5 0.4,-2.1c0.5,-0.5 1.4,-0.7 2.1,-0.4c0.7,0.3 1.2,1 1.2,1.8C45.3,56.528 44.5,57.328 43.4,57.328L43.4,57.328zM64.6,57.328c-0.8,0 -1.5,-0.5 -1.8,-1.2s-0.1,-1.5 0.4,-2.1c0.5,-0.5 1.4,-0.7 2.1,-0.4c0.7,0.3 1.2,1 1.2,1.8C66.5,56.528 65.6,57.328 64.6,57.328L64.6,57.328z"
+        android:strokeWidth="1"
+        android:strokeColor="#00000000" />
+</vector>
\ No newline at end of file
diff --git a/app-kotlin/src/main/res/drawable-xhdpi/contact_title.png b/app-kotlin/src/main/res/drawable-xhdpi/contact_title.png
new file mode 100644
index 00000000..908357f5
Binary files /dev/null and b/app-kotlin/src/main/res/drawable-xhdpi/contact_title.png differ
diff --git a/app-kotlin/src/main/res/drawable-xhdpi/conversation_title.png b/app-kotlin/src/main/res/drawable-xhdpi/conversation_title.png
new file mode 100644
index 00000000..133a6428
Binary files /dev/null and b/app-kotlin/src/main/res/drawable-xhdpi/conversation_title.png differ
diff --git a/app-kotlin/src/main/res/drawable-xhdpi/d_chat_voice_call.png b/app-kotlin/src/main/res/drawable-xhdpi/d_chat_voice_call.png
new file mode 100644
index 00000000..6e2a0456
Binary files /dev/null and b/app-kotlin/src/main/res/drawable-xhdpi/d_chat_voice_call.png differ
diff --git a/app-kotlin/src/main/res/drawable-xhdpi/em_toast_fail.png b/app-kotlin/src/main/res/drawable-xhdpi/em_toast_fail.png
new file mode 100644
index 00000000..a279e430
Binary files /dev/null and b/app-kotlin/src/main/res/drawable-xhdpi/em_toast_fail.png differ
diff --git a/app-kotlin/src/main/res/drawable-xhdpi/em_toast_success.png b/app-kotlin/src/main/res/drawable-xhdpi/em_toast_success.png
new file mode 100644
index 00000000..55c3b603
Binary files /dev/null and b/app-kotlin/src/main/res/drawable-xhdpi/em_toast_success.png differ
diff --git a/app-kotlin/src/main/res/drawable-xhdpi/splash_bg_dark.webp b/app-kotlin/src/main/res/drawable-xhdpi/splash_bg_dark.webp
new file mode 100644
index 00000000..85e7d052
Binary files /dev/null and b/app-kotlin/src/main/res/drawable-xhdpi/splash_bg_dark.webp differ
diff --git a/app-kotlin/src/main/res/drawable-xhdpi/splash_bg_light.webp b/app-kotlin/src/main/res/drawable-xhdpi/splash_bg_light.webp
new file mode 100644
index 00000000..cf90512d
Binary files /dev/null and b/app-kotlin/src/main/res/drawable-xhdpi/splash_bg_light.webp differ
diff --git a/app-kotlin/src/main/res/drawable-xxhdpi/contact_title.png b/app-kotlin/src/main/res/drawable-xxhdpi/contact_title.png
new file mode 100644
index 00000000..419b275a
Binary files /dev/null and b/app-kotlin/src/main/res/drawable-xxhdpi/contact_title.png differ
diff --git a/app-kotlin/src/main/res/drawable-xxhdpi/conversation_title.png b/app-kotlin/src/main/res/drawable-xxhdpi/conversation_title.png
new file mode 100644
index 00000000..d2dd1ee2
Binary files /dev/null and b/app-kotlin/src/main/res/drawable-xxhdpi/conversation_title.png differ
diff --git a/app-kotlin/src/main/res/drawable-xxhdpi/d_chat_voice_call.png b/app-kotlin/src/main/res/drawable-xxhdpi/d_chat_voice_call.png
new file mode 100644
index 00000000..218d73ea
Binary files /dev/null and b/app-kotlin/src/main/res/drawable-xxhdpi/d_chat_voice_call.png differ
diff --git a/app-kotlin/src/main/res/drawable-xxhdpi/demo_check_checked.png b/app-kotlin/src/main/res/drawable-xxhdpi/demo_check_checked.png
new file mode 100644
index 00000000..691f9bff
Binary files /dev/null and b/app-kotlin/src/main/res/drawable-xxhdpi/demo_check_checked.png differ
diff --git a/app-kotlin/src/main/res/drawable-xxhdpi/demo_check_uncheck.png b/app-kotlin/src/main/res/drawable-xxhdpi/demo_check_uncheck.png
new file mode 100644
index 00000000..605539a1
Binary files /dev/null and b/app-kotlin/src/main/res/drawable-xxhdpi/demo_check_uncheck.png differ
diff --git a/app-kotlin/src/main/res/drawable-xxhdpi/ease_presence_away.png b/app-kotlin/src/main/res/drawable-xxhdpi/ease_presence_away.png
new file mode 100644
index 00000000..0960b948
Binary files /dev/null and b/app-kotlin/src/main/res/drawable-xxhdpi/ease_presence_away.png differ
diff --git a/app-kotlin/src/main/res/drawable-xxhdpi/ease_presence_busy.png b/app-kotlin/src/main/res/drawable-xxhdpi/ease_presence_busy.png
new file mode 100644
index 00000000..3d6378a9
Binary files /dev/null and b/app-kotlin/src/main/res/drawable-xxhdpi/ease_presence_busy.png differ
diff --git a/app-kotlin/src/main/res/drawable-xxhdpi/ease_presence_custom.png b/app-kotlin/src/main/res/drawable-xxhdpi/ease_presence_custom.png
new file mode 100644
index 00000000..7dd1b018
Binary files /dev/null and b/app-kotlin/src/main/res/drawable-xxhdpi/ease_presence_custom.png differ
diff --git a/app-kotlin/src/main/res/drawable-xxhdpi/ease_presence_do_not_disturb.png b/app-kotlin/src/main/res/drawable-xxhdpi/ease_presence_do_not_disturb.png
new file mode 100644
index 00000000..ca275b51
Binary files /dev/null and b/app-kotlin/src/main/res/drawable-xxhdpi/ease_presence_do_not_disturb.png differ
diff --git a/app-kotlin/src/main/res/drawable-xxhdpi/ease_presence_offline.png b/app-kotlin/src/main/res/drawable-xxhdpi/ease_presence_offline.png
new file mode 100644
index 00000000..98b24fbb
Binary files /dev/null and b/app-kotlin/src/main/res/drawable-xxhdpi/ease_presence_offline.png differ
diff --git a/app-kotlin/src/main/res/drawable-xxhdpi/ease_presence_online.png b/app-kotlin/src/main/res/drawable-xxhdpi/ease_presence_online.png
new file mode 100644
index 00000000..3c32d7f3
Binary files /dev/null and b/app-kotlin/src/main/res/drawable-xxhdpi/ease_presence_online.png differ
diff --git a/app-kotlin/src/main/res/drawable-xxhdpi/icon_about.png b/app-kotlin/src/main/res/drawable-xxhdpi/icon_about.png
new file mode 100644
index 00000000..67dd1ac4
Binary files /dev/null and b/app-kotlin/src/main/res/drawable-xxhdpi/icon_about.png differ
diff --git a/app-kotlin/src/main/res/drawable-xxhdpi/icon_currency.png b/app-kotlin/src/main/res/drawable-xxhdpi/icon_currency.png
new file mode 100644
index 00000000..40c47d5c
Binary files /dev/null and b/app-kotlin/src/main/res/drawable-xxhdpi/icon_currency.png differ
diff --git a/app-kotlin/src/main/res/drawable-xxhdpi/icon_information.png b/app-kotlin/src/main/res/drawable-xxhdpi/icon_information.png
new file mode 100644
index 00000000..610c9479
Binary files /dev/null and b/app-kotlin/src/main/res/drawable-xxhdpi/icon_information.png differ
diff --git a/app-kotlin/src/main/res/drawable-xxhdpi/icon_login_attention_line.png b/app-kotlin/src/main/res/drawable-xxhdpi/icon_login_attention_line.png
new file mode 100644
index 00000000..f9efb892
Binary files /dev/null and b/app-kotlin/src/main/res/drawable-xxhdpi/icon_login_attention_line.png differ
diff --git a/app-kotlin/src/main/res/drawable-xxhdpi/icon_logo.png b/app-kotlin/src/main/res/drawable-xxhdpi/icon_logo.png
new file mode 100644
index 00000000..b6442db9
Binary files /dev/null and b/app-kotlin/src/main/res/drawable-xxhdpi/icon_logo.png differ
diff --git a/app-kotlin/src/main/res/drawable-xxhdpi/icon_next.png b/app-kotlin/src/main/res/drawable-xxhdpi/icon_next.png
new file mode 100644
index 00000000..fe78ddbd
Binary files /dev/null and b/app-kotlin/src/main/res/drawable-xxhdpi/icon_next.png differ
diff --git a/app-kotlin/src/main/res/drawable-xxhdpi/icon_presence.png b/app-kotlin/src/main/res/drawable-xxhdpi/icon_presence.png
new file mode 100644
index 00000000..75b6aefb
Binary files /dev/null and b/app-kotlin/src/main/res/drawable-xxhdpi/icon_presence.png differ
diff --git a/app-kotlin/src/main/res/drawable-xxhdpi/icon_privacy.png b/app-kotlin/src/main/res/drawable-xxhdpi/icon_privacy.png
new file mode 100644
index 00000000..d85443a7
Binary files /dev/null and b/app-kotlin/src/main/res/drawable-xxhdpi/icon_privacy.png differ
diff --git a/app-kotlin/src/main/res/drawable-xxhdpi/main_tab_conversation.png b/app-kotlin/src/main/res/drawable-xxhdpi/main_tab_conversation.png
new file mode 100644
index 00000000..b96927bd
Binary files /dev/null and b/app-kotlin/src/main/res/drawable-xxhdpi/main_tab_conversation.png differ
diff --git a/app-kotlin/src/main/res/drawable-xxhdpi/main_tab_conversation_selected.png b/app-kotlin/src/main/res/drawable-xxhdpi/main_tab_conversation_selected.png
new file mode 100644
index 00000000..15b44320
Binary files /dev/null and b/app-kotlin/src/main/res/drawable-xxhdpi/main_tab_conversation_selected.png differ
diff --git a/app-kotlin/src/main/res/drawable-xxhdpi/main_tab_friends.png b/app-kotlin/src/main/res/drawable-xxhdpi/main_tab_friends.png
new file mode 100644
index 00000000..a8e6010e
Binary files /dev/null and b/app-kotlin/src/main/res/drawable-xxhdpi/main_tab_friends.png differ
diff --git a/app-kotlin/src/main/res/drawable-xxhdpi/main_tab_friends_selected.png b/app-kotlin/src/main/res/drawable-xxhdpi/main_tab_friends_selected.png
new file mode 100644
index 00000000..67501f84
Binary files /dev/null and b/app-kotlin/src/main/res/drawable-xxhdpi/main_tab_friends_selected.png differ
diff --git a/app-kotlin/src/main/res/drawable-xxhdpi/main_tab_me.png b/app-kotlin/src/main/res/drawable-xxhdpi/main_tab_me.png
new file mode 100644
index 00000000..c23ef445
Binary files /dev/null and b/app-kotlin/src/main/res/drawable-xxhdpi/main_tab_me.png differ
diff --git a/app-kotlin/src/main/res/drawable-xxhdpi/main_tab_me_selected.png b/app-kotlin/src/main/res/drawable-xxhdpi/main_tab_me_selected.png
new file mode 100644
index 00000000..626de01b
Binary files /dev/null and b/app-kotlin/src/main/res/drawable-xxhdpi/main_tab_me_selected.png differ
diff --git a/app-kotlin/src/main/res/drawable-xxhdpi/phone_pick.png b/app-kotlin/src/main/res/drawable-xxhdpi/phone_pick.png
new file mode 100644
index 00000000..662ccbeb
Binary files /dev/null and b/app-kotlin/src/main/res/drawable-xxhdpi/phone_pick.png differ
diff --git a/app-kotlin/src/main/res/drawable-xxhdpi/sign_clear_icon.png b/app-kotlin/src/main/res/drawable-xxhdpi/sign_clear_icon.png
new file mode 100644
index 00000000..6aa8faf6
Binary files /dev/null and b/app-kotlin/src/main/res/drawable-xxhdpi/sign_clear_icon.png differ
diff --git a/app-kotlin/src/main/res/drawable-xxhdpi/sign_eye.png b/app-kotlin/src/main/res/drawable-xxhdpi/sign_eye.png
new file mode 100644
index 00000000..a9cfedac
Binary files /dev/null and b/app-kotlin/src/main/res/drawable-xxhdpi/sign_eye.png differ
diff --git a/app-kotlin/src/main/res/drawable-xxhdpi/sign_eye_slash.png b/app-kotlin/src/main/res/drawable-xxhdpi/sign_eye_slash.png
new file mode 100644
index 00000000..36e3ba00
Binary files /dev/null and b/app-kotlin/src/main/res/drawable-xxhdpi/sign_eye_slash.png differ
diff --git a/app-kotlin/src/main/res/drawable-xxhdpi/video_call.png b/app-kotlin/src/main/res/drawable-xxhdpi/video_call.png
new file mode 100644
index 00000000..1fc406d3
Binary files /dev/null and b/app-kotlin/src/main/res/drawable-xxhdpi/video_call.png differ
diff --git a/app-kotlin/src/main/res/drawable-xxhdpi/video_camera.png b/app-kotlin/src/main/res/drawable-xxhdpi/video_camera.png
new file mode 100644
index 00000000..f66946e3
Binary files /dev/null and b/app-kotlin/src/main/res/drawable-xxhdpi/video_camera.png differ
diff --git a/app-kotlin/src/main/res/drawable-xxxhdpi/contact_title.png b/app-kotlin/src/main/res/drawable-xxxhdpi/contact_title.png
new file mode 100644
index 00000000..fb5282d7
Binary files /dev/null and b/app-kotlin/src/main/res/drawable-xxxhdpi/contact_title.png differ
diff --git a/app-kotlin/src/main/res/drawable-xxxhdpi/conversation_title.png b/app-kotlin/src/main/res/drawable-xxxhdpi/conversation_title.png
new file mode 100644
index 00000000..2573a4d7
Binary files /dev/null and b/app-kotlin/src/main/res/drawable-xxxhdpi/conversation_title.png differ
diff --git a/app-kotlin/src/main/res/drawable-xxxhdpi/icon_notify.png b/app-kotlin/src/main/res/drawable-xxxhdpi/icon_notify.png
new file mode 100644
index 00000000..3cfe552e
Binary files /dev/null and b/app-kotlin/src/main/res/drawable-xxxhdpi/icon_notify.png differ
diff --git a/app-kotlin/src/main/res/drawable/demo_cb_agreement_select.xml b/app-kotlin/src/main/res/drawable/demo_cb_agreement_select.xml
new file mode 100644
index 00000000..28ba3afd
--- /dev/null
+++ b/app-kotlin/src/main/res/drawable/demo_cb_agreement_select.xml
@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?>
+<selector xmlns:android="http://schemas.android.com/apk/res/android">
+    <item android:state_checked="true" android:drawable="@drawable/demo_check_checked"/>
+    <item android:state_checked="false" android:drawable="@drawable/demo_check_uncheck"/>
+</selector>
\ No newline at end of file
diff --git a/app-kotlin/src/main/res/drawable/demo_dialog_btn_left_selector.xml b/app-kotlin/src/main/res/drawable/demo_dialog_btn_left_selector.xml
new file mode 100644
index 00000000..c7a1f1cf
--- /dev/null
+++ b/app-kotlin/src/main/res/drawable/demo_dialog_btn_left_selector.xml
@@ -0,0 +1,34 @@
+<?xml version="1.0" encoding="utf-8"?>
+<selector xmlns:android="http://schemas.android.com/apk/res/android">
+    <item android:state_pressed="true" android:state_checked="true">
+        <layer-list>
+            <item>
+                <shape android:shape="rectangle">
+                    <solid android:color="@color/gray"/>
+                    <stroke android:color="@color/gray"/>
+                </shape>
+                <item android:top="1dp" android:right="1dp">
+                    <shape android:shape="rectangle">
+                        <solid android:color="@color/gray"/>
+                    </shape>
+                </item>
+            </item>
+        </layer-list>
+    </item>
+    <item>
+        <layer-list>
+            <item>
+                <shape android:shape="rectangle">
+                    <solid android:color="@color/white"/>
+                    <stroke android:color="@color/gray" android:width="1dp"/>
+                </shape>
+            </item>
+            <item android:top="1dp" android:right="1dp">
+                <shape android:shape="rectangle">
+                    <solid android:color="@color/white"/>
+                </shape>
+            </item>
+        </layer-list>
+    </item>
+
+</selector>
\ No newline at end of file
diff --git a/app-kotlin/src/main/res/drawable/demo_dialog_btn_right_selector.xml b/app-kotlin/src/main/res/drawable/demo_dialog_btn_right_selector.xml
new file mode 100644
index 00000000..1dc11b96
--- /dev/null
+++ b/app-kotlin/src/main/res/drawable/demo_dialog_btn_right_selector.xml
@@ -0,0 +1,34 @@
+<?xml version="1.0" encoding="utf-8"?>
+<selector xmlns:android="http://schemas.android.com/apk/res/android">
+    <item android:state_pressed="true" android:state_checked="true">
+        <layer-list>
+            <item>
+                <shape android:shape="rectangle">
+                    <solid android:color="@color/gray"/>
+                    <stroke android:color="@color/white"/>
+                </shape>
+                <item android:top="1dp" android:left="0.5dp">
+                    <shape android:shape="rectangle">
+                        <solid android:color="@color/gray"/>
+                    </shape>
+                </item>
+            </item>
+        </layer-list>
+    </item>
+    <item>
+        <layer-list>
+            <item>
+                <shape android:shape="rectangle">
+                    <solid android:color="@color/white"/>
+                    <stroke android:color="@color/gray" android:width="1dp"/>
+                </shape>
+            </item>
+            <item android:top="1dp" android:left="0.5dp">
+                <shape android:shape="rectangle">
+                    <solid android:color="@color/white"/>
+                </shape>
+            </item>
+        </layer-list>
+    </item>
+
+</selector>
\ No newline at end of file
diff --git a/app-kotlin/src/main/res/drawable/demo_dialog_btn_selector.xml b/app-kotlin/src/main/res/drawable/demo_dialog_btn_selector.xml
new file mode 100644
index 00000000..152cf187
--- /dev/null
+++ b/app-kotlin/src/main/res/drawable/demo_dialog_btn_selector.xml
@@ -0,0 +1,34 @@
+<?xml version="1.0" encoding="utf-8"?>
+<selector xmlns:android="http://schemas.android.com/apk/res/android">
+    <item android:state_pressed="true" android:state_checked="true">
+        <layer-list>
+            <item>
+                <shape android:shape="rectangle">
+                    <solid android:color="@color/gray"/>
+                    <stroke android:color="@color/gray"/>
+                </shape>
+                <item android:top="1dp">
+                    <shape android:shape="rectangle">
+                        <solid android:color="@color/gray"/>
+                    </shape>
+                </item>
+            </item>
+        </layer-list>
+    </item>
+    <item>
+        <layer-list>
+            <item>
+                <shape android:shape="rectangle">
+                    <solid android:color="@color/white"/>
+                    <stroke android:color="@color/gray" android:width="1dp"/>
+                </shape>
+            </item>
+            <item android:top="1dp">
+                <shape android:shape="rectangle">
+                    <solid android:color="@color/white"/>
+                </shape>
+            </item>
+        </layer-list>
+    </item>
+
+</selector>
\ No newline at end of file
diff --git a/app-kotlin/src/main/res/drawable/demo_login_btn_bg.xml b/app-kotlin/src/main/res/drawable/demo_login_btn_bg.xml
new file mode 100644
index 00000000..e9b3195c
--- /dev/null
+++ b/app-kotlin/src/main/res/drawable/demo_login_btn_bg.xml
@@ -0,0 +1,23 @@
+<?xml version="1.0" encoding="utf-8"?>
+<selector xmlns:android="http://schemas.android.com/apk/res/android">
+    <item android:state_enabled="true">
+        <shape android:shape="rectangle">
+            <gradient
+                android:startColor="@color/demo_login_button_bg_start"
+                android:endColor="@color/demo_login_button_bg_end"
+                android:angle="270"/>
+            <corners android:radius="@dimen/demo_login_input_bg_radius"/>
+        </shape>
+    </item>
+
+    <item>
+        <shape android:shape="rectangle">
+            <gradient
+                android:startColor="@color/demo_login_button_bg_start"
+                android:endColor="@color/demo_login_button_bg_end"
+                android:angle="270"/>
+            <corners android:radius="@dimen/demo_login_input_bg_radius"/>
+        </shape>
+    </item>
+
+</selector>
\ No newline at end of file
diff --git a/app-kotlin/src/main/res/drawable/demo_login_et_bg.xml b/app-kotlin/src/main/res/drawable/demo_login_et_bg.xml
new file mode 100644
index 00000000..89d5fad8
--- /dev/null
+++ b/app-kotlin/src/main/res/drawable/demo_login_et_bg.xml
@@ -0,0 +1,8 @@
+<?xml version="1.0" encoding="utf-8"?>
+<shape xmlns:android="http://schemas.android.com/apk/res/android">
+
+    <solid android:color="@color/ease_color_background"/>
+    <corners android:radius="@dimen/demo_login_input_bg_radius"/>
+    <stroke android:color="@color/ease_color_background"/>
+
+</shape>
\ No newline at end of file
diff --git a/app-kotlin/src/main/res/drawable/demo_login_version_bg.xml b/app-kotlin/src/main/res/drawable/demo_login_version_bg.xml
new file mode 100644
index 00000000..6cff22fe
--- /dev/null
+++ b/app-kotlin/src/main/res/drawable/demo_login_version_bg.xml
@@ -0,0 +1,10 @@
+<?xml version="1.0" encoding="utf-8"?>
+<shape xmlns:android="http://schemas.android.com/apk/res/android">
+    <solid android:color="@color/ease_color_on_background_high"/>
+    <corners android:topLeftRadius="@dimen/ease_corner_extra_small"
+        android:topRightRadius="@dimen/ease_corner_extra_small"
+        android:bottomLeftRadius="@dimen/ease_corner_extra_small"
+        android:bottomRightRadius="@dimen/ease_corner_extra_small"/>
+    <padding android:bottom="@dimen/ease_size_2" android:left="@dimen/ease_size_6"
+        android:right="@dimen/ease_size_6" android:top="@dimen/ease_size_2"/>
+</shape>
\ No newline at end of file
diff --git a/app-kotlin/src/main/res/drawable/demo_main_tab_conversation_selector.xml b/app-kotlin/src/main/res/drawable/demo_main_tab_conversation_selector.xml
new file mode 100644
index 00000000..1a9bc92a
--- /dev/null
+++ b/app-kotlin/src/main/res/drawable/demo_main_tab_conversation_selector.xml
@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?>
+<selector xmlns:android="http://schemas.android.com/apk/res/android">
+    <item android:drawable="@drawable/main_tab_conversation_selected" android:state_selected="true"/>
+    <item android:drawable="@drawable/main_tab_conversation"/>
+</selector>
\ No newline at end of file
diff --git a/app-kotlin/src/main/res/drawable/demo_main_tab_friends_selector.xml b/app-kotlin/src/main/res/drawable/demo_main_tab_friends_selector.xml
new file mode 100644
index 00000000..3caf339c
--- /dev/null
+++ b/app-kotlin/src/main/res/drawable/demo_main_tab_friends_selector.xml
@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?>
+<selector xmlns:android="http://schemas.android.com/apk/res/android">
+    <item android:drawable="@drawable/main_tab_friends_selected" android:state_selected="true"/>
+    <item android:drawable="@drawable/main_tab_friends"/>
+</selector>
\ No newline at end of file
diff --git a/app-kotlin/src/main/res/drawable/demo_main_tab_me_selector.xml b/app-kotlin/src/main/res/drawable/demo_main_tab_me_selector.xml
new file mode 100644
index 00000000..ee128fc9
--- /dev/null
+++ b/app-kotlin/src/main/res/drawable/demo_main_tab_me_selector.xml
@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?>
+<selector xmlns:android="http://schemas.android.com/apk/res/android">
+    <item android:drawable="@drawable/main_tab_me_selected" android:state_selected="true"/>
+    <item android:drawable="@drawable/main_tab_me"/>
+</selector>
\ No newline at end of file
diff --git a/app-kotlin/src/main/res/drawable/demo_main_unread_count_bg.xml b/app-kotlin/src/main/res/drawable/demo_main_unread_count_bg.xml
new file mode 100644
index 00000000..a32015bd
--- /dev/null
+++ b/app-kotlin/src/main/res/drawable/demo_main_unread_count_bg.xml
@@ -0,0 +1,7 @@
+<?xml version="1.0" encoding="utf-8"?>
+<shape xmlns:android="http://schemas.android.com/apk/res/android">
+    <solid android:color="@color/ease_color_error"/>
+    <corners android:radius="@dimen/ease_size_9"/>
+    <size android:height="@dimen/ease_size_20" android:width="@dimen/ease_size_20"/>
+    <stroke android:color="@color/white" android:width="@dimen/ease_size_1"/>
+</shape>
\ No newline at end of file
diff --git a/app-kotlin/src/main/res/drawable/demo_switch_thumb_selector.xml b/app-kotlin/src/main/res/drawable/demo_switch_thumb_selector.xml
new file mode 100644
index 00000000..dd6bc3c5
--- /dev/null
+++ b/app-kotlin/src/main/res/drawable/demo_switch_thumb_selector.xml
@@ -0,0 +1,19 @@
+<?xml version="1.0" encoding="utf-8"?>
+<selector xmlns:android="http://schemas.android.com/apk/res/android">
+    <item android:state_checked="true">
+        <shape android:shape="oval">
+            <size android:width="@dimen/ease_size_30" android:height="@dimen/ease_size_30"/>
+            <solid android:color="@color/white"/>
+            <stroke android:width="@dimen/ease_size_1" android:color="#0a000000"/>
+        </shape>
+    </item>
+
+    <item>
+        <shape android:shape="oval">
+            <size android:width="@dimen/ease_size_30" android:height="@dimen/ease_size_30"/>
+            <solid android:color="@color/white"/>
+            <stroke android:width="@dimen/ease_size_1" android:color="#0a000000"/>
+        </shape>
+    </item>
+
+</selector>
\ No newline at end of file
diff --git a/app-kotlin/src/main/res/drawable/demo_switch_track_selector.xml b/app-kotlin/src/main/res/drawable/demo_switch_track_selector.xml
new file mode 100644
index 00000000..d6cdf775
--- /dev/null
+++ b/app-kotlin/src/main/res/drawable/demo_switch_track_selector.xml
@@ -0,0 +1,20 @@
+<?xml version="1.0" encoding="utf-8"?>
+<selector xmlns:android="http://schemas.android.com/apk/res/android">
+
+    <item android:state_checked="true">
+        <shape android:shape="rectangle">
+            <size android:width="@dimen/ease_size_50" android:height="@dimen/ease_size_30"/>
+            <solid android:color="@color/ease_color_primary"/>
+            <corners android:radius="@dimen/ease_size_15"/>
+        </shape>
+    </item>
+
+    <item>
+        <shape android:shape="rectangle">
+            <size android:width="@dimen/ease_size_50" android:height="@dimen/ease_size_30"/>
+            <solid android:color="@color/ease_color_background_higher"/>
+            <corners android:radius="@dimen/ease_size_15"/>
+        </shape>
+    </item>
+
+</selector>
\ No newline at end of file
diff --git a/app-kotlin/src/main/res/drawable/demo_toast_bg.xml b/app-kotlin/src/main/res/drawable/demo_toast_bg.xml
new file mode 100644
index 00000000..e89bb9d7
--- /dev/null
+++ b/app-kotlin/src/main/res/drawable/demo_toast_bg.xml
@@ -0,0 +1,7 @@
+<?xml version="1.0" encoding="utf-8"?>
+<shape xmlns:android="http://schemas.android.com/apk/res/android">
+
+    <solid android:color="@color/em_toast_color_bg"/>
+    <corners android:radius="8dp"/>
+
+</shape>
\ No newline at end of file
diff --git a/app-kotlin/src/main/res/drawable/ic_launcher_background.xml b/app-kotlin/src/main/res/drawable/ic_launcher_background.xml
new file mode 100644
index 00000000..07d5da9c
--- /dev/null
+++ b/app-kotlin/src/main/res/drawable/ic_launcher_background.xml
@@ -0,0 +1,170 @@
+<?xml version="1.0" encoding="utf-8"?>
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="108dp"
+    android:height="108dp"
+    android:viewportWidth="108"
+    android:viewportHeight="108">
+    <path
+        android:fillColor="#3DDC84"
+        android:pathData="M0,0h108v108h-108z" />
+    <path
+        android:fillColor="#00000000"
+        android:pathData="M9,0L9,108"
+        android:strokeWidth="0.8"
+        android:strokeColor="#33FFFFFF" />
+    <path
+        android:fillColor="#00000000"
+        android:pathData="M19,0L19,108"
+        android:strokeWidth="0.8"
+        android:strokeColor="#33FFFFFF" />
+    <path
+        android:fillColor="#00000000"
+        android:pathData="M29,0L29,108"
+        android:strokeWidth="0.8"
+        android:strokeColor="#33FFFFFF" />
+    <path
+        android:fillColor="#00000000"
+        android:pathData="M39,0L39,108"
+        android:strokeWidth="0.8"
+        android:strokeColor="#33FFFFFF" />
+    <path
+        android:fillColor="#00000000"
+        android:pathData="M49,0L49,108"
+        android:strokeWidth="0.8"
+        android:strokeColor="#33FFFFFF" />
+    <path
+        android:fillColor="#00000000"
+        android:pathData="M59,0L59,108"
+        android:strokeWidth="0.8"
+        android:strokeColor="#33FFFFFF" />
+    <path
+        android:fillColor="#00000000"
+        android:pathData="M69,0L69,108"
+        android:strokeWidth="0.8"
+        android:strokeColor="#33FFFFFF" />
+    <path
+        android:fillColor="#00000000"
+        android:pathData="M79,0L79,108"
+        android:strokeWidth="0.8"
+        android:strokeColor="#33FFFFFF" />
+    <path
+        android:fillColor="#00000000"
+        android:pathData="M89,0L89,108"
+        android:strokeWidth="0.8"
+        android:strokeColor="#33FFFFFF" />
+    <path
+        android:fillColor="#00000000"
+        android:pathData="M99,0L99,108"
+        android:strokeWidth="0.8"
+        android:strokeColor="#33FFFFFF" />
+    <path
+        android:fillColor="#00000000"
+        android:pathData="M0,9L108,9"
+        android:strokeWidth="0.8"
+        android:strokeColor="#33FFFFFF" />
+    <path
+        android:fillColor="#00000000"
+        android:pathData="M0,19L108,19"
+        android:strokeWidth="0.8"
+        android:strokeColor="#33FFFFFF" />
+    <path
+        android:fillColor="#00000000"
+        android:pathData="M0,29L108,29"
+        android:strokeWidth="0.8"
+        android:strokeColor="#33FFFFFF" />
+    <path
+        android:fillColor="#00000000"
+        android:pathData="M0,39L108,39"
+        android:strokeWidth="0.8"
+        android:strokeColor="#33FFFFFF" />
+    <path
+        android:fillColor="#00000000"
+        android:pathData="M0,49L108,49"
+        android:strokeWidth="0.8"
+        android:strokeColor="#33FFFFFF" />
+    <path
+        android:fillColor="#00000000"
+        android:pathData="M0,59L108,59"
+        android:strokeWidth="0.8"
+        android:strokeColor="#33FFFFFF" />
+    <path
+        android:fillColor="#00000000"
+        android:pathData="M0,69L108,69"
+        android:strokeWidth="0.8"
+        android:strokeColor="#33FFFFFF" />
+    <path
+        android:fillColor="#00000000"
+        android:pathData="M0,79L108,79"
+        android:strokeWidth="0.8"
+        android:strokeColor="#33FFFFFF" />
+    <path
+        android:fillColor="#00000000"
+        android:pathData="M0,89L108,89"
+        android:strokeWidth="0.8"
+        android:strokeColor="#33FFFFFF" />
+    <path
+        android:fillColor="#00000000"
+        android:pathData="M0,99L108,99"
+        android:strokeWidth="0.8"
+        android:strokeColor="#33FFFFFF" />
+    <path
+        android:fillColor="#00000000"
+        android:pathData="M19,29L89,29"
+        android:strokeWidth="0.8"
+        android:strokeColor="#33FFFFFF" />
+    <path
+        android:fillColor="#00000000"
+        android:pathData="M19,39L89,39"
+        android:strokeWidth="0.8"
+        android:strokeColor="#33FFFFFF" />
+    <path
+        android:fillColor="#00000000"
+        android:pathData="M19,49L89,49"
+        android:strokeWidth="0.8"
+        android:strokeColor="#33FFFFFF" />
+    <path
+        android:fillColor="#00000000"
+        android:pathData="M19,59L89,59"
+        android:strokeWidth="0.8"
+        android:strokeColor="#33FFFFFF" />
+    <path
+        android:fillColor="#00000000"
+        android:pathData="M19,69L89,69"
+        android:strokeWidth="0.8"
+        android:strokeColor="#33FFFFFF" />
+    <path
+        android:fillColor="#00000000"
+        android:pathData="M19,79L89,79"
+        android:strokeWidth="0.8"
+        android:strokeColor="#33FFFFFF" />
+    <path
+        android:fillColor="#00000000"
+        android:pathData="M29,19L29,89"
+        android:strokeWidth="0.8"
+        android:strokeColor="#33FFFFFF" />
+    <path
+        android:fillColor="#00000000"
+        android:pathData="M39,19L39,89"
+        android:strokeWidth="0.8"
+        android:strokeColor="#33FFFFFF" />
+    <path
+        android:fillColor="#00000000"
+        android:pathData="M49,19L49,89"
+        android:strokeWidth="0.8"
+        android:strokeColor="#33FFFFFF" />
+    <path
+        android:fillColor="#00000000"
+        android:pathData="M59,19L59,89"
+        android:strokeWidth="0.8"
+        android:strokeColor="#33FFFFFF" />
+    <path
+        android:fillColor="#00000000"
+        android:pathData="M69,19L69,89"
+        android:strokeWidth="0.8"
+        android:strokeColor="#33FFFFFF" />
+    <path
+        android:fillColor="#00000000"
+        android:pathData="M79,19L79,89"
+        android:strokeWidth="0.8"
+        android:strokeColor="#33FFFFFF" />
+</vector>
diff --git a/app-kotlin/src/main/res/layout/activity_main_layout.xml b/app-kotlin/src/main/res/layout/activity_main_layout.xml
new file mode 100644
index 00000000..a816f70d
--- /dev/null
+++ b/app-kotlin/src/main/res/layout/activity_main_layout.xml
@@ -0,0 +1,36 @@
+<?xml version="1.0" encoding="utf-8"?>
+<androidx.constraintlayout.widget.ConstraintLayout 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=".MainActivity">
+
+    <FrameLayout
+        android:id="@+id/fl_main_fragment"
+        android:layout_width="0dp"
+        android:layout_height="0dp"
+        app:layout_constraintBottom_toTopOf="@id/nav_view"
+        app:layout_constraintLeft_toLeftOf="parent"
+        app:layout_constraintRight_toRightOf="parent"
+        app:layout_constraintTop_toTopOf="parent" />
+
+    <com.google.android.material.bottomnavigation.BottomNavigationView
+        android:id="@+id/nav_view"
+        android:layout_width="0dp"
+        android:layout_height="wrap_content"
+        android:layout_marginStart="0dp"
+        android:layout_marginEnd="0dp"
+        app:itemBackground="@android:color/transparent"
+        android:background="@color/ease_color_background"
+        app:labelVisibilityMode="labeled"
+        app:layout_constraintBottom_toBottomOf="parent"
+        app:layout_constraintLeft_toLeftOf="parent"
+        app:layout_constraintRight_toRightOf="parent"
+        app:menu="@menu/bottom_main_nav_menu"
+        app:itemTextColor="@color/demo_main_tab_text_selector"
+        app:itemTextAppearanceActive="@style/main_bottom_view_selected"
+        app:itemTextAppearanceInactive="@style/main_bottom_view_normal"/>
+
+</androidx.constraintlayout.widget.ConstraintLayout>
\ No newline at end of file
diff --git a/app-kotlin/src/main/res/layout/demo_activity_about.xml b/app-kotlin/src/main/res/layout/demo_activity_about.xml
new file mode 100644
index 00000000..97e62f5d
--- /dev/null
+++ b/app-kotlin/src/main/res/layout/demo_activity_about.xml
@@ -0,0 +1,119 @@
+<?xml version="1.0" encoding="utf-8"?>
+<androidx.constraintlayout.widget.ConstraintLayout
+    xmlns:app="http://schemas.android.com/apk/res-auto"
+    xmlns:android="http://schemas.android.com/apk/res/android"
+    android:background="@color/demo_background"
+    android:layout_width="match_parent"
+    android:layout_height="match_parent">
+
+    <io.agora.uikit.widget.EaseTitleBar
+        android:id="@+id/title_bar"
+        app:layout_constraintTop_toTopOf="parent"
+        app:layout_constraintStart_toStartOf="parent"
+        android:layout_width="match_parent"
+        android:layout_height="@dimen/ease_toolbar_height"
+        app:titleBarTitle="@string/main_about_me_about"
+        app:titleBarMenuTitleColor="@color/ease_color_on_background_low"
+        app:titleBarTitleTextColor="@color/ease_color_on_background_low"
+        app:titleBarMenuIconTint="@color/ease_color_on_background_low"
+        app:titleBarSubtitleTextColor="@color/ease_color_text_secondary"
+        android:visibility="visible" />
+
+    <io.agora.uikit.widget.EaseImageView
+        android:id="@+id/iv_logo"
+        android:layout_marginTop="20dp"
+        android:src="@mipmap/demo_launcher"
+        app:ease_shape_type="rectangle"
+        app:ease_radius="18dp"
+        app:layout_constraintTop_toBottomOf="@+id/title_bar"
+        app:layout_constraintStart_toStartOf="parent"
+        app:layout_constraintEnd_toEndOf="parent"
+        android:layout_width="72dp"
+        android:layout_height="72dp"/>
+
+    <TextView
+        android:id="@+id/tv_logo_title"
+        app:layout_constraintTop_toBottomOf="@+id/iv_logo"
+        app:layout_constraintStart_toStartOf="parent"
+        app:layout_constraintEnd_toEndOf="parent"
+        android:layout_marginTop="8dp"
+        android:text="@string/about_logo"
+        style="@style/about_logo"
+        app:layout_constraintHorizontal_chainStyle="packed"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"/>
+
+    <TextView
+        android:id="@+id/tv_version"
+        app:layout_constraintTop_toBottomOf="@+id/tv_logo_title"
+        app:layout_constraintStart_toStartOf="parent"
+        app:layout_constraintEnd_toEndOf="parent"
+        android:layout_marginTop="4dp"
+        android:text="@string/about_version"
+        style="@style/about_version"
+        app:layout_constraintHorizontal_chainStyle="packed"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"/>
+
+    <TextView
+        android:id="@+id/tv_kit_version"
+        app:layout_constraintTop_toBottomOf="@+id/tv_version"
+        app:layout_constraintStart_toStartOf="parent"
+        app:layout_constraintEnd_toEndOf="parent"
+        android:layout_marginTop="4dp"
+        android:text="@string/about_uikit_version"
+        style="@style/about_uikit_version"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"/>
+
+    <io.agora.uikit.widget.EaseArrowItemView
+        android:id="@+id/arrow_item_documentation"
+        app:layout_constraintTop_toBottomOf="@+id/tv_kit_version"
+        app:arrowItemTitle="@string/about_official_website"
+        app:arrowItemSubTitle="@string/about_official_website_url"
+        app:arrowItemShowSubTitle="true"
+        app:arrowItemSubTitleColor="@color/ease_color_primary"
+        android:layout_marginTop="54dp"
+        style="@style/ease_group_detail_arrow_item"
+        app:arrowItemShowArrow="true"
+        android:layout_width="match_parent"
+        android:layout_height="54dp"/>
+
+    <io.agora.uikit.widget.EaseArrowItemView
+        android:id="@+id/arrow_item_sales"
+        app:layout_constraintTop_toBottomOf="@+id/arrow_item_documentation"
+        app:arrowItemTitle="@string/about_sales_title"
+        app:arrowItemSubTitle="@string/about_sales_subtitle"
+        app:arrowItemSubTitleColor="@color/ease_color_primary"
+        app:arrowItemShowSubTitle="true"
+        style="@style/ease_group_detail_arrow_item"
+        app:arrowItemShowArrow="true"
+        android:layout_width="match_parent"
+        android:layout_height="54dp"/>
+
+    <io.agora.uikit.widget.EaseArrowItemView
+        android:id="@+id/arrow_item_demo_repo"
+        app:layout_constraintTop_toBottomOf="@+id/arrow_item_sales"
+        app:arrowItemTitle="@string/about_demo_app_github_repo_title"
+        app:arrowItemSubTitle="@string/about_demo_app_github_repo_subtitle"
+        app:arrowItemSubTitleColor="@color/ease_color_primary"
+        app:arrowItemShowSubTitle="true"
+        style="@style/ease_group_detail_arrow_item"
+        app:arrowItemShowArrow="true"
+        android:layout_width="match_parent"
+        android:layout_height="54dp"/>
+
+    <io.agora.uikit.widget.EaseArrowItemView
+        android:id="@+id/arrow_item_more"
+        app:layout_constraintTop_toBottomOf="@+id/arrow_item_demo_repo"
+        app:arrowItemTitle="@string/about_more_title"
+        app:arrowItemSubTitle="@string/about_more_subtitle"
+        app:arrowItemSubTitleColor="@color/ease_color_primary"
+        app:arrowItemShowSubTitle="true"
+        style="@style/ease_group_detail_arrow_item"
+        app:arrowItemShowArrow="true"
+        android:layout_width="match_parent"
+        android:layout_height="54dp"/>
+
+
+</androidx.constraintlayout.widget.ConstraintLayout >
\ No newline at end of file
diff --git a/app-kotlin/src/main/res/layout/demo_activity_conference_invite.xml b/app-kotlin/src/main/res/layout/demo_activity_conference_invite.xml
new file mode 100644
index 00000000..d36bfbe8
--- /dev/null
+++ b/app-kotlin/src/main/res/layout/demo_activity_conference_invite.xml
@@ -0,0 +1,22 @@
+<?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"
+    android:orientation="vertical"
+    android:layout_width="match_parent"
+    android:layout_height="match_parent">
+
+    <io.agora.uikit.widget.EaseTitleBar
+        android:id="@+id/title_bar"
+        android:layout_width="match_parent"
+        android:layout_height="@dimen/ease_toolbar_height"
+        app:titleBarTitle="@string/group_call_title"
+        app:titleBarMenu="@menu/demo_conference_invite_menu"
+        app:titleBarMenuTitleColor="@color/ease_color_primary"/>
+
+    <FrameLayout
+        android:id="@+id/fl_fragment"
+        android:layout_width="match_parent"
+        android:layout_height="0dp"
+        android:layout_weight="1"/>
+
+</LinearLayout>
\ No newline at end of file
diff --git a/app-kotlin/src/main/res/layout/demo_activity_currency.xml b/app-kotlin/src/main/res/layout/demo_activity_currency.xml
new file mode 100644
index 00000000..687e394f
--- /dev/null
+++ b/app-kotlin/src/main/res/layout/demo_activity_currency.xml
@@ -0,0 +1,46 @@
+<?xml version="1.0" encoding="utf-8"?>
+<androidx.appcompat.widget.LinearLayoutCompat
+    xmlns:app="http://schemas.android.com/apk/res-auto"
+    xmlns:android="http://schemas.android.com/apk/res/android"
+    android:background="@color/ease_color_background"
+    android:orientation="vertical"
+    android:layout_width="match_parent"
+    android:layout_height="match_parent">
+
+    <io.agora.uikit.widget.EaseTitleBar
+        android:id="@+id/title_bar"
+        android:layout_width="match_parent"
+        android:layout_height="@dimen/ease_toolbar_height"
+        app:titleBarTitle="@string/main_about_me_currency"
+        app:titleBarMenuTitleColor="@color/demo_title"
+        app:titleBarTitleTextColor="@color/demo_title"
+        app:titleBarMenuIconTint="@color/demo_title"
+        app:titleBarSubtitleTextColor="@color/ease_color_text_secondary"
+        android:visibility="visible" />
+
+    <io.agora.uikit.widget.EaseSwitchItemView
+        android:id="@+id/switch_item_dark"
+        app:switchItemTitle="@string/main_about_me_currency_dark_model"
+        app:switchItemClickable="false"
+        style="@style/currency_switch_item_dark_mode"
+        android:layout_width="match_parent"
+        android:layout_height="54dp" />
+
+    <io.agora.uikit.widget.EaseArrowItemView
+        android:id="@+id/arrow_item_feature"
+        app:arrowItemTitle="@string/main_about_me_currency_feature"
+        style="@style/currency_arrow_item_feature"
+        app:arrowItemShowArrow="true"
+        android:layout_width="match_parent"
+        android:layout_height="54dp"/>
+
+    <io.agora.uikit.widget.EaseArrowItemView
+        android:id="@+id/arrow_item_target_language"
+        app:arrowItemTitle="@string/currency_target_language"
+        style="@style/currency_arrow_item_language"
+        app:arrowItemShowArrow="true"
+        android:layout_width="match_parent"
+        android:layout_height="54dp"/>
+
+
+</androidx.appcompat.widget.LinearLayoutCompat>
\ No newline at end of file
diff --git a/app-kotlin/src/main/res/layout/demo_activity_features.xml b/app-kotlin/src/main/res/layout/demo_activity_features.xml
new file mode 100644
index 00000000..42c9e76c
--- /dev/null
+++ b/app-kotlin/src/main/res/layout/demo_activity_features.xml
@@ -0,0 +1,82 @@
+<?xml version="1.0" encoding="utf-8"?>
+<androidx.appcompat.widget.LinearLayoutCompat
+    xmlns:app="http://schemas.android.com/apk/res-auto"
+    xmlns:android="http://schemas.android.com/apk/res/android"
+    android:orientation="vertical"
+    android:background="@color/ease_color_background"
+    android:layout_width="match_parent"
+    android:layout_height="match_parent">
+
+    <io.agora.uikit.widget.EaseTitleBar
+        android:id="@+id/title_bar"
+        android:layout_width="match_parent"
+        android:layout_height="@dimen/ease_toolbar_height"
+        app:titleBarTitle="@string/main_about_me_currency_feature"
+        app:titleBarMenuTitleColor="@color/ease_color_on_background_low"
+        app:titleBarTitleTextColor="@color/ease_color_on_background_low"
+        app:titleBarMenuIconTint="@color/ease_color_on_background_low"
+        app:titleBarSubtitleTextColor="@color/ease_color_text_secondary"
+        android:visibility="visible" />
+
+    <io.agora.uikit.widget.EaseSwitchItemView
+        android:id="@+id/switch_item_typing"
+        app:layout_constraintTop_toBottomOf="@+id/function_layout"
+        app:switchItemTitle="@string/main_about_me_currency_typing"
+        app:switchItemClickable="false"
+        style="@style/currency_switch_item_typing"
+        android:layout_width="match_parent"
+        android:layout_height="54dp" />
+
+    <TextView
+        style="@style/main_about_me_feature_text_describe"
+        android:layout_width="match_parent"
+        android:layout_height="wrap_content"
+        android:text="@string/main_about_me_currency_typing_desc"
+        />
+
+    <io.agora.uikit.widget.EaseSwitchItemView
+        android:id="@+id/switch_item_translation"
+        app:switchItemTitle="@string/currency_feature_translation"
+        style="@style/ease_contact_detail_switch_item"
+        app:switchItemClickable="false"
+        android:layout_width="match_parent"
+        android:layout_height="54dp" />
+
+    <TextView
+        android:layout_width="match_parent"
+        android:layout_height="wrap_content"
+        style="@style/main_about_me_feature_text_describe"
+        android:text="@string/currency_feature_translation_describe"
+        />
+
+    <io.agora.uikit.widget.EaseSwitchItemView
+        android:id="@+id/switch_item_topic"
+        app:switchItemTitle="@string/currency_feature_topic"
+        style="@style/ease_contact_detail_switch_item"
+        app:switchItemClickable="false"
+        android:layout_width="match_parent"
+        android:layout_height="54dp" />
+
+    <TextView
+        android:layout_width="match_parent"
+        android:layout_height="wrap_content"
+        style="@style/main_about_me_feature_text_describe"
+        android:text="@string/currency_feature_topic_describe"
+        />
+
+    <io.agora.uikit.widget.EaseSwitchItemView
+        android:id="@+id/switch_item_reaction"
+        app:switchItemTitle="@string/currency_feature_reaction"
+        style="@style/ease_contact_detail_switch_item"
+        app:switchItemClickable="false"
+        android:layout_width="match_parent"
+        android:layout_height="54dp" />
+
+    <TextView
+        android:layout_width="match_parent"
+        android:layout_height="wrap_content"
+        style="@style/main_about_me_feature_text_describe"
+        android:text="@string/currency_feature_reaction_describe"
+        />
+
+</androidx.appcompat.widget.LinearLayoutCompat>
\ No newline at end of file
diff --git a/app-kotlin/src/main/res/layout/demo_activity_language.xml b/app-kotlin/src/main/res/layout/demo_activity_language.xml
new file mode 100644
index 00000000..9fe6f550
--- /dev/null
+++ b/app-kotlin/src/main/res/layout/demo_activity_language.xml
@@ -0,0 +1,26 @@
+<?xml version="1.0" encoding="utf-8"?>
+<androidx.appcompat.widget.LinearLayoutCompat
+    xmlns:app="http://schemas.android.com/apk/res-auto"
+    xmlns:android="http://schemas.android.com/apk/res/android"
+    android:orientation="vertical"
+    android:layout_width="match_parent"
+    android:layout_height="match_parent">
+
+    <io.agora.uikit.widget.EaseTitleBar
+        android:id="@+id/title_bar"
+        android:layout_width="match_parent"
+        android:layout_height="@dimen/ease_toolbar_height"
+        app:titleBarMenu="@menu/demo_language_menu_confirm"
+        app:titleBarMenuTitleColor="@color/ease_color_on_background_low"
+        app:titleBarTitleTextColor="@color/ease_color_on_background_low"
+        app:titleBarMenuIconTint="@color/ease_color_on_background_low"
+        app:titleBarSubtitleTextColor="@color/ease_color_text_secondary"
+        android:visibility="visible" />
+
+    <androidx.recyclerview.widget.RecyclerView
+        android:id="@+id/rlSheetList"
+        android:layout_marginBottom="10dp"
+        android:layout_width="match_parent"
+        android:layout_height="match_parent"/>
+
+</androidx.appcompat.widget.LinearLayoutCompat>
\ No newline at end of file
diff --git a/app-kotlin/src/main/res/layout/demo_activity_login.xml b/app-kotlin/src/main/res/layout/demo_activity_login.xml
new file mode 100644
index 00000000..4f8c5fe8
--- /dev/null
+++ b/app-kotlin/src/main/res/layout/demo_activity_login.xml
@@ -0,0 +1,23 @@
+<?xml version="1.0" encoding="utf-8"?>
+<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:app="http://schemas.android.com/apk/res-auto"
+    android:orientation="vertical"
+    android:layout_width="match_parent"
+    android:layout_height="match_parent">
+
+    <ImageView
+        android:layout_width="match_parent"
+        android:layout_height="match_parent"
+        android:scaleType="centerCrop"
+        android:src="@drawable/splash_bg_light"/>
+
+    <FrameLayout
+        android:id="@+id/fl_fragment"
+        android:layout_width="0dp"
+        android:layout_height="0dp"
+        app:layout_constraintLeft_toLeftOf="parent"
+        app:layout_constraintRight_toRightOf="parent"
+        app:layout_constraintTop_toTopOf="parent"
+        app:layout_constraintBottom_toBottomOf="parent"/>
+
+</androidx.constraintlayout.widget.ConstraintLayout>
\ No newline at end of file
diff --git a/app-kotlin/src/main/res/layout/demo_activity_me_information.xml b/app-kotlin/src/main/res/layout/demo_activity_me_information.xml
new file mode 100644
index 00000000..dcd60315
--- /dev/null
+++ b/app-kotlin/src/main/res/layout/demo_activity_me_information.xml
@@ -0,0 +1,121 @@
+<?xml version="1.0" encoding="utf-8"?>
+<androidx.appcompat.widget.LinearLayoutCompat
+    xmlns:app="http://schemas.android.com/apk/res-auto"
+    xmlns:android="http://schemas.android.com/apk/res/android"
+    android:orientation="vertical"
+    android:layout_width="match_parent"
+    android:layout_height="match_parent">
+
+    <io.agora.uikit.widget.EaseTitleBar
+        android:id="@+id/title_bar"
+        android:layout_width="match_parent"
+        android:layout_height="@dimen/ease_toolbar_height"
+        app:titleBarTitle="@string/main_about_me_information"
+        app:titleBarMenuTitleColor="@color/ease_color_on_background_low"
+        app:titleBarTitleTextColor="@color/ease_color_on_background_low"
+        app:titleBarMenuIconTint="@color/ease_color_on_background_low"
+        app:titleBarSubtitleTextColor="@color/ease_color_text_secondary"
+        android:visibility="visible" />
+
+    <androidx.constraintlayout.widget.ConstraintLayout
+        android:id="@+id/avatar_layout"
+        app:layout_constraintTop_toBottomOf="@+id/title_bar"
+        app:layout_constraintStart_toStartOf="parent"
+        android:layout_width="match_parent"
+        android:layout_height="wrap_content">
+
+        <TextView
+            android:id="@+id/tv_avatar"
+            app:layout_constraintTop_toTopOf="parent"
+            app:layout_constraintStart_toStartOf="parent"
+            android:padding="16dp"
+            style="@style/main_about_me_information_title"
+            android:text="@string/main_about_me_information_avatar"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"/>
+
+        <io.agora.uikit.widget.EaseImageView
+            android:id="@+id/iv_avatar"
+            app:layout_constraintTop_toTopOf="@+id/tv_avatar"
+            app:layout_constraintBottom_toBottomOf="@+id/tv_avatar"
+            app:layout_constraintEnd_toStartOf="@+id/iv_avatar_end"
+            android:src="@drawable/ease_default_avatar"
+            android:scaleType="fitCenter"
+            android:layout_marginEnd="10dp"
+            android:layout_width="40dp"
+            android:layout_height="40dp"/>
+
+        <io.agora.uikit.widget.EaseImageView
+            android:id="@+id/iv_avatar_end"
+            app:layout_constraintTop_toTopOf="@+id/tv_avatar"
+            app:layout_constraintBottom_toBottomOf="@+id/tv_avatar"
+            app:layout_constraintEnd_toEndOf="parent"
+            android:layout_marginEnd="16dp"
+            android:src="@drawable/icon_next"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"/>
+
+        <View
+            android:id="@+id/view_avatar_divider"
+            android:layout_marginStart="16dp"
+            android:layout_marginEnd="16dp"
+            style="@style/ease_list_item_divider"
+            app:layout_constraintBottom_toBottomOf="parent"
+            app:layout_constraintStart_toStartOf="parent"
+            app:layout_constraintEnd_toEndOf="parent"/>
+
+    </androidx.constraintlayout.widget.ConstraintLayout>
+
+    <androidx.constraintlayout.widget.ConstraintLayout
+        android:id="@+id/nick_name_layout"
+        android:layout_width="match_parent"
+        android:layout_height="wrap_content">
+
+        <TextView
+            android:id="@+id/title_nick_name"
+            app:layout_constraintTop_toTopOf="parent"
+            app:layout_constraintStart_toStartOf="parent"
+            android:padding="16dp"
+            style="@style/main_about_me_information_title"
+            android:text="@string/main_about_me_information_nick_name"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"/>
+
+        <TextView
+            android:id="@+id/tv_nick_name"
+            app:layout_constraintTop_toTopOf="@+id/title_nick_name"
+            app:layout_constraintBottom_toBottomOf="@+id/title_nick_name"
+            app:layout_constraintEnd_toStartOf="@+id/iv_name_end"
+            android:layout_marginEnd="10dp"
+            style="@style/main_about_me_information_subtitle"
+            android:paddingTop="16dp"
+            android:paddingBottom="16dp"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"/>
+
+        <io.agora.uikit.widget.EaseImageView
+            android:id="@+id/iv_name_end"
+            app:layout_constraintTop_toTopOf="@+id/title_nick_name"
+            app:layout_constraintBottom_toBottomOf="@+id/title_nick_name"
+            app:layout_constraintEnd_toEndOf="parent"
+            android:layout_marginEnd="16dp"
+            android:src="@drawable/icon_next"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"/>
+
+        <View
+            android:id="@+id/view_name_divider"
+            android:layout_marginStart="16dp"
+            android:layout_marginEnd="16dp"
+            style="@style/ease_list_item_divider"
+            app:layout_constraintBottom_toBottomOf="parent"
+            app:layout_constraintStart_toStartOf="parent"
+            app:layout_constraintEnd_toEndOf="parent"/>
+
+
+    </androidx.constraintlayout.widget.ConstraintLayout>
+
+
+
+
+</androidx.appcompat.widget.LinearLayoutCompat>
\ No newline at end of file
diff --git a/app-kotlin/src/main/res/layout/demo_activity_me_information_edit.xml b/app-kotlin/src/main/res/layout/demo_activity_me_information_edit.xml
new file mode 100644
index 00000000..7fc8f175
--- /dev/null
+++ b/app-kotlin/src/main/res/layout/demo_activity_me_information_edit.xml
@@ -0,0 +1,51 @@
+<?xml version="1.0" encoding="utf-8"?>
+<androidx.constraintlayout.widget.ConstraintLayout
+    xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:app="http://schemas.android.com/apk/res-auto"
+    android:background="@color/ease_color_background"
+    android:layout_width="match_parent"
+    android:layout_height="match_parent">
+
+    <io.agora.uikit.widget.EaseTitleBar
+        android:id="@+id/title_bar"
+        android:layout_width="match_parent"
+        android:layout_height="@dimen/ease_toolbar_height"
+        app:titleBarDisplayHomeAsUpEnabled="true"
+        app:titleBarReplaceActionBar="false"
+        app:layout_constraintStart_toStartOf="parent"
+        app:layout_constraintEnd_toEndOf="parent"
+        app:layout_constraintTop_toTopOf="parent"
+        app:titleBarTitle=""
+        app:titleBarMenu="@menu/menu_action_save"
+        app:titleBarMenuTitleColor="@color/ease_color_on_background_high"/>
+
+    <RelativeLayout
+        android:id="@+id/edit_name_layout"
+        app:layout_constraintTop_toBottomOf="@+id/title_bar"
+        android:layout_marginTop="16dp"
+        android:paddingHorizontal="16dp"
+        android:background="@color/ease_color_background"
+        android:layout_width="match_parent"
+        android:layout_height="wrap_content">
+
+        <EditText
+            android:id="@+id/et_name"
+            android:layout_width="match_parent"
+            android:layout_height="wrap_content"
+            android:paddingEnd="80dp"
+            android:paddingVertical="13dp"
+            android:paddingHorizontal="16dp"
+            style="@style/ease_group_edit_name"/>
+
+        <TextView
+            android:id="@+id/input_name_count"
+            android:layout_alignParentEnd="true"
+            android:layout_marginEnd="13dp"
+            android:layout_centerVertical="true"
+            style="@style/ease_group_edit_tv_input_count"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"/>
+
+    </RelativeLayout>
+
+</androidx.constraintlayout.widget.ConstraintLayout>
\ No newline at end of file
diff --git a/app-kotlin/src/main/res/layout/demo_activity_notify.xml b/app-kotlin/src/main/res/layout/demo_activity_notify.xml
new file mode 100644
index 00000000..e535ff5c
--- /dev/null
+++ b/app-kotlin/src/main/res/layout/demo_activity_notify.xml
@@ -0,0 +1,35 @@
+<?xml version="1.0" encoding="utf-8"?>
+<androidx.appcompat.widget.LinearLayoutCompat
+    xmlns:app="http://schemas.android.com/apk/res-auto"
+    xmlns:android="http://schemas.android.com/apk/res/android"
+    android:orientation="vertical"
+    android:layout_width="match_parent"
+    android:layout_height="match_parent">
+
+    <io.agora.uikit.widget.EaseTitleBar
+        android:id="@+id/title_bar"
+        android:layout_width="match_parent"
+        android:layout_height="@dimen/ease_toolbar_height"
+        app:titleBarTitle="@string/main_about_me_notify"
+        app:titleBarMenuTitleColor="@color/ease_color_on_background_low"
+        app:titleBarTitleTextColor="@color/ease_color_on_background_low"
+        app:titleBarMenuIconTint="@color/ease_color_on_background_low"
+        app:titleBarSubtitleTextColor="@color/ease_color_text_secondary"
+        android:visibility="visible" />
+
+    <io.agora.uikit.widget.EaseSwitchItemView
+        android:id="@+id/switch_item_notify"
+        app:switchItemTitle="@string/main_about_me_notify_title"
+        style="@style/ease_contact_detail_switch_item"
+        app:switchItemClickable="false"
+        android:layout_width="match_parent"
+        android:layout_height="54dp" />
+
+    <TextView
+        android:layout_width="match_parent"
+        android:layout_height="wrap_content"
+        style="@style/main_about_me_feature_text_describe"
+        android:text="@string/main_about_me_notify_describe"
+        />
+
+</androidx.appcompat.widget.LinearLayoutCompat>
\ No newline at end of file
diff --git a/app-kotlin/src/main/res/layout/demo_activity_webview.xml b/app-kotlin/src/main/res/layout/demo_activity_webview.xml
new file mode 100644
index 00000000..946cbe0a
--- /dev/null
+++ b/app-kotlin/src/main/res/layout/demo_activity_webview.xml
@@ -0,0 +1,25 @@
+<?xml version="1.0" encoding="utf-8"?>
+<androidx.appcompat.widget.LinearLayoutCompat
+    android:orientation="vertical"
+    xmlns:app="http://schemas.android.com/apk/res-auto"
+    xmlns:android="http://schemas.android.com/apk/res/android"
+    android:layout_width="match_parent"
+    android:layout_height="match_parent">
+
+    <io.agora.uikit.widget.EaseTitleBar
+        android:id="@+id/title_bar"
+        android:layout_width="match_parent"
+        android:layout_height="@dimen/ease_toolbar_height"
+        app:titleBarMenuTitleColor="@color/ease_color_on_background_low"
+        app:titleBarTitleTextColor="@color/ease_color_on_background_low"
+        app:titleBarMenuIconTint="@color/ease_color_on_background_low"
+        app:titleBarSubtitleTextColor="@color/ease_color_text_secondary"
+        android:visibility="visible" />
+
+    <WebView
+        android:id="@+id/wb_view"
+        android:layout_width="match_parent"
+        android:layout_height="match_parent"/>
+
+
+</androidx.appcompat.widget.LinearLayoutCompat>
\ No newline at end of file
diff --git a/app-kotlin/src/main/res/layout/demo_badge_home.xml b/app-kotlin/src/main/res/layout/demo_badge_home.xml
new file mode 100644
index 00000000..2eb2f23f
--- /dev/null
+++ b/app-kotlin/src/main/res/layout/demo_badge_home.xml
@@ -0,0 +1,16 @@
+<?xml version="1.0" encoding="utf-8"?>
+<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
+    android:layout_width="match_parent"
+    android:layout_height="match_parent"
+    xmlns:app="http://schemas.android.com/apk/res-auto"
+    xmlns:tools="http://schemas.android.com/tools">
+
+    <TextView
+        android:id="@+id/tv_main_home_msg"
+        app:layout_constraintStart_toStartOf="parent"
+        app:layout_constraintEnd_toEndOf="parent"
+        app:layout_constraintTop_toTopOf="parent"
+        style="@style/em_main_badge_tv"
+        tools:text="99+"/>
+
+</androidx.constraintlayout.widget.ConstraintLayout>
\ No newline at end of file
diff --git a/app-kotlin/src/main/res/layout/demo_fragment_about_me.xml b/app-kotlin/src/main/res/layout/demo_fragment_about_me.xml
new file mode 100644
index 00000000..418cbec1
--- /dev/null
+++ b/app-kotlin/src/main/res/layout/demo_fragment_about_me.xml
@@ -0,0 +1,146 @@
+<?xml version="1.0" encoding="utf-8"?>
+<ScrollView
+    android:scrollbars="none"
+    xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:app="http://schemas.android.com/apk/res-auto"
+    android:layout_width="match_parent"
+    android:layout_height="match_parent">
+
+    <androidx.appcompat.widget.LinearLayoutCompat
+        android:layout_width="match_parent"
+        android:layout_height="wrap_content"
+        android:paddingBottom="50dp"
+        android:background="@color/ease_color_background"
+        android:orientation="vertical">
+
+        <io.agora.uikit.widget.EaseCustomAvatarView
+            android:id="@+id/ep_presence"
+            android:layout_marginTop="64dp"
+            android:layout_gravity="center"
+            android:layout_width="100dp"
+            android:layout_height="100dp"/>
+
+        <androidx.constraintlayout.widget.ConstraintLayout
+            android:layout_marginTop="12dp"
+            android:layout_width="match_parent"
+            android:layout_height="wrap_content">
+
+            <TextView
+                app:layout_constraintTop_toTopOf="parent"
+                app:layout_constraintStart_toStartOf="parent"
+                app:layout_constraintEnd_toStartOf="@+id/ic_notice"
+                android:id="@+id/tv_name"
+                style="@style/ease_detail_layout_title"
+                app:layout_constraintHorizontal_chainStyle="packed"
+                android:layout_width="wrap_content"
+                android:layout_height="wrap_content"/>
+
+            <io.agora.uikit.widget.EaseImageView
+                android:id="@+id/ic_notice"
+                android:visibility="gone"
+                android:src="@drawable/ease_do_not_disturb"
+                app:layout_constraintHorizontal_chainStyle="packed"
+                app:layout_constraintTop_toTopOf="@+id/tv_name"
+                app:layout_constraintBottom_toBottomOf="@+id/tv_name"
+                app:layout_constraintEnd_toEndOf="parent"
+                app:layout_constraintStart_toEndOf="@+id/tv_name"
+                android:layout_width="20dp"
+                android:layout_height="20dp"/>
+
+            <TextView
+                app:layout_constraintTop_toBottomOf="@+id/tv_name"
+                app:layout_constraintStart_toStartOf="parent"
+                app:layout_constraintEnd_toEndOf="parent"
+                android:id="@+id/tv_number"
+                android:padding="5dp"
+                style="@style/ease_detail_layout_subtitle2"
+                android:layout_width="wrap_content"
+                android:layout_height="wrap_content"/>
+
+        </androidx.constraintlayout.widget.ConstraintLayout>
+
+        <TextView
+            android:text="@string/main_about_me_setting"
+            android:layout_marginTop="10dp"
+            android:layout_marginStart="16dp"
+            android:layout_marginBottom="4dp"
+            android:textAppearance="@style/Ease.TextAppearance.Label.Medium"
+            android:textColor="@color/ease_details_subtitle2_color"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"/>
+
+        <io.agora.uikit.widget.EaseArrowItemView
+            android:id="@+id/item_presence"
+            app:layout_constraintTop_toBottomOf="@+id/sw_item_black"
+            app:arrowItemTitle="@string/presence_status"
+            app:arrowItemAvatarSrc="@drawable/icon_presence"
+            style="@style/main_about_me_arrow_item"
+            android:layout_width="match_parent"
+            android:layout_height="54dp"/>
+
+        <io.agora.uikit.widget.EaseArrowItemView
+            android:id="@+id/item_information"
+            app:layout_constraintTop_toBottomOf="@+id/sw_item_black"
+            app:arrowItemTitle="@string/main_about_me_information"
+            app:arrowItemAvatarSrc="@drawable/icon_information"
+            style="@style/main_about_me_arrow_item"
+            android:layout_width="match_parent"
+            android:layout_height="54dp"/>
+
+        <io.agora.uikit.widget.EaseArrowItemView
+            android:id="@+id/item_currency"
+            app:layout_constraintTop_toBottomOf="@+id/sw_item_black"
+            app:arrowItemTitle="@string/main_about_me_currency"
+            app:arrowItemAvatarSrc="@drawable/icon_currency"
+            style="@style/main_about_me_arrow_item"
+            android:layout_width="match_parent"
+            android:layout_height="54dp"/>
+
+        <io.agora.uikit.widget.EaseArrowItemView
+            android:id="@+id/item_notify"
+            app:layout_constraintTop_toBottomOf="@+id/sw_item_black"
+            app:arrowItemTitle="@string/main_about_me_notify"
+            app:arrowItemAvatarSrc="@drawable/icon_notify"
+            style="@style/main_about_me_arrow_item"
+            android:layout_width="match_parent"
+            android:layout_height="54dp"/>
+
+        <io.agora.uikit.widget.EaseArrowItemView
+            android:id="@+id/item_privacy"
+            app:layout_constraintTop_toBottomOf="@+id/sw_item_black"
+            app:arrowItemTitle="@string/main_about_me_privacy"
+            app:arrowItemAvatarSrc="@drawable/icon_privacy"
+            style="@style/main_about_me_arrow_item"
+            android:layout_width="match_parent"
+            android:layout_height="54dp"/>
+
+        <io.agora.uikit.widget.EaseArrowItemView
+            android:id="@+id/item_about"
+            app:layout_constraintTop_toBottomOf="@+id/sw_item_black"
+            app:arrowItemTitle="@string/main_about_me_about"
+            app:arrowItemAvatarSrc="@drawable/icon_about"
+            style="@style/main_about_me_arrow_item"
+            android:layout_width="match_parent"
+            android:layout_height="54dp"/>
+
+        <TextView
+            android:text="@string/main_about_me_login"
+            android:layout_marginStart="16dp"
+            android:layout_marginTop="4dp"
+            android:textStyle="bold"
+            android:textAppearance="@style/Ease.TextAppearance.Label.Medium"
+            android:textColor="@color/ease_details_subtitle2_color"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"/>
+
+        <io.agora.uikit.widget.EaseArrowItemView
+            android:id="@+id/about_me_logout"
+            app:layout_constraintTop_toBottomOf="@+id/sw_item_black"
+            app:arrowItemTitle="@string/main_about_me_logout"
+            style="@style/main_about_logout_arrow_item"
+            android:layout_width="match_parent"
+            android:layout_height="54dp"/>
+
+    </androidx.appcompat.widget.LinearLayoutCompat>
+
+</ScrollView>
\ No newline at end of file
diff --git a/app-kotlin/src/main/res/layout/demo_fragment_dialog_base.xml b/app-kotlin/src/main/res/layout/demo_fragment_dialog_base.xml
new file mode 100644
index 00000000..d3b52c5c
--- /dev/null
+++ b/app-kotlin/src/main/res/layout/demo_fragment_dialog_base.xml
@@ -0,0 +1,87 @@
+<?xml version="1.0" encoding="utf-8"?>
+<androidx.cardview.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
+    android:layout_width="match_parent"
+    android:layout_height="wrap_content"
+    app:cardCornerRadius="8dp"
+    xmlns:app="http://schemas.android.com/apk/res-auto"
+    xmlns:tools="http://schemas.android.com/tools">
+
+    <androidx.constraintlayout.widget.ConstraintLayout
+        android:layout_width="match_parent"
+        android:layout_height="wrap_content">
+
+        <View
+            android:id="@+id/view_top"
+            android:layout_width="wrap_content"
+            android:layout_height="0.01dp"
+            app:layout_constraintLeft_toLeftOf="parent"
+            app:layout_constraintRight_toRightOf="parent"
+            app:layout_constraintTop_toTopOf="parent"/>
+
+        <TextView
+            android:id="@+id/tv_dialog_title"
+            android:layout_width="0dp"
+            android:layout_height="wrap_content"
+            app:layout_constraintLeft_toLeftOf="parent"
+            app:layout_constraintRight_toRightOf="parent"
+            app:layout_constraintTop_toBottomOf="@id/view_top"
+            app:layout_constraintBottom_toTopOf="@id/rl_dialog_middle"
+            android:layout_marginTop="@dimen/ease_size_34"
+            android:layout_marginBottom="@dimen/ease_size_24"
+            app:layout_goneMarginBottom="@dimen/ease_size_70"
+            app:layout_goneMarginTop="@dimen/ease_size_70"
+            android:layout_marginLeft="@dimen/ease_size_30"
+            android:layout_marginStart="@dimen/ease_size_30"
+            android:layout_marginRight="@dimen/ease_size_30"
+            android:layout_marginEnd="@dimen/ease_size_30"
+            android:textSize="20sp"
+            android:textColor="#424242"
+            android:gravity="center"
+            android:maxLines="3"
+            android:ellipsize="end"
+            tools:text="标题"/>
+
+        <RelativeLayout
+            android:id="@+id/rl_dialog_middle"
+            android:layout_width="0dp"
+            android:layout_height="wrap_content"
+            app:layout_constraintLeft_toLeftOf="parent"
+            app:layout_constraintRight_toRightOf="parent"
+            app:layout_constraintTop_toBottomOf="@id/tv_dialog_title"
+            app:layout_constraintBottom_toTopOf="@id/btn_dialog_confirm"
+            android:layout_marginBottom="@dimen/ease_size_38"/>
+
+        <Button
+            android:id="@+id/btn_dialog_cancel"
+            android:layout_width="0dp"
+            android:layout_height="wrap_content"
+            app:layout_constraintLeft_toLeftOf="parent"
+            app:layout_constraintRight_toLeftOf="@id/btn_dialog_confirm"
+            app:layout_constraintBottom_toBottomOf="parent"
+            app:layout_constraintTop_toTopOf="@id/btn_dialog_confirm"
+            android:background="@drawable/demo_dialog_btn_left_selector"
+            android:text="@string/cancel"
+            android:textColor="@color/demo_dialog_btn_text_color_selector"/>
+
+        <Button
+            android:id="@+id/btn_dialog_confirm"
+            android:layout_width="0dp"
+            android:layout_height="wrap_content"
+            app:layout_constraintLeft_toRightOf="@id/btn_dialog_cancel"
+            app:layout_constraintRight_toRightOf="parent"
+            app:layout_constraintBottom_toBottomOf="parent"
+            app:layout_constraintTop_toBottomOf="@id/rl_dialog_middle"
+            android:background="@drawable/demo_dialog_btn_selector"
+            android:text="@string/confirm"
+            android:textColor="@color/demo_dialog_btn_text_color_selector"/>
+
+        <androidx.constraintlayout.widget.Group
+            android:id="@+id/group_middle"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:visibility="gone"
+            app:constraint_referenced_ids="view_top,rl_dialog_middle,btn_dialog_cancel"/>
+
+    </androidx.constraintlayout.widget.ConstraintLayout>
+
+</androidx.cardview.widget.CardView>
\ No newline at end of file
diff --git a/app-kotlin/src/main/res/layout/demo_fragment_login.xml b/app-kotlin/src/main/res/layout/demo_fragment_login.xml
new file mode 100644
index 00000000..31777a69
--- /dev/null
+++ b/app-kotlin/src/main/res/layout/demo_fragment_login.xml
@@ -0,0 +1,122 @@
+<?xml version="1.0" encoding="utf-8"?>
+<androidx.constraintlayout.widget.ConstraintLayout
+    xmlns:android="http://schemas.android.com/apk/res/android"
+    android:layout_width="match_parent"
+    android:layout_height="match_parent"
+    xmlns:app="http://schemas.android.com/apk/res-auto"
+    xmlns:tools="http://schemas.android.com/tools">
+
+    <ImageView
+        app:layout_constraintStart_toStartOf="parent"
+        app:layout_constraintEnd_toEndOf="parent"
+        app:layout_constraintTop_toTopOf="parent"
+        app:layout_constraintBottom_toBottomOf="parent"
+        android:id="@+id/iv_splash"
+        style="@style/splash_iv_bg_style" />
+
+    <TextView
+        android:id="@+id/tv_login_im"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        app:layout_constraintStart_toStartOf="@id/et_login_id"
+        app:layout_constraintBottom_toTopOf="@id/et_login_id"
+        android:layout_marginBottom="@dimen/ease_size_20"
+        android:layout_marginStart="16dp"
+        android:textSize="24sp"
+        android:textColor="@color/ease_color_primary"
+        android:textAppearance="@style/Ease.TextAppearance.Headline.Large"
+        android:text="@string/demo_login_im"/>
+
+    <TextView
+        android:id="@+id/tv_version"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        app:layout_constraintEnd_toEndOf="@id/et_login_id"
+        app:layout_constraintTop_toTopOf="@id/tv_login_im"
+        android:layout_marginTop="@dimen/ease_size_4"
+        android:layout_marginEnd="16dp"
+        tools:text="V4.1.0"
+        android:textColor="@color/color_text_primary"
+        android:textAppearance="@style/Ease.TextAppearance.Label.ExtraSmall"
+        android:background="@drawable/demo_login_version_bg"/>
+
+    <EditText
+        android:id="@+id/et_login_id"
+        app:layout_constraintLeft_toLeftOf="parent"
+        app:layout_constraintRight_toRightOf="parent"
+        app:layout_constraintTop_toTopOf="parent"
+        app:layout_constraintBottom_toBottomOf="parent"
+        app:layout_constraintVertical_bias="0.3"
+        android:layout_width="0dp"
+        android:layout_height="@dimen/ease_size_48"
+        android:hint="@string/demo_login_username"
+        style="@style/em_login_et_input"
+        android:inputType="text"/>
+
+    <EditText
+        android:id="@+id/et_login_code"
+        app:layout_constraintLeft_toLeftOf="parent"
+        app:layout_constraintRight_toRightOf="parent"
+        app:layout_constraintTop_toBottomOf="@id/et_login_id"
+        app:layout_constraintBottom_toTopOf="@id/btn_login"
+        android:textColorHighlight="#FF0000"
+        android:layout_marginTop="@dimen/ease_size_24"
+        android:layout_width="0dp"
+        android:layout_height="@dimen/ease_size_48"
+        android:hint="@string/demo_login_password"
+        android:textSize="@dimen/demo_login_text_size"
+        style="@style/em_login_et_input"/>
+
+
+    <androidx.appcompat.widget.AppCompatButton
+        android:id="@+id/btn_login"
+        app:layout_constraintLeft_toLeftOf="parent"
+        app:layout_constraintRight_toRightOf="parent"
+        app:layout_constraintTop_toBottomOf="@id/et_login_code"
+        android:text="@string/demo_login_btn"
+        style="@style/em_login_btn"/>
+
+    <io.agora.uikit.widget.EaseImageView
+        android:id="@+id/cb_select"
+        android:layout_width="wrap_content"
+        android:layout_height="30dp"
+        android:src="@drawable/icon_login_attention_line"
+        android:padding="3dp"
+        android:layout_marginTop="15dp"
+        app:layout_constraintHorizontal_chainStyle="packed"
+        app:layout_constraintTop_toBottomOf="@id/btn_login"
+        app:layout_constraintStart_toStartOf="parent"
+        app:layout_constraintEnd_toStartOf="@id/tv_agreement"/>
+
+    <TextView
+        android:id="@+id/tv_agreement"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        android:layout_marginTop="@dimen/ease_size_20"
+        app:layout_constraintHorizontal_chainStyle="packed"
+        app:layout_constraintTop_toBottomOf="@id/btn_login"
+        app:layout_constraintStart_toEndOf="@id/cb_select"
+        app:layout_constraintEnd_toEndOf="parent"
+        android:gravity="center"
+        android:lineSpacingExtra="10dp"
+        android:textColorHighlight="@color/transparent"
+        android:textColor="@color/ease_color_on_background"
+        android:text="@string/demo_login_agreement"
+        android:textAppearance="@style/Ease.TextAppearance.Body.Small"/>
+
+    <TextView
+        android:id="@+id/tv_login_developer"
+        android:layout_height="wrap_content"
+        android:layout_width="wrap_content"
+        app:layout_constraintStart_toStartOf="parent"
+        app:layout_constraintEnd_toEndOf="parent"
+        app:layout_constraintBottom_toBottomOf="parent"
+        app:layout_constraintTop_toBottomOf="@id/tv_agreement"
+        app:layout_constraintVertical_bias="1"
+        android:visibility="gone"
+        android:textAppearance="@style/Ease.TextAppearance.Body.Medium"
+        android:textColor="@color/ease_color_text_secondary"
+        android:text="@string/em_login_server_configure"
+        android:layout_marginBottom="@dimen/ease_size_65"/>
+
+</androidx.constraintlayout.widget.ConstraintLayout>
\ No newline at end of file
diff --git a/app-kotlin/src/main/res/layout/demo_fragment_middle_agreement.xml b/app-kotlin/src/main/res/layout/demo_fragment_middle_agreement.xml
new file mode 100644
index 00000000..54cdf2ff
--- /dev/null
+++ b/app-kotlin/src/main/res/layout/demo_fragment_middle_agreement.xml
@@ -0,0 +1,28 @@
+<?xml version="1.0" encoding="utf-8"?>
+<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:tools="http://schemas.android.com/tools"
+    android:layout_width="match_parent"
+    android:layout_height="wrap_content"
+    android:orientation="vertical">
+
+    <TextView
+        android:layout_width="match_parent"
+        android:layout_height="wrap_content"
+        android:text="@string/demo_login_dialog_content"
+        android:textColor="@color/ease_color_text_on_primary"
+        android:textAppearance="@style/Ease.TextAppearance.Body.Medium"
+        android:layout_marginStart="20dp"
+        android:layout_marginEnd="20dp"/>
+
+    <TextView
+        android:id="@+id/tv_privacy"
+        android:layout_width="match_parent"
+        android:layout_height="wrap_content"
+        android:layout_marginTop="10dp"
+        android:text="@string/demo_login_dialog_content_privacy"
+        android:textSize="14sp"
+        android:textColor="@color/ease_color_on_background_high"
+        android:layout_marginStart="20dp"
+        android:layout_marginEnd="20dp"/>
+
+</LinearLayout>
\ No newline at end of file
diff --git a/app-kotlin/src/main/res/layout/demo_fragment_server_set.xml b/app-kotlin/src/main/res/layout/demo_fragment_server_set.xml
new file mode 100644
index 00000000..d7f23179
--- /dev/null
+++ b/app-kotlin/src/main/res/layout/demo_fragment_server_set.xml
@@ -0,0 +1,101 @@
+<?xml version="1.0" encoding="utf-8"?>
+<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:tools="http://schemas.android.com/tools"
+    android:layout_width="match_parent"
+    android:layout_height="match_parent"
+    xmlns:app="http://schemas.android.com/apk/res-auto">
+
+    <io.agora.uikit.widget.EaseTitleBar
+        android:id="@+id/toolbar_server"
+        android:layout_width="0dp"
+        android:layout_height="@dimen/ease_toolbar_height"
+        android:layout_marginTop="@dimen/ease_size_44"
+        app:layout_constraintStart_toStartOf="parent"
+        app:layout_constraintEnd_toEndOf="parent"
+        app:layout_constraintTop_toTopOf="parent"
+        app:titleBarDisplayHomeAsUpEnabled="true"
+        app:titleBarTitle="@string/server_set_title"/>
+
+    <androidx.core.widget.NestedScrollView
+        android:layout_width="0dp"
+        android:layout_height="0dp"
+        app:layout_constraintTop_toBottomOf="@id/toolbar_server"
+        app:layout_constraintLeft_toLeftOf="parent"
+        app:layout_constraintRight_toRightOf="parent"
+        app:layout_constraintBottom_toBottomOf="parent">
+
+        <androidx.constraintlayout.widget.ConstraintLayout
+            android:layout_width="match_parent"
+            android:layout_height="match_parent">
+
+            <EditText
+                android:id="@+id/et_appkey"
+                app:layout_constraintLeft_toLeftOf="parent"
+                app:layout_constraintRight_toRightOf="parent"
+                app:layout_constraintTop_toTopOf="parent"
+                app:layout_constraintBottom_toTopOf="@id/tv_server_specify"
+                app:layout_constraintVertical_bias="0"
+                android:layout_marginTop="@dimen/ease_size_12"
+                android:hint="@string/server_set_appkey"
+                style="@style/em_login_et_input" />
+
+            <TextView
+                android:id="@+id/tv_server_specify"
+                app:layout_constraintLeft_toLeftOf="parent"
+                app:layout_constraintRight_toRightOf="parent"
+                app:layout_constraintTop_toBottomOf="@id/et_appkey"
+                app:layout_constraintBottom_toTopOf="@id/et_server_address"
+                android:layout_marginTop="@dimen/ease_size_12"
+                android:text="@string/server_set_specify_server"
+                style="@style/em_login_et_input"
+                android:paddingStart="@dimen/ease_size_0"
+                android:background="@null"/>
+
+            <Switch
+                android:id="@+id/switch_specify_server"
+                android:layout_width="wrap_content"
+                android:layout_height="wrap_content"
+                android:track="@drawable/demo_switch_track_selector"
+                android:thumb="@drawable/demo_switch_thumb_selector"
+                app:layout_constraintLeft_toLeftOf="parent"
+                app:layout_constraintRight_toRightOf="parent"
+                app:layout_constraintTop_toTopOf="@id/tv_server_specify"
+                app:layout_constraintHorizontal_bias="1"
+                android:layout_marginTop="12dp"
+                android:layout_marginEnd="40dp"/>
+
+            <EditText
+                android:id="@+id/et_server_address"
+                app:layout_constraintLeft_toLeftOf="parent"
+                app:layout_constraintRight_toRightOf="parent"
+                app:layout_constraintTop_toBottomOf="@id/tv_server_specify"
+                app:layout_constraintBottom_toTopOf="@id/et_server_port"
+                android:layout_marginTop="@dimen/ease_size_12"
+                android:hint="@string/server_set_server_address"
+                style="@style/em_login_et_input" />
+
+            <EditText
+                android:id="@+id/et_server_port"
+                app:layout_constraintLeft_toLeftOf="parent"
+                app:layout_constraintRight_toRightOf="parent"
+                app:layout_constraintTop_toBottomOf="@id/et_server_address"
+                app:layout_constraintBottom_toTopOf="@id/et_server_rest"
+                android:layout_marginTop="@dimen/ease_size_12"
+                android:inputType="number"
+                android:hint="@string/server_set_server_port"
+                style="@style/em_login_et_input"/>
+
+            <EditText
+                android:id="@+id/et_server_rest"
+                app:layout_constraintLeft_toLeftOf="parent"
+                app:layout_constraintRight_toRightOf="parent"
+                app:layout_constraintTop_toBottomOf="@id/et_server_port"
+                android:layout_marginTop="@dimen/ease_size_12"
+                android:hint="@string/server_set_rest_server_address"
+                style="@style/em_login_et_input"/>
+
+        </androidx.constraintlayout.widget.ConstraintLayout>
+
+    </androidx.core.widget.NestedScrollView>
+
+</androidx.constraintlayout.widget.ConstraintLayout>
\ No newline at end of file
diff --git a/app-kotlin/src/main/res/layout/demo_row_received_conference_invite.xml b/app-kotlin/src/main/res/layout/demo_row_received_conference_invite.xml
new file mode 100644
index 00000000..9acd5eec
--- /dev/null
+++ b/app-kotlin/src/main/res/layout/demo_row_received_conference_invite.xml
@@ -0,0 +1,56 @@
+<?xml version="1.0" encoding="utf-8"?>
+<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:tools="http://schemas.android.com/tools"
+    xmlns:app="http://schemas.android.com/apk/res-auto"
+    style="@style/ease_chat_row_root_style">
+
+    <androidx.constraintlayout.widget.ConstraintLayout
+        android:id="@+id/cl_bubble_out"
+        style="@style/ease_chat_row_bubble_out_style">
+
+        <io.agora.uikit.widget.EaseImageView
+            android:id="@+id/iv_userhead"
+            app:layout_constraintStart_toStartOf="parent"
+            app:layout_constraintBottom_toBottomOf="@id/bubble"
+            app:layout_goneMarginStart="@dimen/ease_size_12"
+            style="@style/ease_chat_row_receive_avatar_style"/>
+
+        <androidx.constraintlayout.widget.ConstraintLayout
+            android:id="@+id/bubble"
+            app:layout_constraintStart_toEndOf="@id/iv_userhead"
+            app:layout_constraintTop_toBottomOf="@id/tv_userid"
+            app:layout_constraintBottom_toTopOf="@id/timestamp"
+            style="@style/ease_chat_row_receive_bubble_style">
+
+            <TextView
+                android:id="@+id/tv_chatcontent"
+                style="@style/ease_chat_row_receive_text_content_style"
+                app:layout_constraintStart_toStartOf="parent"
+                app:layout_constraintEnd_toEndOf="parent"
+                app:layout_constraintTop_toTopOf="parent"
+                app:layout_constraintBottom_toBottomOf="parent"
+                app:layout_constraintHorizontal_bias="0"
+                android:layout_marginBottom="@dimen/ease_size_7"
+                tools:text="Agora Chat" />
+
+        </androidx.constraintlayout.widget.ConstraintLayout>
+
+        <TextView
+            android:id="@+id/tv_userid"
+            style="@style/ease_chat_row_receive_text_name_style"
+            app:layout_constraintTop_toTopOf="parent"
+            app:layout_constraintBottom_toTopOf="@id/bubble"
+            app:layout_constraintStart_toStartOf="@id/bubble"
+            tools:text="som" />
+
+        <TextView
+            android:id="@+id/timestamp"
+            style="@style/ease_chat_row_text_date_style"
+            app:layout_constraintStart_toStartOf="@id/bubble"
+            app:layout_constraintTop_toBottomOf="@id/bubble"
+            app:layout_constraintBottom_toBottomOf="parent"
+            tools:text="11-03, 8:41"/>
+
+    </androidx.constraintlayout.widget.ConstraintLayout>
+
+</LinearLayout>
\ No newline at end of file
diff --git a/app-kotlin/src/main/res/layout/demo_row_received_voice_call.xml b/app-kotlin/src/main/res/layout/demo_row_received_voice_call.xml
new file mode 100644
index 00000000..988c12df
--- /dev/null
+++ b/app-kotlin/src/main/res/layout/demo_row_received_voice_call.xml
@@ -0,0 +1,70 @@
+<?xml version="1.0" encoding="utf-8"?>
+<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:tools="http://schemas.android.com/tools"
+    xmlns:app="http://schemas.android.com/apk/res-auto"
+    style="@style/ease_chat_row_root_style">
+
+    <androidx.constraintlayout.widget.ConstraintLayout
+        android:id="@+id/cl_bubble_out"
+        style="@style/ease_chat_row_bubble_out_style">
+
+        <io.agora.uikit.widget.EaseImageView
+            android:id="@+id/iv_userhead"
+            app:layout_constraintStart_toStartOf="parent"
+            app:layout_constraintBottom_toBottomOf="@id/bubble"
+            app:layout_goneMarginStart="@dimen/ease_size_12"
+            style="@style/ease_chat_row_receive_avatar_style"/>
+
+        <androidx.constraintlayout.widget.ConstraintLayout
+            android:id="@+id/bubble"
+            app:layout_constraintStart_toEndOf="@id/iv_userhead"
+            app:layout_constraintTop_toBottomOf="@id/tv_userid"
+            app:layout_constraintBottom_toTopOf="@id/timestamp"
+            style="@style/ease_chat_row_receive_bubble_style">
+
+            <TextView
+                android:id="@+id/tv_chatcontent"
+                style="@style/ease_chat_row_receive_text_content_style"
+                app:layout_constraintStart_toEndOf="@id/iv_call_icon"
+                app:layout_constraintEnd_toEndOf="parent"
+                app:layout_constraintTop_toTopOf="parent"
+                app:layout_constraintBottom_toBottomOf="parent"
+                app:layout_constraintHorizontal_bias="0"
+                android:layout_marginBottom="@dimen/ease_size_7"
+                android:layout_marginStart="@dimen/ease_size_0"
+                tools:text="Agora Chat" />
+
+            <androidx.appcompat.widget.AppCompatImageView
+                android:id="@+id/iv_call_icon"
+                android:layout_width="wrap_content"
+                android:layout_height="wrap_content"
+                app:layout_constraintStart_toStartOf="parent"
+                app:layout_constraintTop_toTopOf="parent"
+                app:layout_constraintBottom_toBottomOf="parent"
+                app:layout_constraintEnd_toStartOf="@id/tv_chatcontent"
+                android:layout_marginStart="@dimen/ease_size_9"
+                android:layout_marginEnd="@dimen/ease_size_4"
+                app:tint="@color/ease_color_on_background"
+                android:src="@drawable/d_chat_voice_call" />
+
+        </androidx.constraintlayout.widget.ConstraintLayout>
+
+        <TextView
+            android:id="@+id/tv_userid"
+            style="@style/ease_chat_row_receive_text_name_style"
+            app:layout_constraintTop_toTopOf="parent"
+            app:layout_constraintBottom_toTopOf="@id/bubble"
+            app:layout_constraintStart_toStartOf="@id/bubble"
+            tools:text="som" />
+
+        <TextView
+            android:id="@+id/timestamp"
+            style="@style/ease_chat_row_text_date_style"
+            app:layout_constraintStart_toStartOf="@id/bubble"
+            app:layout_constraintTop_toBottomOf="@id/bubble"
+            app:layout_constraintBottom_toBottomOf="parent"
+            tools:text="11-03, 8:41"/>
+
+    </androidx.constraintlayout.widget.ConstraintLayout>
+
+</LinearLayout>
\ No newline at end of file
diff --git a/app-kotlin/src/main/res/layout/demo_row_sent_conference_invite.xml b/app-kotlin/src/main/res/layout/demo_row_sent_conference_invite.xml
new file mode 100644
index 00000000..ab371f17
--- /dev/null
+++ b/app-kotlin/src/main/res/layout/demo_row_sent_conference_invite.xml
@@ -0,0 +1,80 @@
+<?xml version="1.0" encoding="utf-8"?>
+<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:tools="http://schemas.android.com/tools"
+    xmlns:app="http://schemas.android.com/apk/res-auto"
+    style="@style/ease_chat_row_root_style">
+
+    <androidx.constraintlayout.widget.ConstraintLayout
+        android:id="@+id/cl_bubble_out"
+        style="@style/ease_chat_row_bubble_out_style" >
+
+        <io.agora.uikit.widget.EaseImageView
+            android:id="@+id/iv_userhead"
+            app:layout_constraintBottom_toBottomOf="@id/bubble"
+            app:layout_constraintEnd_toEndOf="parent"
+            style="@style/ease_chat_row_send_avatar_style"/>
+
+        <androidx.constraintlayout.widget.ConstraintLayout
+            android:id="@+id/bubble"
+            style="@style/ease_chat_row_send_bubble_style"
+            app:layout_constraintEnd_toStartOf="@id/iv_userhead"
+            app:layout_constraintTop_toBottomOf="@id/tv_userid"
+            app:layout_constraintBottom_toTopOf="@id/timestamp"
+            app:layout_goneMarginEnd="@dimen/ease_size_12">
+
+            <TextView
+                android:id="@+id/tv_chatcontent"
+                style="@style/ease_chat_row_send_text_content_style"
+                app:layout_constraintBottom_toBottomOf="parent"
+                app:layout_constraintEnd_toEndOf="parent"
+                app:layout_constraintHorizontal_bias="1"
+                app:layout_constraintStart_toStartOf="parent"
+                app:layout_constraintTop_toTopOf="parent"
+                android:layout_marginBottom="@dimen/ease_size_7"
+                tools:text="Hello, Agora Chat!" />
+
+        </androidx.constraintlayout.widget.ConstraintLayout>
+
+        <ImageView
+            android:id="@+id/msg_status"
+            style="@style/ease_chat_row_sent_iv_fail_style"
+            app:layout_constraintBottom_toBottomOf="@id/bubble"
+            app:layout_constraintEnd_toStartOf="@id/bubble" />
+
+        <TextView
+            android:id="@+id/tv_ack"
+            style="@style/ease_chat_row_send_status_ack_style"
+            app:layout_constraintBottom_toBottomOf="@id/bubble"
+            app:layout_constraintEnd_toStartOf="@id/bubble" />
+
+        <TextView
+            android:id="@+id/tv_delivered"
+            style="@style/ease_chat_row_send_status_delivered_style"
+            app:layout_constraintBottom_toBottomOf="@id/bubble"
+            app:layout_constraintEnd_toStartOf="@id/bubble" />
+
+        <ProgressBar
+            android:id="@+id/progress_bar"
+            app:layout_constraintBottom_toBottomOf="@id/bubble"
+            app:layout_constraintEnd_toStartOf="@id/bubble"
+            style="@style/ease_chat_row_send_progress_style" />
+
+        <TextView
+            android:id="@+id/tv_userid"
+            style="@style/ease_chat_row_text_name_style"
+            app:layout_constraintTop_toTopOf="parent"
+            app:layout_constraintBottom_toTopOf="@id/bubble"
+            app:layout_constraintEnd_toEndOf="@id/bubble"
+            tools:text="som"/>
+
+        <TextView
+            android:id="@+id/timestamp"
+            style="@style/ease_chat_row_text_date_style"
+            app:layout_constraintEnd_toEndOf="@id/bubble"
+            app:layout_constraintTop_toBottomOf="@id/bubble"
+            app:layout_constraintBottom_toBottomOf="parent"
+            tools:text="11-03, 8:41"/>
+
+    </androidx.constraintlayout.widget.ConstraintLayout>
+
+</LinearLayout>
\ No newline at end of file
diff --git a/app-kotlin/src/main/res/layout/demo_row_sent_voice_call.xml b/app-kotlin/src/main/res/layout/demo_row_sent_voice_call.xml
new file mode 100644
index 00000000..d6c9f359
--- /dev/null
+++ b/app-kotlin/src/main/res/layout/demo_row_sent_voice_call.xml
@@ -0,0 +1,94 @@
+<?xml version="1.0" encoding="utf-8"?>
+<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:tools="http://schemas.android.com/tools"
+    xmlns:app="http://schemas.android.com/apk/res-auto"
+    style="@style/ease_chat_row_root_style">
+
+    <androidx.constraintlayout.widget.ConstraintLayout
+        android:id="@+id/cl_bubble_out"
+        style="@style/ease_chat_row_bubble_out_style" >
+
+        <io.agora.uikit.widget.EaseImageView
+            android:id="@+id/iv_userhead"
+            app:layout_constraintBottom_toBottomOf="@id/bubble"
+            app:layout_constraintEnd_toEndOf="parent"
+            style="@style/ease_chat_row_send_avatar_style"/>
+
+        <androidx.constraintlayout.widget.ConstraintLayout
+            android:id="@+id/bubble"
+            style="@style/ease_chat_row_send_bubble_style"
+            app:layout_constraintEnd_toStartOf="@id/iv_userhead"
+            app:layout_constraintTop_toBottomOf="@id/tv_userid"
+            app:layout_constraintBottom_toTopOf="@id/timestamp"
+            app:layout_goneMarginEnd="@dimen/ease_size_12">
+
+            <TextView
+                android:id="@+id/tv_chatcontent"
+                style="@style/ease_chat_row_send_text_content_style"
+                app:layout_constraintBottom_toBottomOf="parent"
+                app:layout_constraintEnd_toStartOf="@id/iv_call_icon"
+                app:layout_constraintHorizontal_bias="1"
+                app:layout_constraintStart_toStartOf="parent"
+                app:layout_constraintTop_toTopOf="parent"
+                android:layout_marginBottom="@dimen/ease_size_7"
+                android:layout_marginEnd="@dimen/ease_size_0"
+                tools:text="Hello, Agora Chat!" />
+
+            <androidx.appcompat.widget.AppCompatImageView
+                android:id="@+id/iv_call_icon"
+                android:layout_width="wrap_content"
+                android:layout_height="wrap_content"
+                android:layout_marginEnd="@dimen/ease_size_9"
+                android:layout_marginStart="@dimen/ease_size_6"
+                app:layout_constraintStart_toEndOf="@id/tv_chatcontent"
+                app:layout_constraintEnd_toEndOf="parent"
+                app:layout_constraintTop_toTopOf="parent"
+                app:layout_constraintBottom_toBottomOf="parent"
+                app:tint="@color/ease_color_text_on_container"
+                android:src="@drawable/d_chat_voice_call" />
+
+        </androidx.constraintlayout.widget.ConstraintLayout>
+
+        <ImageView
+            android:id="@+id/msg_status"
+            style="@style/ease_chat_row_sent_iv_fail_style"
+            app:layout_constraintBottom_toBottomOf="@id/bubble"
+            app:layout_constraintEnd_toStartOf="@id/bubble" />
+
+        <TextView
+            android:id="@+id/tv_ack"
+            style="@style/ease_chat_row_send_status_ack_style"
+            app:layout_constraintBottom_toBottomOf="@id/bubble"
+            app:layout_constraintEnd_toStartOf="@id/bubble" />
+
+        <TextView
+            android:id="@+id/tv_delivered"
+            style="@style/ease_chat_row_send_status_delivered_style"
+            app:layout_constraintBottom_toBottomOf="@id/bubble"
+            app:layout_constraintEnd_toStartOf="@id/bubble" />
+
+        <ProgressBar
+            android:id="@+id/progress_bar"
+            app:layout_constraintBottom_toBottomOf="@id/bubble"
+            app:layout_constraintEnd_toStartOf="@id/bubble"
+            style="@style/ease_chat_row_send_progress_style" />
+
+        <TextView
+            android:id="@+id/tv_userid"
+            style="@style/ease_chat_row_text_name_style"
+            app:layout_constraintTop_toTopOf="parent"
+            app:layout_constraintBottom_toTopOf="@id/bubble"
+            app:layout_constraintEnd_toEndOf="@id/bubble"
+            tools:text="som"/>
+
+        <TextView
+            android:id="@+id/timestamp"
+            style="@style/ease_chat_row_text_date_style"
+            app:layout_constraintEnd_toEndOf="@id/bubble"
+            app:layout_constraintTop_toBottomOf="@id/bubble"
+            app:layout_constraintBottom_toBottomOf="parent"
+            tools:text="11-03, 8:41"/>
+
+    </androidx.constraintlayout.widget.ConstraintLayout>
+
+</LinearLayout>
\ No newline at end of file
diff --git a/app-kotlin/src/main/res/layout/demo_splash_activity.xml b/app-kotlin/src/main/res/layout/demo_splash_activity.xml
new file mode 100644
index 00000000..a4c2f94e
--- /dev/null
+++ b/app-kotlin/src/main/res/layout/demo_splash_activity.xml
@@ -0,0 +1,34 @@
+<?xml version="1.0" encoding="utf-8"?>
+<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
+    android:layout_width="match_parent"
+    android:layout_height="match_parent">
+
+    <ImageView
+        android:id="@+id/iv_splash"
+        style="@style/splash_iv_bg_style" />
+
+    <LinearLayout
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        android:layout_gravity="center"
+        android:orientation="vertical">
+
+        <ImageView
+            android:id="@+id/iv_logo"
+            android:layout_width="100dp"
+            android:layout_height="100dp"
+            android:layout_gravity="center"
+            android:src="@drawable/icon_logo"/>
+
+        <TextView
+            android:text="@string/splash_title"
+            style="@style/splash_brand_text_style" />
+
+    </LinearLayout>
+
+    <TextView
+        android:id="@+id/tv_product"
+        android:text="@string/splash_powered"
+        style="@style/splash_powered_text_style" />
+
+</FrameLayout>
\ No newline at end of file
diff --git a/app-kotlin/src/main/res/layout/demo_toast_layout.xml b/app-kotlin/src/main/res/layout/demo_toast_layout.xml
new file mode 100644
index 00000000..7e602263
--- /dev/null
+++ b/app-kotlin/src/main/res/layout/demo_toast_layout.xml
@@ -0,0 +1,58 @@
+<?xml version="1.0" encoding="utf-8"?>
+<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
+    android:layout_width="240dp"
+    android:layout_height="wrap_content"
+    android:minWidth="240dp"
+    xmlns:app="http://schemas.android.com/apk/res-auto"
+    xmlns:tools="http://schemas.android.com/tools"
+    android:background="@drawable/demo_toast_bg">
+
+    <ImageView
+        android:id="@+id/iv_toast"
+        android:layout_width="41dp"
+        android:layout_height="41dp"
+        app:layout_constraintLeft_toLeftOf="parent"
+        app:layout_constraintRight_toRightOf="parent"
+        app:layout_constraintTop_toTopOf="parent"
+        android:layout_marginTop="20dp"
+        tools:src="@drawable/em_toast_fail"/>
+
+    <TextView
+        android:id="@+id/tv_toast_title"
+        android:layout_width="0dp"
+        android:layout_height="wrap_content"
+        app:layout_constraintLeft_toLeftOf="parent"
+        app:layout_constraintRight_toRightOf="parent"
+        app:layout_constraintTop_toBottomOf="@id/iv_toast"
+        app:layout_constraintBottom_toTopOf="@id/tv_toast_content"
+        android:layout_marginTop="20dp"
+        android:layout_marginLeft="20dp"
+        android:layout_marginRight="20dp"
+        android:gravity="center"
+        android:maxLines="1"
+        android:ellipsize="end"
+        tools:text="登录成功"
+        android:textSize="14sp"
+        android:textColor="@color/em_toast_color_text"/>
+
+    <TextView
+        android:id="@+id/tv_toast_content"
+        android:layout_width="0dp"
+        android:layout_height="wrap_content"
+        app:layout_constraintLeft_toLeftOf="parent"
+        app:layout_constraintRight_toRightOf="parent"
+        app:layout_constraintTop_toBottomOf="@id/tv_toast_title"
+        app:layout_constraintBottom_toBottomOf="parent"
+        android:layout_marginTop="5dp"
+        app:layout_goneMarginTop="20dp"
+        android:layout_marginBottom="20dp"
+        android:layout_marginLeft="20dp"
+        android:layout_marginRight="20dp"
+        android:maxLines="2"
+        android:ellipsize="end"
+        android:gravity="center"
+        tools:text="数量多费劲死了数量的解放了了深刻积分数量的房间"
+        android:textSize="14sp"
+        android:textColor="@color/em_toast_color_text"/>
+
+</androidx.constraintlayout.widget.ConstraintLayout>
\ No newline at end of file
diff --git a/app-kotlin/src/main/res/layout/ease_layout_language_item.xml b/app-kotlin/src/main/res/layout/ease_layout_language_item.xml
new file mode 100644
index 00000000..1d184c28
--- /dev/null
+++ b/app-kotlin/src/main/res/layout/ease_layout_language_item.xml
@@ -0,0 +1,41 @@
+<?xml version="1.0" encoding="utf-8"?>
+<androidx.constraintlayout.widget.ConstraintLayout
+    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:background="@color/ease_color_background"
+    android:layout_width="match_parent"
+    android:layout_height="wrap_content">
+
+    <TextView
+        android:padding="16dp"
+        android:id="@+id/language_tag"
+        style="@style/ease_report_item_tv"
+        app:layout_constraintTop_toTopOf="parent"
+        app:layout_constraintStart_toStartOf="parent"
+        app:layout_constraintEnd_toStartOf="@id/language_cb"
+        android:layout_width="0dp"
+        android:layout_height="wrap_content"
+        tools:text="reason"/>
+
+    <CheckBox
+        android:id="@+id/language_cb"
+        android:layout_marginEnd="16dp"
+        app:layout_constraintTop_toTopOf="@+id/language_tag"
+        app:layout_constraintBottom_toBottomOf="@+id/language_tag"
+        app:layout_constraintStart_toEndOf="@id/language_tag"
+        app:layout_constraintEnd_toEndOf="parent"
+        style="@style/ease_report_item_checkbox"
+        android:layout_width="20dp"
+        android:layout_height="20dp"/>
+
+    <View
+        android:id="@+id/view_divider"
+        android:layout_marginStart="16dp"
+        style="@style/ease_list_item_divider"
+        app:layout_constraintLeft_toLeftOf="parent"
+        app:layout_constraintRight_toRightOf="parent"
+        app:layout_constraintBottom_toBottomOf="parent"
+        android:layout_marginTop="15dp"/>
+
+</androidx.constraintlayout.widget.ConstraintLayout>
\ No newline at end of file
diff --git a/app-kotlin/src/main/res/menu/bottom_main_nav_menu.xml b/app-kotlin/src/main/res/menu/bottom_main_nav_menu.xml
new file mode 100644
index 00000000..89c9873f
--- /dev/null
+++ b/app-kotlin/src/main/res/menu/bottom_main_nav_menu.xml
@@ -0,0 +1,21 @@
+<?xml version="1.0" encoding="utf-8"?>
+<menu xmlns:tools="http://schemas.android.com/tools"
+    xmlns:android="http://schemas.android.com/apk/res/android"
+    tools:ignore="MissingDefaultResource">
+
+    <item
+        android:id="@+id/em_main_nav_home"
+        android:icon="@drawable/demo_main_tab_conversation_selector"
+        android:title="@string/em_main_title_home" />
+
+    <item
+        android:id="@+id/em_main_nav_friends"
+        android:icon="@drawable/demo_main_tab_friends_selector"
+        android:title="@string/em_main_title_friends" />
+
+    <item
+        android:id="@+id/em_main_nav_me"
+        android:icon="@drawable/demo_main_tab_me_selector"
+        android:title="@string/em_main_title_me" />
+
+</menu>
diff --git a/app-kotlin/src/main/res/menu/demo_chat_menu.xml b/app-kotlin/src/main/res/menu/demo_chat_menu.xml
new file mode 100644
index 00000000..58c8fc53
--- /dev/null
+++ b/app-kotlin/src/main/res/menu/demo_chat_menu.xml
@@ -0,0 +1,15 @@
+<?xml version="1.0" encoding="utf-8"?>
+<menu xmlns:tools="http://schemas.android.com/tools"
+    xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:app="http://schemas.android.com/apk/res-auto"
+    tools:ignore="MissingDefaultResource">
+
+    <item
+        android:id="@+id/chat_menu_video_call"
+        android:icon="@drawable/video_call"
+        android:title="@string/menu_video_call"
+        android:visible="true"
+        android:orderInCategory="2"
+        app:showAsAction="ifRoom" />
+
+</menu>
\ No newline at end of file
diff --git a/app-kotlin/src/main/res/menu/demo_conference_invite_menu.xml b/app-kotlin/src/main/res/menu/demo_conference_invite_menu.xml
new file mode 100644
index 00000000..66e458b1
--- /dev/null
+++ b/app-kotlin/src/main/res/menu/demo_conference_invite_menu.xml
@@ -0,0 +1,12 @@
+<?xml version="1.0" encoding="utf-8"?>
+<menu
+    xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:app="http://schemas.android.com/apk/res-auto">
+
+    <item
+        android:id="@+id/chat_menu_member_call"
+        android:title="@string/menu_member_call"
+        android:visible="true"
+        app:showAsAction="ifRoom" />
+
+</menu>
\ No newline at end of file
diff --git a/app-kotlin/src/main/res/menu/demo_language_menu_confirm.xml b/app-kotlin/src/main/res/menu/demo_language_menu_confirm.xml
new file mode 100644
index 00000000..fc628aee
--- /dev/null
+++ b/app-kotlin/src/main/res/menu/demo_language_menu_confirm.xml
@@ -0,0 +1,11 @@
+<?xml version="1.0" encoding="utf-8"?>
+<menu xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:app="http://schemas.android.com/apk/res-auto">
+
+    <item
+        android:id="@+id/action_language_confirm"
+        android:title="@string/currency_language_confirm"
+        android:visible="true"
+        app:showAsAction="ifRoom" />
+
+</menu>
\ No newline at end of file
diff --git a/app-kotlin/src/main/res/menu/demo_server_set_menu.xml b/app-kotlin/src/main/res/menu/demo_server_set_menu.xml
new file mode 100644
index 00000000..d00708ef
--- /dev/null
+++ b/app-kotlin/src/main/res/menu/demo_server_set_menu.xml
@@ -0,0 +1,11 @@
+<?xml version="1.0" encoding="utf-8"?>
+<menu xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:app="http://schemas.android.com/apk/res-auto">
+
+    <item
+        android:id="@+id/action_server_set_save"
+        android:orderInCategory="100"
+        android:title="@string/server_set_menu_save"
+        app:showAsAction="ifRoom"/>
+
+</menu>
\ No newline at end of file
diff --git a/app-kotlin/src/main/res/mipmap-anydpi-v26/ic_launcher.xml b/app-kotlin/src/main/res/mipmap-anydpi-v26/ic_launcher.xml
new file mode 100644
index 00000000..6f3b755b
--- /dev/null
+++ b/app-kotlin/src/main/res/mipmap-anydpi-v26/ic_launcher.xml
@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="utf-8"?>
+<adaptive-icon xmlns:android="http://schemas.android.com/apk/res/android">
+    <background android:drawable="@drawable/ic_launcher_background" />
+    <foreground android:drawable="@drawable/ic_launcher_foreground" />
+    <monochrome android:drawable="@drawable/ic_launcher_foreground" />
+</adaptive-icon>
\ No newline at end of file
diff --git a/app-kotlin/src/main/res/mipmap-anydpi-v26/ic_launcher_round.xml b/app-kotlin/src/main/res/mipmap-anydpi-v26/ic_launcher_round.xml
new file mode 100644
index 00000000..6f3b755b
--- /dev/null
+++ b/app-kotlin/src/main/res/mipmap-anydpi-v26/ic_launcher_round.xml
@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="utf-8"?>
+<adaptive-icon xmlns:android="http://schemas.android.com/apk/res/android">
+    <background android:drawable="@drawable/ic_launcher_background" />
+    <foreground android:drawable="@drawable/ic_launcher_foreground" />
+    <monochrome android:drawable="@drawable/ic_launcher_foreground" />
+</adaptive-icon>
\ No newline at end of file
diff --git a/app-kotlin/src/main/res/mipmap-hdpi/demo_launcher.png b/app-kotlin/src/main/res/mipmap-hdpi/demo_launcher.png
new file mode 100644
index 00000000..470f622d
Binary files /dev/null and b/app-kotlin/src/main/res/mipmap-hdpi/demo_launcher.png differ
diff --git a/app-kotlin/src/main/res/mipmap-hdpi/ic_launcher.webp b/app-kotlin/src/main/res/mipmap-hdpi/ic_launcher.webp
new file mode 100644
index 00000000..c209e78e
Binary files /dev/null and b/app-kotlin/src/main/res/mipmap-hdpi/ic_launcher.webp differ
diff --git a/app-kotlin/src/main/res/mipmap-hdpi/ic_launcher_round.webp b/app-kotlin/src/main/res/mipmap-hdpi/ic_launcher_round.webp
new file mode 100644
index 00000000..b2dfe3d1
Binary files /dev/null and b/app-kotlin/src/main/res/mipmap-hdpi/ic_launcher_round.webp differ
diff --git a/app-kotlin/src/main/res/mipmap-mdpi/demo_launcher.png b/app-kotlin/src/main/res/mipmap-mdpi/demo_launcher.png
new file mode 100644
index 00000000..22c34228
Binary files /dev/null and b/app-kotlin/src/main/res/mipmap-mdpi/demo_launcher.png differ
diff --git a/app-kotlin/src/main/res/mipmap-mdpi/ic_launcher.webp b/app-kotlin/src/main/res/mipmap-mdpi/ic_launcher.webp
new file mode 100644
index 00000000..4f0f1d64
Binary files /dev/null and b/app-kotlin/src/main/res/mipmap-mdpi/ic_launcher.webp differ
diff --git a/app-kotlin/src/main/res/mipmap-mdpi/ic_launcher_round.webp b/app-kotlin/src/main/res/mipmap-mdpi/ic_launcher_round.webp
new file mode 100644
index 00000000..62b611da
Binary files /dev/null and b/app-kotlin/src/main/res/mipmap-mdpi/ic_launcher_round.webp differ
diff --git a/app-kotlin/src/main/res/mipmap-xhdpi/demo_launcher.png b/app-kotlin/src/main/res/mipmap-xhdpi/demo_launcher.png
new file mode 100644
index 00000000..b30e6af3
Binary files /dev/null and b/app-kotlin/src/main/res/mipmap-xhdpi/demo_launcher.png differ
diff --git a/app-kotlin/src/main/res/mipmap-xhdpi/ic_launcher.webp b/app-kotlin/src/main/res/mipmap-xhdpi/ic_launcher.webp
new file mode 100644
index 00000000..948a3070
Binary files /dev/null and b/app-kotlin/src/main/res/mipmap-xhdpi/ic_launcher.webp differ
diff --git a/app-kotlin/src/main/res/mipmap-xhdpi/ic_launcher_round.webp b/app-kotlin/src/main/res/mipmap-xhdpi/ic_launcher_round.webp
new file mode 100644
index 00000000..1b9a6956
Binary files /dev/null and b/app-kotlin/src/main/res/mipmap-xhdpi/ic_launcher_round.webp differ
diff --git a/app-kotlin/src/main/res/mipmap-xxhdpi/demo_launcher.png b/app-kotlin/src/main/res/mipmap-xxhdpi/demo_launcher.png
new file mode 100644
index 00000000..0ab41bc0
Binary files /dev/null and b/app-kotlin/src/main/res/mipmap-xxhdpi/demo_launcher.png differ
diff --git a/app-kotlin/src/main/res/mipmap-xxhdpi/ic_launcher.webp b/app-kotlin/src/main/res/mipmap-xxhdpi/ic_launcher.webp
new file mode 100644
index 00000000..28d4b77f
Binary files /dev/null and b/app-kotlin/src/main/res/mipmap-xxhdpi/ic_launcher.webp differ
diff --git a/app-kotlin/src/main/res/mipmap-xxhdpi/ic_launcher_round.webp b/app-kotlin/src/main/res/mipmap-xxhdpi/ic_launcher_round.webp
new file mode 100644
index 00000000..9287f508
Binary files /dev/null and b/app-kotlin/src/main/res/mipmap-xxhdpi/ic_launcher_round.webp differ
diff --git a/app-kotlin/src/main/res/mipmap-xxxhdpi/ic_launcher.webp b/app-kotlin/src/main/res/mipmap-xxxhdpi/ic_launcher.webp
new file mode 100644
index 00000000..aa7d6427
Binary files /dev/null and b/app-kotlin/src/main/res/mipmap-xxxhdpi/ic_launcher.webp differ
diff --git a/app-kotlin/src/main/res/mipmap-xxxhdpi/ic_launcher_round.webp b/app-kotlin/src/main/res/mipmap-xxxhdpi/ic_launcher_round.webp
new file mode 100644
index 00000000..9126ae37
Binary files /dev/null and b/app-kotlin/src/main/res/mipmap-xxxhdpi/ic_launcher_round.webp differ
diff --git a/app-kotlin/src/main/res/values-night/colors.xml b/app-kotlin/src/main/res/values-night/colors.xml
new file mode 100644
index 00000000..7ed75ec2
--- /dev/null
+++ b/app-kotlin/src/main/res/values-night/colors.xml
@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?>
+<resources>
+    <color name="demo_login_button_bg_start">#009EFF</color>
+    <color name="demo_login_button_bg_end">#334BFF</color>
+</resources>
\ No newline at end of file
diff --git a/app-kotlin/src/main/res/values-night/styles.xml b/app-kotlin/src/main/res/values-night/styles.xml
new file mode 100644
index 00000000..0997e2f4
--- /dev/null
+++ b/app-kotlin/src/main/res/values-night/styles.xml
@@ -0,0 +1,39 @@
+<?xml version="1.0" encoding="utf-8"?>
+<resources>
+    <style name="splash_iv_bg_style">
+        <item name="android:layout_width">match_parent</item>
+        <item name="android:layout_height">match_parent</item>
+        <item name="android:scaleType">centerCrop</item>
+        <item name="android:src">@drawable/splash_bg_dark</item>
+    </style>
+
+    <style name="splash_brand_text_style">
+        <item name="android:layout_width">wrap_content</item>
+        <item name="android:layout_height">wrap_content</item>
+        <item name="android:layout_gravity">center</item>
+        <item name="android:layout_marginTop">@dimen/ease_size_35</item>
+        <item name="android:textAppearance">@style/Ease.TextAppearance.Body.Large</item>
+        <item name="android:textColor">@color/ease_color_primary</item>
+    </style>
+
+    <style name="splash_powered_text_style">
+        <item name="android:layout_width">wrap_content</item>
+        <item name="android:layout_height">wrap_content</item>
+        <item name="android:layout_gravity">bottom|center</item>
+        <item name="android:layout_marginBottom">60dp</item>
+        <item name="android:textColor">@color/ease_color_text_secondary</item>
+    </style>
+
+    <style name="em_login_btn">
+        <item name="android:layout_width">0dp</item>
+        <item name="android:layout_height">wrap_content</item>
+        <item name="android:layout_marginTop">@dimen/ease_size_24</item>
+        <item name="android:layout_marginLeft">@dimen/ease_size_30</item>
+        <item name="android:layout_marginRight">@dimen/ease_size_30</item>
+        <item name="android:background">@drawable/demo_login_btn_bg</item>
+        <item name="android:textColor">@color/ease_color_text_title</item>
+        <item name="android:enabled">false</item>
+        <item name="android:textAppearance">@style/Ease.TextAppearance.Headline.Small</item>
+    </style>
+
+</resources>
\ No newline at end of file
diff --git a/app-kotlin/src/main/res/values-night/themes.xml b/app-kotlin/src/main/res/values-night/themes.xml
new file mode 100644
index 00000000..46dfc904
--- /dev/null
+++ b/app-kotlin/src/main/res/values-night/themes.xml
@@ -0,0 +1,8 @@
+<resources xmlns:tools="http://schemas.android.com/tools">
+    <!-- Base application theme. -->
+    <style name="Base.Theme.Easeui" parent="Theme.Material3.DayNight.NoActionBar">
+        <!-- Customize your dark theme here. -->
+        <!-- <item name="colorPrimary">@color/my_dark_primary</item> -->
+        <item name="android:navigationBarColor">@color/ease_color_background</item>
+    </style>
+</resources>
\ No newline at end of file
diff --git a/app-kotlin/src/main/res/values/colors.xml b/app-kotlin/src/main/res/values/colors.xml
new file mode 100644
index 00000000..4dad7cee
--- /dev/null
+++ b/app-kotlin/src/main/res/values/colors.xml
@@ -0,0 +1,28 @@
+<?xml version="1.0" encoding="utf-8"?>
+<resources>
+    <color name="black">#FF000000</color>
+    <color name="white">#FFFFFFFF</color>
+    <color name="gray">#ffe9e9e9</color>
+
+    <color name="transparent">@android:color/transparent</color>
+
+    <color name="em_toast_color_bg">#99000000</color>
+    <color name="em_toast_color_text">@color/white</color>
+
+    <color name="color_primary">@color/ease_color_primary</color>
+    <color name="color_text_primary">@color/ease_color_text_primary</color>
+    <color name="demo_title">@color/ease_color_on_background_low</color>
+    <color name="demo_desc_bg">@color/ease_color_spacing_view</color>
+    <color name="demo_subtitle">@color/ease_color_text_secondary_high</color>
+    <color name="demo_background">@color/ease_color_background</color>
+    <color name="demo_on_background_high">@color/ease_color_on_background_high</color>
+
+
+    <color name="demo_login_button_bg_start">#009EFF</color>
+    <color name="demo_login_button_bg_end">#334BFF</color>
+
+    <color name="em_main_color_tab_normal">@color/ease_color_on_background_high</color>
+    <color name="em_main_color_tab_selected">@color/ease_color_primary</color>
+
+
+</resources>
\ No newline at end of file
diff --git a/app-kotlin/src/main/res/values/dimens.xml b/app-kotlin/src/main/res/values/dimens.xml
new file mode 100644
index 00000000..95ec4588
--- /dev/null
+++ b/app-kotlin/src/main/res/values/dimens.xml
@@ -0,0 +1,22 @@
+<?xml version="1.0" encoding="utf-8"?>
+<resources>
+
+    <dimen name="demo_login_bg_radius">57dp</dimen>
+    <dimen name="demo_login_margin_left">33dp</dimen>
+    <dimen name="demo_login_margin_right">33dp</dimen>
+    <dimen name="demo_login_margin_top">20dp</dimen>
+    <dimen name="demo_login_padding_left">18dp</dimen>
+    <dimen name="demo_login_padding_right">18dp</dimen>
+    <dimen name="demo_login_input_bg_radius">24dp</dimen>
+
+    <dimen name="demo_size_small">12sp</dimen>
+    <dimen name="demo_size_normal">14sp</dimen>
+    <dimen name="demo_size_big">16sp</dimen>
+    <dimen name="demo_size_big_notify">18sp</dimen>
+
+
+    <dimen name="demo_login_text_size">@dimen/demo_size_big</dimen>
+    <dimen name="em_title_bar_status_icon_size">14dp</dimen>
+
+
+</resources>
\ No newline at end of file
diff --git a/app-kotlin/src/main/res/values/ids.xml b/app-kotlin/src/main/res/values/ids.xml
new file mode 100644
index 00000000..f01dd29f
--- /dev/null
+++ b/app-kotlin/src/main/res/values/ids.xml
@@ -0,0 +1,26 @@
+<?xml version="1.0" encoding="utf-8"?>
+<resources>
+
+    <!-- chat -->
+    <item name="chat_video_call_voice" type="id"/>
+    <item name="chat_video_call_video" type="id"/>
+
+    <item name="about_information_camera" type="id"/>
+    <item name="about_information_picture" type="id"/>
+
+    <!-- detail menu id -->
+    <!-- audio -->
+    <item name="contact_item_audio_call" type="id"/>
+    <!-- video -->
+    <item name="contact_item_video_call" type="id"/>
+    <!-- conference -->
+    <item name="group_item_voice_call" type="id"/>
+    <item name="group_item_video_call" type="id"/>
+
+    <!-- presence menu id -->
+    <item name="presence_status_online" type="id"/>
+    <item name="presence_status_busy" type="id"/>
+    <item name="presence_status_do_not_disturb" type="id"/>
+    <item name="presence_status_away" type="id"/>
+    <item name="presence_status_custom" type="id"/>
+</resources>
\ No newline at end of file
diff --git a/app-kotlin/src/main/res/values/strings.xml b/app-kotlin/src/main/res/values/strings.xml
new file mode 100644
index 00000000..8e87f641
--- /dev/null
+++ b/app-kotlin/src/main/res/values/strings.xml
@@ -0,0 +1,154 @@
+<resources xmlns:tools="http://schemas.android.com/tools">
+    <string name="app_name" translatable="false">Agora Chat</string>
+
+    <string name="cancel" translatable="false">Cancel</string>
+    <string name="confirm" translatable="false">OK</string>
+    <string name="loading" translatable="false">Loading&#8230;</string>
+    <string name="splash_title" translatable="false">Agora Chat</string>
+    <string name="splash_powered" translatable="false">Powered by Agora</string>
+
+    <string name="system_copy_success" translatable="false">Successfully copied to clipboard</string>
+    <string name="em_main_add_contact_success" translatable="false">Request sent.</string>
+    <string name="em_main_add_contact_not_found" translatable="false">User does not exist</string>
+
+    <string name="splash_not_appkey" translatable="false">Please set up the app key first.</string>
+    <string name="splash_not_init" translatable="false">Please initialize the Chat SDK first.</string>
+
+    <string name="demo_login_im" translatable="false">Login</string>
+    <string name="demo_login_username" translatable="false">Username</string>
+    <string name="demo_login_password" translatable="false">Password</string>
+    <string name="demo_login_btn" translatable="false">Log In</string>
+    <string name="demo_login_agreement" translatable="false">You will be registered as a new user \n upon your first login.</string>
+    <string name="demo_login_server_configure" translatable="false"><u>Server Configure</u></string>
+
+    <string name="em_login_btn_info_incomplete" translatable="false">Username or password cannot be empty.</string>
+    <string name="em_login_not_select_agreement" translatable="false">Please confirm Terms &amp; Policy</string>
+    <string name="demo_error_user_authentication_failed" translatable="false">Incorrect username or password</string>
+
+
+    <string name="server_close_develop_mode" translatable="false">Close develop mode?</string>
+    <string name="server_open_develop_mode" translatable="false">Open develop mode?</string>
+    <string name="server_set_title" translatable="false">Server settings</string>
+    <string name="server_set_appkey" translatable="false">Appkey</string>
+    <string name="server_set_apns_cert_name" translatable="false">APNs certificate name</string>
+    <string name="server_set_specify_server" translatable="false">Use private server:</string>
+    <string name="server_set_server_address" translatable="false">IM server address</string>
+    <string name="server_set_server_port" translatable="false">Port</string>
+    <string name="server_set_rest_server_address" translatable="false">RESTful server address</string>
+    <string name="em_login_server_configure" translatable="false"><u>Server Configure</u></string>
+
+    <string name="server_set_menu_save" translatable="false">Save</string>
+    <string name="server_set_dialog_title" translatable="false">Reset App</string>
+    <string name="server_set_dialog_content" translatable="false">The current server settings need to be restarted to take effect.Confirm restart?</string>
+    <string name="server_set_dialog_confirm_button_text" translatable="false">Reset</string>
+    <string name="server_set_illegal_appkey" translatable="false">You set a illegal appkey</string>
+
+    <string name="em_main_title_home" translatable="false">Chat</string>
+    <string name="em_main_title_friends" translatable="false">Contacts</string>
+    <string name="em_main_title_me" translatable="false">Me</string>
+
+    <string name="menu_voice_call" translatable="false">Voice</string>
+    <string name="menu_video_call" translatable="false">Video</string>
+    <string name="menu_member_call" translatable="false">Call(%1$d)</string>
+
+    <string name="about_logo" translatable="false">Agora Chat</string>
+    <string name="about_version" translatable="false">SDK Version %1$s</string>
+    <string name="about_uikit_version" translatable="false">UIKit Version %1$s</string>
+
+    <string name="main_about_me_information" translatable="false">Profile</string>
+    <string name="main_about_me_information_avatar" translatable="false">Avatar</string>
+    <string name="main_about_me_information_nick_name" translatable="false">Nickname</string>
+    <string name="main_about_me_information_camera" translatable="false">Camera</string>
+    <string name="main_about_me_information_picture" translatable="false">Picture</string>
+    <string name="main_about_me_information_edit_picture" translatable="false">Do you need to edit the Image?</string>
+    <string name="main_about_me_information_edit_nick_name" translatable="false">Nickname</string>
+    <string name="main_about_me_information_change_name_count" translatable="false">%1$d/32</string>
+    <string name="main_information_checked_model" translatable="false">Uploading avatars is not supported in this mode</string>
+
+    <string name="message_forward_success" translatable="false">Message forwarded successfully</string>
+    <string name="message_forward_fail" translatable="false">Message forwarding failed</string>
+    <string name="message_modify_fail" translatable="false">Message modifying failed</string>
+    <string name="message_combine_success" translatable="false">Combine Message successfully</string>
+    <string name="message_combine_fail" translatable="false">Combine Message failed</string>
+
+    <string name="main_about_me_currency" translatable="false">General</string>
+    <string name="main_about_me_privacy" translatable="false">Privacy</string>
+    <string name="main_about_me_about" translatable="false">About</string>
+    <string name="main_about_me_login" translatable="false">Account</string>
+    <string name="main_about_me_logout" translatable="false">Log Out</string>
+
+    <string name="main_about_me_id" translatable="false">ID: %1$s</string>
+    <string name="demo_login_out_hint" translatable="false">Log Out?</string>
+
+    <string name="main_about_me_notify" translatable="false">Message Notifications</string>
+    <string name="main_about_me_notify_title" translatable="false">Offline Message Push</string>
+    <string name="main_about_me_notify_describe" translatable="false">After turning on, you will no longer receive any message notifications except for messages where you are @mentioned in the group.</string>
+
+    <!--dialog-->
+    <string name="demo_login_dialog_content" translatable="false">Agora attaches great importance to protecting your privacy. Please read the following Service and Privacy Policy carefully. Please click "OK" button to agree, and click "Deny" to exit the app.</string>
+    <string name="demo_login_dialog_content_privacy" translatable="false">Read the complete Service and Privacy Policy for more details.</string>
+    <string name="demo_login_dialog_title" translatable="false">Service and Privacy Policy</string>
+    <string name="demo_login_dialog_confirm" translatable="false">OK</string>
+    <string name="demo_login_dialog_cancel" translatable="false">Deny</string>
+
+    <!-- callkit -->
+    <string name="call_duration" translatable="false">Call duration: %1$s</string>
+    <string name="video_call" translatable="false">Video Call</string>
+    <string name="voice_call" translatable="false">Voice Call</string>
+    <string name="demo_call_end_reason_refuse">Request declined</string>
+    <string name="demo_call_end_reason_busy">The line is busy</string>
+    <string name="demo_call_end_reason_busy_remote_no_response">No response</string>
+    <string name="demo_call_end_reason_other_device_refused">Other devices declined</string>
+    <string name="demo_call_end_reason_other_device_agreed">Other devices connected</string>
+    <string name="tips_select_contacts_first" translatable="false">Select a contact first</string>
+    <string name="group_call_title" translatable="false">Select Members</string>
+    <string name="demo_activity_label_video_call" translatable="false">video_call</string>
+    <string name="demo_activity_label_multi_call" translatable="false">multi_call</string>
+
+    <!-- contact detail -->
+    <string name="detail_item_audio" translatable="false">Audio</string>
+    <string name="detail_item_video" translatable="false">Video</string>
+    <string name="demo_contact_added_notify" translatable="false">You have added %1$s as a contact.</string>
+
+    <string name="main_about_me_setting" translatable="false">Settings</string>
+
+    <!--presence-->
+    <string name="presence_status" translatable="false">User Status</string>
+    <string name="ease_presence_online" translatable="false">Online</string>
+    <string name="ease_presence_busy" translatable="false">Busy</string>
+    <string name="ease_presence_do_not_disturb" translatable="false">Do not Disturb</string>
+    <string name="ease_presence_away" translatable="false">Away</string>
+    <string name="ease_presence_offline" translatable="false">Offline</string>
+    <string name="ease_presence_custom" translatable="false">Custom Status</string>
+    <string name="ease_presence_status" translatable="false">Status</string>
+    <string name="ease_presence_done" translatable="false">Done</string>
+    <string name="presence_dialog_title" translatable="false">Customize online status</string>
+    <string name="presence_dialog_input_hint" translatable="false">Please enter</string>
+
+    <string name="about_official_website" translatable="false">Agora Chat Documentation</string>
+    <string name="about_official_website_url" translatable="false">docs.agora.io/en/agora-chat</string>
+    <string name="about_sales_title" translatable="false">Contact sales</string>
+    <string name="about_sales_subtitle" translatable="false">agora.io/en/talk-to-us/</string>
+    <string name="about_demo_app_github_repo_title" translatable="false">Demo app github repo</string>
+    <string name="about_demo_app_github_repo_subtitle" translatable="false">github.com/AgoraIO/Agora-Chat-API-Examples</string>
+    <string name="about_more_title" translatable="false">More</string>
+    <string name="about_more_subtitle" translatable="false">agora.io</string>
+
+    <string name="main_about_me_currency_dark_model">Dark Mode</string>
+    <string name="main_about_me_currency_feature">Advanced Features</string>
+
+    <string name="currency_target_language">Target Language</string>
+    <string name="currency_language_zh_cn">Simplified Chinese</string>
+    <string name="currency_language_en">English</string>
+    <string name="currency_language_confirm">Done</string>
+
+    <string name="main_about_me_currency_typing">onTyping</string>
+    <string name="main_about_me_currency_typing_desc">After opening, the other party will see your input status</string>
+    <string name="currency_feature_translation">Translation</string>
+    <string name="currency_feature_translation_describe">Long press a message to translate it to the mobile system language</string>
+    <string name="currency_feature_topic">Thread</string>
+    <string name="currency_feature_topic_describe">Create a thread from a message within the group</string>
+    <string name="currency_feature_reaction">Emoji Reaction</string>
+    <string name="currency_feature_reaction_describe">Long press a message to add emoji reactions</string>
+
+</resources>
\ No newline at end of file
diff --git a/app-kotlin/src/main/res/values/styles.xml b/app-kotlin/src/main/res/values/styles.xml
new file mode 100644
index 00000000..681bd1d1
--- /dev/null
+++ b/app-kotlin/src/main/res/values/styles.xml
@@ -0,0 +1,187 @@
+<?xml version="1.0" encoding="utf-8"?>
+<resources>
+
+    <style name="em_main_badge_tv">
+        <item name="android:layout_width">wrap_content</item>
+        <item name="android:layout_height">wrap_content</item>
+        <item name="android:layout_marginTop">@dimen/ease_size_3</item>
+        <item name="android:layout_marginLeft">@dimen/ease_size_20</item>
+        <item name="android:layout_marginStart">@dimen/ease_size_20</item>
+        <item name="android:background">@drawable/demo_main_unread_count_bg</item>
+        <item name="android:visibility">invisible</item>
+        <item name="android:textColor">@color/ease_color_text_primary</item>
+        <item name="android:textAppearance">@style/Ease.TextAppearance.Body.Small</item>
+        <item name="android:maxLines">1</item>
+        <item name="android:gravity">center</item>
+        <item name="android:paddingStart">@dimen/ease_size_4</item>
+        <item name="android:paddingEnd">@dimen/ease_size_4</item>
+    </style>
+
+    <style name="splash_iv_bg_style">
+        <item name="android:layout_width">match_parent</item>
+        <item name="android:layout_height">match_parent</item>
+        <item name="android:scaleType">centerCrop</item>
+        <item name="android:src">@drawable/splash_bg_light</item>
+    </style>
+
+    <style name="splash_brand_text_style">
+        <item name="android:layout_width">wrap_content</item>
+        <item name="android:layout_height">wrap_content</item>
+        <item name="android:layout_gravity">center</item>
+        <item name="android:layout_marginTop">@dimen/ease_size_35</item>
+        <item name="android:textSize">24sp</item>
+        <item name="android:textColor">@color/ease_color_primary</item>
+    </style>
+
+    <style name="splash_powered_text_style">
+        <item name="android:layout_width">wrap_content</item>
+        <item name="android:layout_height">wrap_content</item>
+        <item name="android:layout_gravity">bottom|center</item>
+        <item name="android:layout_marginBottom">60dp</item>
+        <item name="android:textColor">@color/ease_color_text_secondary</item>
+    </style>
+
+    <style name="em_login_et_input">
+        <item name="android:layout_width">0dp</item>
+        <item name="android:layout_height">@dimen/ease_size_48</item>
+        <item name="android:layout_marginLeft">@dimen/ease_size_16</item>
+        <item name="android:layout_marginRight">@dimen/ease_size_16</item>
+        <item name="android:maxWidth">400dp</item>
+        <item name="android:background">@drawable/demo_login_et_bg</item>
+        <item name="android:paddingStart">@dimen/ease_size_16</item>
+        <item name="android:paddingEnd">@dimen/ease_size_16</item>
+        <item name="android:textSize">@dimen/demo_login_text_size</item>
+        <item name="android:textAppearance">@style/Ease.TextAppearance.Title.Medium</item>
+        <item name="android:textColor">@color/ease_color_text_on_primary</item>
+        <item name="android:textColorHint">@color/ease_color_text_hint</item>
+        <item name="android:gravity">center_vertical</item>
+        <item name="android:maxLines">1</item>
+        <item name="android:inputType">text</item>
+    </style>
+
+    <style name="em_login_btn">
+        <item name="android:layout_width">0dp</item>
+        <item name="android:layout_height">wrap_content</item>
+        <item name="android:layout_marginTop">@dimen/ease_size_24</item>
+        <item name="android:layout_marginLeft">@dimen/ease_size_30</item>
+        <item name="android:layout_marginRight">@dimen/ease_size_30</item>
+        <item name="android:background">@drawable/demo_login_btn_bg</item>
+        <item name="android:textColor">@color/ease_color_text_title</item>
+        <item name="android:textAppearance">@style/Ease.TextAppearance.Headline.Small</item>
+    </style>
+
+    <style name="main_bottom_view_normal">
+        <item name="android:textColor">@color/em_main_color_tab_normal</item>
+        <item name="android:textSize">12sp</item>
+    </style>
+
+    <style name="main_bottom_view_selected">
+        <item name="android:textColor">@color/em_main_color_tab_selected</item>
+        <item name="android:textSize">12sp</item>
+    </style>
+
+    <style name="contact_detail_arrow_item">
+        <item name="background">@color/ease_color_background</item>
+        <item name="arrowItemTitleSize">16sp</item>
+        <item name="arrowItemTitleStyle">bold</item>
+        <item name="arrowItemTitleColor">@color/ease_contact_arrow_item_title_color</item>
+        <item name="arrowItemShowArrow">true</item>
+        <item name="arrowItemShowDivider">false</item>
+        <item name="arrowItemContentColor">@color/ease_contact_arrow_item_content_color</item>
+    </style>
+
+    <style name="main_about_me_arrow_item">
+        <item name="background">@color/ease_color_background</item>
+        <item name="arrowItemTitleSize">16sp</item>
+        <item name="arrowItemTitleStyle">bold</item>
+        <item name="arrowItemTitleColor">@color/ease_contact_arrow_item_title_color</item>
+        <item name="arrowItemShowAvatar">true</item>
+        <item name="arrowItemShowArrow">true</item>
+        <item name="arrowItemShowDivider">true</item>
+        <item name="arrowItemContentColor">@color/ease_contact_arrow_item_content_color</item>
+    </style>
+
+    <style name="main_about_logout_arrow_item">
+        <item name="background">@color/ease_color_background</item>
+        <item name="arrowItemTitleSize">16sp</item>
+        <item name="arrowItemTitleStyle">bold</item>
+        <item name="arrowItemTitleColor">@color/ease_color_primary</item>
+        <item name="arrowItemShowAvatar">false</item>
+        <item name="arrowItemShowArrow">false</item>
+        <item name="arrowItemShowDivider">true</item>
+        <item name="arrowItemContentColor">@color/ease_contact_arrow_item_content_color</item>
+    </style>
+
+    <style name="main_about_me_information_title">
+        <item name="android:textAppearance">@style/Ease.TextAppearance.Title.Medium</item>
+        <item name="android:textColor">@color/ease_contact_arrow_item_title_color</item>
+    </style>
+
+    <style name="main_about_me_information_subtitle">
+        <item name="android:textAppearance">@style/Ease.TextAppearance.Label.Large</item>
+        <item name="android:textColor">@color/ease_contact_arrow_item_content_color</item>
+    </style>
+
+    <style name="main_about_me_feature_text_describe">
+        <item name="android:background">@color/ease_color_spacing_view</item>
+        <item name="android:textColor">@color/ease_color_text_secondary_high</item>
+        <item name="android:paddingStart">@dimen/ease_size_16</item>
+        <item name="android:paddingEnd">@dimen/ease_size_16</item>
+        <item name="android:paddingTop">@dimen/ease_size_4</item>
+        <item name="android:paddingBottom">@dimen/ease_size_4</item>
+    </style>
+
+    <style name="about_logo">
+        <item name="android:textAppearance">@style/Ease.TextAppearance.Title.Medium</item>
+        <item name="android:textColor">@color/ease_color_on_background_low</item>
+    </style>
+
+    <style name="about_version">
+        <item name="android:textAppearance">@style/Ease.TextAppearance.Label.Medium</item>
+        <item name="android:textColor">@color/ease_color_text_secondary_high</item>
+    </style>
+
+    <style name="about_uikit_version">
+        <item name="android:textAppearance">@style/Ease.TextAppearance.Label.Medium</item>
+        <item name="android:textColor">@color/ease_color_text_secondary_high</item>
+    </style>
+
+    <!-- Currency style -->
+    <style name="currency_switch_item_typing">
+        <item name="background">@color/ease_color_background</item>
+        <item name="switchItemTitleSize">16sp</item>
+        <item name="switchItemTitleStyle">bold</item>
+        <item name="switchItemTitleColor">@color/demo_title</item>
+        <item name="switchItemShowAvatar">false</item>
+        <item name="switchItemShowDivider">true</item>
+    </style>
+
+    <style name="currency_switch_item_dark_mode">
+        <item name="background">@color/ease_color_background</item>
+        <item name="switchItemTitleSize">16sp</item>
+        <item name="switchItemTitleStyle">bold</item>
+        <item name="switchItemTitleColor">@color/demo_title</item>
+        <item name="switchItemShowAvatar">false</item>
+        <item name="switchItemShowDivider">true</item>
+    </style>
+
+    <style name="currency_arrow_item_feature">
+        <item name="background">@color/ease_color_background</item>
+        <item name="arrowItemTitleSize">16sp</item>
+        <item name="arrowItemTitleStyle">bold</item>
+        <item name="arrowItemTitleColor">@color/demo_title</item>
+        <item name="arrowItemShowDivider">true</item>
+        <item name="arrowItemContentColor">@color/demo_subtitle</item>
+    </style>
+
+    <style name="currency_arrow_item_language">
+        <item name="background">@color/ease_color_background</item>
+        <item name="arrowItemTitleSize">16sp</item>
+        <item name="arrowItemTitleStyle">bold</item>
+        <item name="arrowItemTitleColor">@color/demo_title</item>
+        <item name="arrowItemShowDivider">true</item>
+        <item name="arrowItemContentColor">@color/demo_subtitle</item>
+    </style>
+
+
+</resources>
\ No newline at end of file
diff --git a/app-kotlin/src/main/res/values/themes.xml b/app-kotlin/src/main/res/values/themes.xml
new file mode 100644
index 00000000..b7cbfa25
--- /dev/null
+++ b/app-kotlin/src/main/res/values/themes.xml
@@ -0,0 +1,10 @@
+<resources xmlns:tools="http://schemas.android.com/tools">
+    <!-- Base application theme. -->
+    <style name="Base.Theme.Easeui" parent="Theme.AppCompat.Light.NoActionBar">
+        <!-- Customize your light theme here. -->
+        <!-- <item name="colorPrimary">@color/my_light_primary</item> -->
+        <item name="android:navigationBarColor">@color/ease_color_background</item>
+    </style>
+
+    <style name="Theme.Easeui" parent="Base.Theme.Easeui" />
+</resources>
\ No newline at end of file
diff --git a/app/build.gradle b/app/build.gradle
index 38c40a0d..2ecd1939 100644
--- a/app/build.gradle
+++ b/app/build.gradle
@@ -11,13 +11,13 @@ android {
 
 
     compileSdk 34
-
+    namespace = "io.agora.chatdemo"
     defaultConfig {
         applicationId "io.agora.chatdemo"
         minSdkVersion 21
         targetSdkVersion 34
-        versionCode 12
-        versionName "1.2.1"
+        versionCode 130
+        versionName "1.3.0"
         multiDexEnabled true
 
         testInstrumentationRunner "androidx.test.runner.AndroidJUnitRunner"
@@ -28,10 +28,6 @@ android {
             }
         }
 
-        dexOptions {
-            javaMaxHeapSize "4g"
-        }
-
         // If you use your own Agora Chat appkey, you should deploy your own App Server.
         // See:
         buildConfigField ("String", "APP_SERVER_PROTOCOL", "\"https\"")
@@ -39,7 +35,7 @@ android {
         buildConfigField ("String", "APP_SERVER_URL", "\"/app/chat/user/login\"")
         buildConfigField ("String", "APP_SERVER_REGISTER", "\"/app/chat/user/register\"")
 
-        buildConfigField ("String", "Agora_AppId", properties.getProperty("AGORA_APPID", "******"))
+        buildConfigField ("String", "Agora_AppId", "\"${properties.getProperty("AGORA_APPID")}\"")
         manifestPlaceholders = [AGORA_CHAT_APPKEY: properties.getProperty("AGORA_CHAT_APPKEY", "******")]
 
 //        ndk {
@@ -48,7 +44,6 @@ android {
 //
 //        externalNativeBuild {
 //            ndkBuild {
-////                arguments "NDK_LIBS_OUT=libs", "all"
 //                abiFilters  "arm64-v8a","armeabi-v7a"
 //                arguments '-j8'
 //            }
@@ -96,6 +91,9 @@ android {
     viewBinding {
         enabled = true
     }
+    buildFeatures{
+        buildConfig = true
+    }
 //    externalNativeBuild {
 //        ndkBuild {
 //            path file('jni/Android.mk')
@@ -110,6 +108,9 @@ dependencies {
     implementation 'androidx.constraintlayout:constraintlayout:2.1.0'
     implementation 'androidx.lifecycle:lifecycle-livedata-ktx:2.3.1'
     implementation 'androidx.lifecycle:lifecycle-viewmodel-ktx:2.3.1'
+    testImplementation 'junit:junit:4.+'
+    androidTestImplementation 'androidx.test.ext:junit:1.1.5'
+    androidTestImplementation 'androidx.test.espresso:espresso-core:3.5.1'
     //ViewModel and LiveData
     implementation 'androidx.lifecycle:lifecycle-extensions:2.2.0'
     // Google firebase cloud messaging
@@ -138,7 +139,6 @@ dependencies {
     // Agora Chat Uikit
     implementation 'io.agora.rtc:chat-uikit:1.2.0'
     implementation 'io.agora.rtc:chat-callkit:1.2.0'
-    implementation 'io.agora.rtc:chat-sdk:1.2.1'
 //    implementation project(path: ':chat-uikit')
 //    implementation project(path: ':chat-callkit')
     // url preview
diff --git a/app/jni/Android.mk b/app/jni/Android.mk
index 129fd8b7..f094fe4e 100644
--- a/app/jni/Android.mk
+++ b/app/jni/Android.mk
@@ -19,5 +19,6 @@ include $(CLEAR_VARS)
 PB_LITE=1
 ENABLE_CALL=0
 USE_SQLCIPHER=1
+ENABLE_AGORA=1
 #libhyphenate.so
 include $(LOCAL_PATH)/../../../emclient-linux/Android.mk
diff --git a/app/src/main/AndroidManifest.xml b/app/src/main/AndroidManifest.xml
index f5bb1895..e440ca92 100644
--- a/app/src/main/AndroidManifest.xml
+++ b/app/src/main/AndroidManifest.xml
@@ -1,7 +1,6 @@
 <?xml version="1.0" encoding="utf-8"?>
 <manifest xmlns:android="http://schemas.android.com/apk/res/android"
-    xmlns:tools="http://schemas.android.com/tools"
-    package="io.agora.chatdemo">
+    xmlns:tools="http://schemas.android.com/tools">
     <!-- IM SDK required start -->
     <uses-permission android:name="android.permission.INTERNET" />
     <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
@@ -175,14 +174,18 @@
             android:exported="false"
             android:configChanges="orientation|keyboardHidden|screenSize"
             android:label="@string/demo_activity_label_video_call"
+            android:taskAffinity=".SingleCallTask"
             android:launchMode="singleInstance"
+            android:excludeFromRecents="true"
             android:screenOrientation="portrait" />
         <activity
             android:name=".av.MultipleCallActivity"
             android:exported="false"
             android:configChanges="orientation|keyboardHidden|screenSize"
             android:label="@string/demo_activity_label_multi_call"
+            android:taskAffinity=".MultipleCallTask"
             android:launchMode="singleInstance"
+            android:excludeFromRecents="true"
             android:screenOrientation="portrait" />
         <!-- custom presence -->
         <activity
diff --git a/app/src/main/java/io/agora/chatdemo/DemoHelper.java b/app/src/main/java/io/agora/chatdemo/DemoHelper.java
index 824d895d..9cdfd53a 100644
--- a/app/src/main/java/io/agora/chatdemo/DemoHelper.java
+++ b/app/src/main/java/io/agora/chatdemo/DemoHelper.java
@@ -163,15 +163,8 @@ public EMAREncryptUtils getEncryptUtils(){
     private boolean initSDK(Context context) {
         // Set Chat Options
         ChatOptions options = initChatOptions(context);
-        // Configure custom rest server and im server
 
-//        options.setRestServer("a1-hsb.easemob.com");
-//        options.setAppKey("easemob-demo#chatdemoui");
-//        options.setIMServer("106.75.100.247");
-//        options.setImPort(6717);
         options.setUsingHttpsOnly(true);
-        // Use fpa by default
-        options.setFpaEnable(true);
         boolean hasAppkey = checkAgoraChatAppKey(context, options);
         // You can set your AppKey by options.setAppKey(appkey)
         if (!hasAppkey) {
diff --git a/app/src/main/java/io/agora/chatdemo/av/DemoCallKitListener.java b/app/src/main/java/io/agora/chatdemo/av/DemoCallKitListener.java
index cd7fa8bf..3b51e414 100644
--- a/app/src/main/java/io/agora/chatdemo/av/DemoCallKitListener.java
+++ b/app/src/main/java/io/agora/chatdemo/av/DemoCallKitListener.java
@@ -99,7 +99,7 @@ public void onInviteUsers(EaseCallType callType, String existMembers[], JSONObje
     public void onEndCallWithReason(EaseCallType callType, String channelName, EaseCallEndReason reason, long callTime) {
         EMLog.d(TAG, "onEndCallWithReason" + (callType != null ? callType.name() : " callType is null ") + " reason:" + reason + " time:" + callTime);
 
-        String callString = mContext.getString(R.string.ease_call_duration);
+        String callString = mContext.getString(io.agora.chat.callkit.R.string.ease_call_duration);
         callString += " "+dateFormat.format(callTime);
         Message message = handler.obtainMessage();
         switch (reason) {
@@ -247,9 +247,9 @@ private void getUserIdByAgoraUid(int uId, String url, EaseCallGetUserAccountCall
                                     String uIdStr = it.next().toString();
                                     int uid = Integer.valueOf(uIdStr).intValue();
                                     String username = resToken.optString(uIdStr);
-                                    if (uid == uId) {
+                                    if (uid == uId||uid==0) {
                                         //Obtain information such as userName, profile picture, and nickname of the current user
-                                        userAccount=new EaseUserAccount(uid, username);
+                                        userAccount=new EaseUserAccount(uId, username);
                                     }
                                 }
                                 callback.onUserAccount(userAccount);
diff --git a/app/src/main/java/io/agora/chatdemo/base/BaseActivity.java b/app/src/main/java/io/agora/chatdemo/base/BaseActivity.java
index 40f6a7ef..1cf6c9eb 100644
--- a/app/src/main/java/io/agora/chatdemo/base/BaseActivity.java
+++ b/app/src/main/java/io/agora/chatdemo/base/BaseActivity.java
@@ -214,7 +214,7 @@ public void onClick(View v) {
      * @param colorId
      */
     public static void setToolbarCustomColor(AppCompatActivity mContext, int colorId) {
-        Drawable leftArrow = ContextCompat.getDrawable(mContext, R.drawable.abc_ic_ab_back_material);
+        Drawable leftArrow = ContextCompat.getDrawable(mContext, androidx.appcompat.R.drawable.abc_ic_ab_back_material);
         if(leftArrow != null) {
             leftArrow.setColorFilter(ContextCompat.getColor(mContext, colorId), PorterDuff.Mode.SRC_ATOP);
             if(mContext.getSupportActionBar() != null) {
diff --git a/app/src/main/java/io/agora/chatdemo/base/BaseFragment.java b/app/src/main/java/io/agora/chatdemo/base/BaseFragment.java
index 8f4d54c7..2c08a53f 100644
--- a/app/src/main/java/io/agora/chatdemo/base/BaseFragment.java
+++ b/app/src/main/java/io/agora/chatdemo/base/BaseFragment.java
@@ -83,7 +83,7 @@ public void runOnUiThread(Runnable runnable) {
      * @param colorId
      */
     public static void setToolbarCustomColor(AppCompatActivity mContext, int colorId) {
-        Drawable leftArrow = ContextCompat.getDrawable(mContext, R.drawable.abc_ic_ab_back_material);
+        Drawable leftArrow = ContextCompat.getDrawable(mContext, androidx.appcompat.R.drawable.abc_ic_ab_back_material);
         if(leftArrow != null) {
             leftArrow.setColorFilter(ContextCompat.getColor(mContext, colorId), PorterDuff.Mode.SRC_ATOP);
             if(mContext.getSupportActionBar() != null) {
@@ -132,7 +132,7 @@ public void onClick(DialogInterface dialog, int which) {
                             }
                         }
                     })
-                    .setNegativeButton(getResources().getString(R.string.ease_cancel), null)
+                    .setNegativeButton(getResources().getString(io.agora.chat.uikit.R.string.ease_cancel), null)
                     .show();
     }
 
diff --git a/app/src/main/java/io/agora/chatdemo/chat/ChatActivity.java b/app/src/main/java/io/agora/chatdemo/chat/ChatActivity.java
index 294e2506..924fd2c8 100644
--- a/app/src/main/java/io/agora/chatdemo/chat/ChatActivity.java
+++ b/app/src/main/java/io/agora/chatdemo/chat/ChatActivity.java
@@ -146,7 +146,7 @@ private void initChatFragment() {
                 .useHeader(false)
                 .setCustomAdapter(new CustomMessageAdapter())
                 .setCustomFragment(customChatFragment)
-                .setEmptyLayout(R.layout.ease_layout_no_data_show_nothing)
+                .setEmptyLayout(io.agora.chat.uikit.R.layout.ease_layout_no_data_show_nothing)
                 .setOnChatInputChangeListener(new OnChatInputChangeListener() {
                     @Override
                     public void onTextChanged(CharSequence s, int start, int before, int count) {
@@ -281,7 +281,7 @@ public void onModifyMessageSuccess(ChatMessage messageModified) {
 
                     @Override
                     public void onModifyMessageFailure(String messageId, int code, String error) {
-                        ToastUtils.showFailToast(getString(R.string.ease_fail_to_edit));
+                        ToastUtils.showFailToast(getString(io.agora.chat.uikit.R.string.ease_fail_to_edit));
                     }
                 })
                 .hideSenderAvatar(true)
@@ -315,7 +315,7 @@ private void showForwardContactsDialog() {
     private void showDeleteDialog(List<String> deleteMsgIdList, View multiView) {
         new SimpleDialog.Builder(this)
                 .setTitle(getString(R.string.chat_delete_multi_messages_title, deleteMsgIdList.size()))
-                .setOnConfirmClickListener(R.string.ease_action_delete, new SimpleDialog.OnConfirmClickListener() {
+                .setOnConfirmClickListener(io.agora.chat.uikit.R.string.ease_action_delete, new SimpleDialog.OnConfirmClickListener() {
                     @Override
                     public void onConfirmClick(View view) {
                         resetTitleBar(multiView);
@@ -487,7 +487,7 @@ public void onError(int code, String message) {
                 e.printStackTrace();
             }
             if(!TextUtils.isEmpty(to) && mForwardMsgIdList != null) {
-                ChatMessage chatMessage = ChatMessage.createCombinedSendMessage(getString(R.string.ease_combine_default)
+                ChatMessage chatMessage = ChatMessage.createCombinedSendMessage(getString(io.agora.chat.uikit.R.string.ease_combine_default)
                         , EaseChatMessageMultiSelectHelper.getCombineMessageSummary(mForwardMsgIdList)
                         , getString(R.string.forward_compatible_text), mForwardMsgIdList, to);
                 if(chatType == ChatMessage.ChatType.GroupChat) {
diff --git a/app/src/main/java/io/agora/chatdemo/chat/ChatReportActivity.java b/app/src/main/java/io/agora/chatdemo/chat/ChatReportActivity.java
index 7707515d..4b94dfa5 100644
--- a/app/src/main/java/io/agora/chatdemo/chat/ChatReportActivity.java
+++ b/app/src/main/java/io/agora/chatdemo/chat/ChatReportActivity.java
@@ -140,7 +140,7 @@ public void initData(){
             }
         }
         viewModel = new ViewModelProvider(this).get(ChatViewModel.class);
-        viewModel.getChatManagerObservable().observe(this,response->{
+        viewModel.getReportMessageObservable().observe(this, response->{
             parseResource(response, new OnResourceParseCallback<Boolean>() {
                 @Override
                 public void onSuccess(@Nullable Boolean data) {
diff --git a/app/src/main/java/io/agora/chatdemo/chat/ChatRowCall.java b/app/src/main/java/io/agora/chatdemo/chat/ChatRowCall.java
index 84777c3d..0ea6181f 100644
--- a/app/src/main/java/io/agora/chatdemo/chat/ChatRowCall.java
+++ b/app/src/main/java/io/agora/chatdemo/chat/ChatRowCall.java
@@ -67,20 +67,20 @@ protected void onSetUpView() {
         if (callAction == EaseCallAction.CALL_INVITE) {
             switch (callkitType) {
                 case SINGLE_VOICE_CALL:
-                    title.setText(context.getText(R.string.ease_call_single_audio_call));
-                    ivCall.setImageResource(R.drawable.call_voice_green);
+                    title.setText(context.getText(io.agora.chat.callkit.R.string.ease_call_single_audio_call));
+                    ivCall.setImageResource(io.agora.chat.callkit.R.drawable.call_voice_green);
                     break;
                 case CONFERENCE_VOICE_CALL:
-                    title.setText(context.getText(R.string.ease_call_group_audio_call));
-                    ivCall.setImageResource(R.drawable.call_voice_green);
+                    title.setText(context.getText(io.agora.chat.callkit.R.string.ease_call_group_audio_call));
+                    ivCall.setImageResource(io.agora.chat.callkit.R.drawable.call_voice_green);
                     break;
                 case SINGLE_VIDEO_CALL:
-                    title.setText(context.getText(R.string.ease_call_single_video_call));
-                    ivCall.setImageResource(R.drawable.call_video_green);
+                    title.setText(context.getText(io.agora.chat.callkit.R.string.ease_call_single_video_call));
+                    ivCall.setImageResource(io.agora.chat.callkit.R.drawable.call_video_green);
                     break;
                 case CONFERENCE_VIDEO_CALL:
-                    title.setText(context.getText(R.string.ease_call_group_video_call));
-                    ivCall.setImageResource(R.drawable.call_video_green);
+                    title.setText(context.getText(io.agora.chat.callkit.R.string.ease_call_group_video_call));
+                    ivCall.setImageResource(io.agora.chat.callkit.R.drawable.call_video_green);
                     break;
             }
             String str = dateFormat.format(new Date(time));
@@ -88,20 +88,20 @@ protected void onSetUpView() {
         }else if(callAction==EaseCallAction.CALL_CANCEL) {
             switch (callkitType) {
                 case SINGLE_VOICE_CALL:
-                    title.setText(context.getText(R.string.ease_call_audio_call_ended));
-                    ivCall.setImageResource(R.drawable.call_voice_gray);
+                    title.setText(context.getText(io.agora.chat.callkit.R.string.ease_call_audio_call_ended));
+                    ivCall.setImageResource(io.agora.chat.callkit.R.drawable.call_voice_gray);
                     break;
                 case CONFERENCE_VOICE_CALL:
-                    title.setText(context.getText(R.string.ease_call_audio_call_ended));
-                    ivCall.setImageResource(R.drawable.call_voice_gray);
+                    title.setText(context.getText(io.agora.chat.callkit.R.string.ease_call_audio_call_ended));
+                    ivCall.setImageResource(io.agora.chat.callkit.R.drawable.call_voice_gray);
                     break;
                 case SINGLE_VIDEO_CALL:
-                    title.setText(context.getText(R.string.ease_call_video_call_ended));
-                    ivCall.setImageResource(R.drawable.call_video_gray);
+                    title.setText(context.getText(io.agora.chat.callkit.R.string.ease_call_video_call_ended));
+                    ivCall.setImageResource(io.agora.chat.callkit.R.drawable.call_video_gray);
                     break;
                 case CONFERENCE_VIDEO_CALL:
-                    title.setText(context.getText(R.string.ease_call_video_call_ended));
-                    ivCall.setImageResource(R.drawable.call_video_gray);
+                    title.setText(context.getText(io.agora.chat.callkit.R.string.ease_call_video_call_ended));
+                    ivCall.setImageResource(io.agora.chat.callkit.R.drawable.call_video_gray);
                     break;
             }
             subtitle.setText(message.getStringAttribute(CALL_COST_TIME,"00:00"));
diff --git a/app/src/main/java/io/agora/chatdemo/chat/CustomChatFragment.java b/app/src/main/java/io/agora/chatdemo/chat/CustomChatFragment.java
index 7dac0f92..ad0e6f45 100644
--- a/app/src/main/java/io/agora/chatdemo/chat/CustomChatFragment.java
+++ b/app/src/main/java/io/agora/chatdemo/chat/CustomChatFragment.java
@@ -1,8 +1,10 @@
 package io.agora.chatdemo.chat;
 
 import static io.agora.chat.uikit.menu.EaseChatType.SINGLE_CHAT;
+import static io.agora.chatdemo.general.utils.ToastUtils.showToast;
 
 import android.Manifest;
+import android.annotation.SuppressLint;
 import android.app.Activity;
 import android.content.Context;
 import android.content.Intent;
@@ -14,7 +16,6 @@
 import android.text.TextUtils;
 import android.text.TextWatcher;
 import android.text.style.ForegroundColorSpan;
-import android.util.Log;
 import android.view.Gravity;
 import android.view.KeyEvent;
 import android.view.View;
@@ -35,6 +36,8 @@
 import androidx.recyclerview.widget.RecyclerView;
 import androidx.swiperefreshlayout.widget.SwipeRefreshLayout;
 
+import com.google.android.gms.common.util.CollectionUtils;
+
 import java.util.ArrayList;
 import java.util.HashSet;
 import java.util.Iterator;
@@ -44,11 +47,13 @@
 import java.util.regex.Matcher;
 import java.util.regex.Pattern;
 
+import io.agora.MessageListener;
 import io.agora.chat.ChatClient;
 import io.agora.chat.ChatMessage;
 import io.agora.chat.ChatRoom;
 import io.agora.chat.CustomMessageBody;
 import io.agora.chat.LocationMessageBody;
+import io.agora.chat.MessagePinInfo;
 import io.agora.chat.TextMessageBody;
 import io.agora.chat.uikit.chat.EaseChatFragment;
 import io.agora.chat.uikit.chat.adapter.EaseMessageAdapter;
@@ -65,15 +70,22 @@
 import io.agora.chatdemo.R;
 import io.agora.chatdemo.chat.adapter.CustomMessageAdapter;
 import io.agora.chatdemo.chat.viewmodel.ChatViewModel;
+import io.agora.chatdemo.general.callbacks.OnResourceParseCallback;
 import io.agora.chatdemo.general.constant.DemoConstant;
 import io.agora.chatdemo.general.dialog.AlertDialog;
+import io.agora.chatdemo.general.dialog.SimpleDialog;
 import io.agora.chatdemo.general.enums.Status;
 import io.agora.chatdemo.general.interfaces.TranslationListener;
 import io.agora.chatdemo.general.livedatas.EaseEvent;
 import io.agora.chatdemo.general.livedatas.LiveDataBus;
+import io.agora.chatdemo.general.net.Resource;
 import io.agora.chatdemo.general.permission.PermissionCompat;
 import io.agora.chatdemo.general.permission.PermissionsManager;
 import io.agora.chatdemo.general.utils.RecyclerViewUtils;
+import io.agora.chatdemo.general.utils.ToastUtils;
+import io.agora.chatdemo.general.utils.UIUtils;
+import io.agora.chatdemo.general.widget.PinInfoView;
+import io.agora.chatdemo.general.widget.PinMessageListViewGroup;
 import io.agora.chatdemo.group.GroupHelper;
 import io.agora.chatdemo.group.model.MemberAttributeBean;
 import io.agora.chatdemo.group.viewmodel.GroupDetailViewModel;
@@ -82,10 +94,15 @@
 import io.agora.chatdemo.me.TranslationSettingsActivity;
 import io.agora.util.EMLog;
 
-public class CustomChatFragment extends EaseChatFragment {
+public class CustomChatFragment extends EaseChatFragment implements MessageListener {
     private static final int REQUEST_CODE_STORAGE_PICTURE = 111;
     private static final int REQUEST_CODE_STORAGE_VIDEO = 112;
     private static final int REQUEST_CODE_STORAGE_FILE = 113;
+    private static final int ACTION_CHAT_SELECT = io.agora.chat.uikit.R.id.action_chat_select;
+    private static final int EXTEND_ITEM_TAKE_PICTURE = io.agora.chat.uikit.R.id.extend_item_take_picture;
+    private static final int EXTEND_ITEM_PICTURE = io.agora.chat.uikit.R.id.extend_item_picture;
+    private static final int EXTEND_ITEM_VIDEO =  io.agora.chat.uikit.R.id.extend_item_video;
+    private static final int EXTEND_ITEM_FILE = io.agora.chat.uikit.R.id.extend_item_file;
     private boolean isFirstMeasure = true;
     private GroupDetailViewModel groupDetailViewModel;
     private ChatViewModel viewModel;
@@ -100,6 +117,7 @@ public class CustomChatFragment extends EaseChatFragment {
             , result -> onRequestResult(result, REQUEST_CODE_STORAGE_VIDEO));
     private final ActivityResultLauncher<String[]> requestFilePermission = registerForActivityResult(new ActivityResultContracts.RequestMultiplePermissions()
             , result -> onRequestResult(result, REQUEST_CODE_STORAGE_FILE));
+    private PinInfoView pinInfoView;
 
     @Override
     public void onCreate(@Nullable Bundle savedInstanceState) {
@@ -109,8 +127,8 @@ public void onCreate(@Nullable Bundle savedInstanceState) {
                 result -> {
                     if (result.getResultCode() == Activity.RESULT_OK) {
                         boolean enable = DemoHelper.getInstance().getModel().getDemandTranslationEnable();
-                        if (enable && !TextUtils.isEmpty(getPreferredLanguageCode())){
-                            translationMessage(translationMsg,getPreferredLanguageCode());
+                        if (enable && !TextUtils.isEmpty(getPreferredLanguageCode())) {
+                            translationMessage(translationMsg, getPreferredLanguageCode());
                         }
                     }
                 }
@@ -120,53 +138,130 @@ public void onCreate(@Nullable Bundle savedInstanceState) {
     @Override
     public void initData() {
         super.initData();
-        groupDetailViewModel = new ViewModelProvider((AppCompatActivity)mContext).get(GroupDetailViewModel.class);
-        groupDetailViewModel.getFetchMemberAttributesObservable().observe(this,response ->{
-            if(response == null || isDestroy) {
+        groupDetailViewModel = new ViewModelProvider((AppCompatActivity) mContext).get(GroupDetailViewModel.class);
+        groupDetailViewModel.getFetchMemberAttributesObservable().observe(this, response -> {
+            if (response == null || isDestroy) {
                 return;
             }
-            if(response.status == Status.SUCCESS) {
+            if (response.status == Status.SUCCESS) {
                 chatLayout.getChatMessageListLayout().refreshMessages();
             }
         });
         viewModel = new ViewModelProvider(this).get(ChatViewModel.class);
-        viewModel.getTranslationObservable().observe(this,response ->{
-            if(response == null || isDestroy) {
+        viewModel.getTranslationObservable().observe(this, response -> {
+            if (response == null || isDestroy) {
                 return;
             }
-            if(response.status == Status.SUCCESS) {
+            if (response.status == Status.SUCCESS) {
                 chatLayout.getChatMessageListLayout().refreshMessages();
-            }else {
-                EMLog.e("translationMessage","onError: " + response.errorCode + " - " + response.getMessage());
+            } else {
+                EMLog.e("translationMessage", "onError: " + response.errorCode + " - " + response.getMessage());
             }
         });
+        viewModel.pinMessageObservable().observe(this, response -> {
+            parseResource(response, new OnResourceParseCallback<ChatMessage>() {
+                @Override
+                public void onSuccess(ChatMessage message) {
+                    updatePinMessage(message,ChatClient.getInstance().getCurrentUser());
+                }
+
+                @Override
+                public void onError(int code, String message) {
+                    super.onError(code, message);
+                    showToast(message);
+                }
+            });
+        });
 
         LiveDataBus.get().with(DemoConstant.GROUP_MEMBER_ATTRIBUTE_CHANGE, EaseEvent.class).observe(getViewLifecycleOwner(), event -> {
-            if(event == null || isDestroy) {
+            if (event == null || isDestroy) {
                 return;
             }
             chatLayout.getChatMessageListLayout().refreshMessages();
         });
         LiveDataBus.get().with(DemoConstant.MESSAGE_CHANGE_CHANGE, EaseEvent.class).observe(getViewLifecycleOwner(), event -> {
-            if(event == null || isDestroy) {
+            if (event == null || isDestroy) {
                 return;
             }
-            if(event.isMessageChange()) {
+            if (event.isMessageChange()) {
                 chatLayout.getChatMessageListLayout().refreshMessages();
             }
         });
         LiveDataBus.get().with(DemoConstant.EVENT_CHAT_MODEL_TO_NORMAL, EaseEvent.class).observe(this, event -> {
-            if(event == null || isDestroy) {
+            if (event == null || isDestroy) {
                 return;
             }
-            if(event.type == EaseEvent.TYPE.NOTIFY && TextUtils.isEmpty(event.message)) {
+            if (event.type == EaseEvent.TYPE.NOTIFY && TextUtils.isEmpty(event.message)) {
                 IChatTopExtendMenu chatTopExtendMenu = chatLayout.getChatInputMenu().getChatTopExtendMenu();
-                if(chatTopExtendMenu instanceof EaseChatMultiSelectView) {
+                if (chatTopExtendMenu instanceof EaseChatMultiSelectView) {
                     ((EaseChatMultiSelectView) chatTopExtendMenu).dismissSelectView(null);
                 }
                 titleBar.setVisibility(View.GONE);
             }
         });
+
+        viewModel.getPinMessageObservable().observe(this, response -> {
+            parseResource(response, new OnResourceParseCallback<List<ChatMessage>>() {
+                @Override
+                public void onSuccess(List<ChatMessage> messages) {
+                    if (CollectionUtils.isEmpty(messages)) {
+                        pinInfoView.setVisibility(View.GONE);
+                    } else {
+                        pinInfoView.setData(messages);
+                    }
+                }
+
+                @Override
+                public void onError(int code, String message) {
+                    super.onError(code, message);
+                }
+            });
+        });
+
+        if (chatType != SINGLE_CHAT) {
+            viewModel.getPinnedMessagesFromServer(conversationId);
+        }
+    }
+
+    private void updatePinMessage(ChatMessage message,String operationUser) {
+        runOnUiThread(()->{
+            boolean isPined = message.pinnedInfo()==null||TextUtils.isEmpty(message.pinnedInfo().operatorId());
+            ToastUtils.showToast((isPined ? "unpin success" : "pin success"));
+            if(isPined){
+                pinInfoView.removeData(message);
+            }else{
+                pinInfoView.addData(message);
+            }
+            //insert pin message info in local
+            insertPinNotificationInLocal(message, operationUser);
+            chatLayout.getChatMessageListLayout().refreshToLatest();
+        });
+    }
+
+    private void insertPinNotificationInLocal(ChatMessage msg,String operationUser) {
+        ChatMessage msgNotification = ChatMessage.createReceiveMessage(ChatMessage.Type.TXT);
+        String content;
+        if(msg.pinnedInfo()==null||TextUtils.isEmpty(msg.pinnedInfo().operatorId())) {
+            content = operationUser+" removed a pin message";
+        }else{
+            content = operationUser+" pinned a message";
+        }
+        if(TextUtils.equals(operationUser, ChatClient.getInstance().getCurrentUser())){
+            content = content.replace(operationUser, "You");
+        }
+        TextMessageBody txtBody = new TextMessageBody(content);
+        msgNotification.addBody(txtBody);
+        msgNotification.setFrom(msg.getFrom());
+        msgNotification.setTo(msg.getTo());
+        msgNotification.setUnread(false);
+        msgNotification.setMsgTime(System.currentTimeMillis());
+        msgNotification.setLocalTime(System.currentTimeMillis());
+        msgNotification.setChatType(msg.getChatType());
+        //Just to reuse the recall layout
+        msgNotification.setAttribute(EaseConstant.MESSAGE_TYPE_RECALL, true);
+        msgNotification.setStatus(ChatMessage.Status.SUCCESS);
+        msgNotification.setIsChatThreadMessage(msg.isChatThreadMessage());
+        ChatClient.getInstance().chatManager().saveMessage(msgNotification);
     }
 
     @Override
@@ -174,11 +269,11 @@ public void initListener() {
         super.initListener();
         listenerRecyclerViewItemFinishLayout();
         EditText editText = chatLayout.getChatInputMenu().getPrimaryMenu().getEditText();
-        if (editText != null){
+        if (editText != null) {
             editText.setOnKeyListener(new View.OnKeyListener() {
                 @Override
                 public boolean onKey(View v, int keyCode, KeyEvent event) {
-                    return removePickAt(v,keyCode,event);
+                    return removePickAt(v, keyCode, event);
                 }
             });
             editText.addTextChangedListener(new TextWatcher() {
@@ -189,20 +284,20 @@ public void beforeTextChanged(CharSequence s, int start, int count, int after) {
 
                 @Override
                 public void onTextChanged(CharSequence s, int start, int before, int count) {
-                    if(!chatLayout.getChatMessageListLayout().isGroupChat()) {
+                    if (!chatLayout.getChatMessageListLayout().isGroupChat()) {
                         return;
                     }
-                    if(count == 1 && "@".equals(String.valueOf(s.charAt(start)))){
+                    if (count == 1 && "@".equals(String.valueOf(s.charAt(start)))) {
                         Bundle bundle = new Bundle();
                         bundle.putString(EaseConstant.EXTRA_CONVERSATION_ID, conversationId);
                         PickAtUserDialogFragment fragment = new PickAtUserDialogFragment();
                         fragment.setPickAtSelectListener(username -> {
-                            chatLayout.inputAtUsername(username,false);
+                            chatLayout.inputAtUsername(username, false);
                         });
                         fragment.setArguments(bundle);
-                        if (getActivity() != null){
+                        if (getActivity() != null) {
                             fragment.show(getActivity().getSupportFragmentManager(), "pick_at_user");
-                            if (getActivity() != null){
+                            if (getActivity() != null) {
                                 new Handler().postDelayed(new Runnable() {
                                     @Override
                                     public void run() {
@@ -210,7 +305,7 @@ public void run() {
                                         editText.requestFocus();
                                         imm.toggleSoftInput(InputMethodManager.SHOW_FORCED, 0);
                                     }
-                                },200);
+                                }, 200);
                             }
                         }
                     }
@@ -222,6 +317,53 @@ public void afterTextChanged(Editable editable) {
                 }
             });
         }
+
+        if(pinInfoView!=null){
+            pinInfoView.setOnItemClickListener(new PinMessageListViewGroup.OnItemClickListener() {
+                @Override
+                public void onItemClick(ChatMessage message) {
+                    pinInfoView.restView();
+                    //click for pin message list
+                    List<ChatMessage> messageList = chatLayout.getChatMessageListLayout().getMessageAdapter().getData();
+                    boolean isExist = false;
+                    for (int i = 0; i < messageList.size(); i++) {
+                        ChatMessage chatMessage = messageList.get(i);
+                        if (chatMessage.getMsgId().equals(message.getMsgId())) {
+                            isExist = true;
+                            break;
+                        }
+                    }
+                    if (!isExist) {
+                        ToastUtils.showToast(getString(R.string.pin_skip_not_exist));
+                    }else{
+                        chatLayout.getChatMessageListLayout().moveToTarget(message);
+                    }
+                }
+            });
+            pinInfoView.setOnItemSubViewClickListener(new EaseMessageAdapter.OnItemSubViewClickListener() {
+                @Override
+                public void onItemSubViewClick(View view, int position) {
+                    ChatMessage message=pinInfoView.getPinMessages().get(position);
+                    showUnPinConfirmDialog(message);
+                }
+            });
+        }
+
+        ChatClient.getInstance().chatManager().addMessageListener(this);
+    }
+
+    private void showUnPinConfirmDialog(ChatMessage message) {
+        new SimpleDialog.Builder(getActivity())
+                .setTitle(R.string.unpin_confirm_message)
+                .showCancelButton(true)
+                .hideConfirmButton(false)
+                .setOnConfirmClickListener(R.string.dialog_btn_to_confirm, new SimpleDialog.OnConfirmClickListener() {
+                    @Override
+                    public void onConfirmClick(View view) {
+                        viewModel.pinMessage(message, false);
+                    }
+                })
+                .show();
     }
 
 
@@ -234,28 +376,46 @@ public void onViewCreated(@NonNull View view, @Nullable Bundle savedInstanceStat
     @Override
     public void initView() {
         super.initView();
+        MenuItemBean pinItemBean = new MenuItemBean(0, R.id.action_chat_pin, 76, getResources().getString(R.string.ease_action_pin));
+        pinItemBean.setResourceId(R.drawable.chat_item_menu_pin);
         MenuItemBean menuItemBean = new MenuItemBean(0, R.id.action_chat_report, 99, getResources().getString(R.string.ease_action_report));
         menuItemBean.setResourceId(R.drawable.chat_item_menu_report);
-        MenuItemBean menuTranslationBean = new MenuItemBean(0, R.id.action_chat_translation,88, getResources().getString(R.string.ease_action_translation));
+        MenuItemBean menuTranslationBean = new MenuItemBean(0, R.id.action_chat_translation, 88, getResources().getString(R.string.ease_action_translation));
         menuTranslationBean.setResourceId(R.drawable.chat_item_menu_translation);
-        MenuItemBean menuReTranslationBean = new MenuItemBean(0, R.id.action_chat_re_translation,111, getResources().getString(R.string.ease_action_re_translation));
+        MenuItemBean menuReTranslationBean = new MenuItemBean(0, R.id.action_chat_re_translation, 111, getResources().getString(R.string.ease_action_re_translation));
         menuReTranslationBean.setResourceId(R.drawable.chat_item_menu_translation);
+        chatLayout.getMenuHelper().addItemMenu(pinItemBean);
         chatLayout.getMenuHelper().addItemMenu(menuItemBean);
         chatLayout.getMenuHelper().addItemMenu(menuTranslationBean);
         chatLayout.getMenuHelper().addItemMenu(menuReTranslationBean);
         chatLayout.setPresenter(new ChatCustomPresenter());
 
         EaseMessageAdapter adapter = chatLayout.getChatMessageListLayout().getMessageAdapter();
-        if (adapter instanceof CustomMessageAdapter){
-            ((CustomMessageAdapter)adapter).setTranslationListener(new TranslationListener() {
+        if (adapter instanceof CustomMessageAdapter) {
+            ((CustomMessageAdapter) adapter).setTranslationListener(new TranslationListener() {
                 @Override
-                public void onTranslationRetry(ChatMessage message,String languageCode) {
-                    if (message.getBody() instanceof TextMessageBody){
-                        translationMessage(message,languageCode);
+                public void onTranslationRetry(ChatMessage message, String languageCode) {
+                    if (message.getBody() instanceof TextMessageBody) {
+                        translationMessage(message, languageCode);
                     }
                 }
             });
         }
+
+        if(chatType!=SINGLE_CHAT){
+            pinInfoView = new PinInfoView(getContext());
+            RelativeLayout.LayoutParams layoutParams = new RelativeLayout.LayoutParams(
+                    RelativeLayout.LayoutParams.MATCH_PARENT,
+                    ViewGroup.LayoutParams.WRAP_CONTENT);
+            pinInfoView.setVisibility(View.GONE);
+            chatLayout.addView(pinInfoView, layoutParams);
+            chatLayout.post(new Runnable() {
+                @Override
+                public void run() {
+                    pinInfoView.setInnerLayoutMaxHeight(chatLayout.getHeight()- UIUtils.dp2px(getContext(), 145));
+                }
+            });
+        }
     }
 
     @Override
@@ -275,7 +435,7 @@ public void onPreMenu(EasePopupWindowHelper helper, ChatMessage message) {
         if (isRecallNote) {
             helper.setAllItemsVisible(false);
             helper.showHeaderView(false);
-            helper.findItemVisible(R.id.action_chat_delete, true);
+            helper.findItemVisible(io.agora.chat.uikit.R.id.action_chat_delete, true);
         }
 
         if (message.getBody() instanceof TextMessageBody) {
@@ -290,61 +450,68 @@ public void onPreMenu(EasePopupWindowHelper helper, ChatMessage message) {
             helper.findItemVisible(R.id.action_chat_translation, false);
             helper.findItemVisible(R.id.action_chat_re_translation, false);
         }
+        helper.findItem(R.id.action_chat_pin).setTitle((message.pinnedInfo()==null||TextUtils.isEmpty(message.pinnedInfo().operatorId())) ? getString(R.string.ease_action_pin):getString(R.string.ease_action_unpin));
+        helper.findItemVisible(R.id.action_chat_pin, chatType==SINGLE_CHAT?false:true);
     }
 
+    @SuppressLint("NonConstantResourceId")
     @Override
     public boolean onMenuItemClick(MenuItemBean item, ChatMessage message) {
-        switch (item.getItemId()){
+        switch (item.getItemId()) {
             case R.id.action_chat_report:
                 if (message.status() == ChatMessage.Status.SUCCESS)
-                    ChatReportActivity.actionStart(getActivity(),message.getMsgId());
+                    ChatReportActivity.actionStart(getActivity(), message.getMsgId());
                 break;
-            case R.id.action_chat_select:
+            case ACTION_CHAT_SELECT:
                 showSelectModelTitle();
                 LiveDataBus.get().with(DemoConstant.EVENT_CHAT_MODEL_TO_SELECT).postValue(EaseEvent.create(DemoConstant.EVENT_CHAT_MODEL_TO_SELECT, EaseEvent.TYPE.NOTIFY));
                 break;
             case R.id.action_chat_translation:
             case R.id.action_chat_re_translation:
                 translationMsg = message;
-                if (!TextUtils.isEmpty(getPreferredLanguageCode())){
+                if (!TextUtils.isEmpty(getPreferredLanguageCode())) {
                     boolean enable = DemoHelper.getInstance().getModel().getDemandTranslationEnable();
-                    if (enable){
-                        translationMessage(message,getPreferredLanguageCode());
+                    if (enable) {
+                        translationMessage(message, getPreferredLanguageCode());
                         break;
-                    }else {
+                    } else {
                         translationType = DemoConstant.TRANSLATION_DEMAND_ENABLE;
                     }
-                }else {
+                } else {
                     translationType = DemoConstant.TRANSLATION_NO_LANGUAGE;
                 }
                 showTranslationDialog();
                 break;
+            case R.id.action_chat_pin:
+                viewModel.pinMessage(message, message.pinnedInfo()==null||TextUtils.isEmpty(message.pinnedInfo().operatorId()));
+                break;
         }
         return super.onMenuItemClick(item, message);
     }
 
+    @SuppressLint("NonConstantResourceId")
     @Override
     public boolean onChatExtendMenuItemClick(View view, int itemId) {
         switch (itemId) {
-            case R.id.extend_item_take_picture:
+            case EXTEND_ITEM_TAKE_PICTURE:
                 if (!PermissionsManager.getInstance().hasPermission(mContext, Manifest.permission.CAMERA)) {
                     PermissionsManager.getInstance().requestPermissionsIfNecessaryForResult(mContext
                             , new String[]{Manifest.permission.CAMERA}, null);
                     return true;
                 }
                 break;
-            case R.id.extend_item_picture:
-                if(!PermissionCompat.checkMediaPermission(mContext, requestImagePermission, Manifest.permission.READ_MEDIA_IMAGES)) {
+            case EXTEND_ITEM_PICTURE:
+                if (!PermissionCompat.checkMediaPermission(mContext, requestImagePermission, Manifest.permission.READ_MEDIA_IMAGES)) {
                     return true;
                 }
                 break;
-            case R.id.extend_item_video:
-                if(!PermissionCompat.checkMediaPermission(mContext, requestVideoPermission, Manifest.permission.READ_MEDIA_VIDEO, Manifest.permission.CAMERA)) {
+            case EXTEND_ITEM_VIDEO:
+                if (!PermissionCompat.checkMediaPermission(mContext, requestVideoPermission, Manifest.permission.READ_MEDIA_VIDEO, Manifest.permission.CAMERA)) {
                     return true;
                 }
                 break;
-            case R.id.extend_item_file:
-                if(!PermissionCompat.checkMediaPermission(mContext, requestFilePermission, Manifest.permission.READ_MEDIA_IMAGES, Manifest.permission.READ_MEDIA_VIDEO)) {
+            case EXTEND_ITEM_FILE:
+                if (!PermissionCompat.checkMediaPermission(mContext, requestFilePermission, Manifest.permission.READ_MEDIA_IMAGES, Manifest.permission.READ_MEDIA_VIDEO)) {
                     return true;
                 }
                 break;
@@ -353,16 +520,16 @@ public boolean onChatExtendMenuItemClick(View view, int itemId) {
     }
 
     private void onRequestResult(Map<String, Boolean> result, int requestCode) {
-        if(result != null && result.size() > 0) {
+        if (result != null && result.size() > 0) {
             for (Map.Entry<String, Boolean> entry : result.entrySet()) {
                 EMLog.e("chat", "onRequestResult: " + entry.getKey() + "  " + entry.getValue());
             }
-            if(PermissionCompat.getMediaAccess(mContext) != PermissionCompat.StorageAccess.Denied) {
-                if(requestCode == REQUEST_CODE_STORAGE_PICTURE) {
+            if (PermissionCompat.getMediaAccess(mContext) != PermissionCompat.StorageAccess.Denied) {
+                if (requestCode == REQUEST_CODE_STORAGE_PICTURE) {
                     selectPicFromLocal();
-                }else if(requestCode == REQUEST_CODE_STORAGE_VIDEO) {
+                } else if (requestCode == REQUEST_CODE_STORAGE_VIDEO) {
                     selectVideoFromLocal();
-                }else if(requestCode == REQUEST_CODE_STORAGE_FILE) {
+                } else if (requestCode == REQUEST_CODE_STORAGE_FILE) {
                     selectFileFromLocal();
                 }
             }
@@ -373,14 +540,14 @@ private void showSelectModelTitle() {
         titleBar.setVisibility(View.VISIBLE);
         titleBar.setDisplayHomeAsUpEnabled(false);
         titleBar.setTitlePosition(EaseTitleBar.TitlePosition.Left);
-        titleBar.setRightTitle(getString(R.string.ease_cancel));
+        titleBar.setRightTitle(getString(io.agora.chat.uikit.R.string.ease_cancel));
         titleBar.getRightText().setTextColor(ContextCompat.getColor(mContext, R.color.color_action_text));
         titleBar.getIcon().setVisibility(View.VISIBLE);
         titleBar.getLeftLayout().setVisibility(View.GONE);
         ViewParent parent = titleBar.getTitle().getParent();
-        if(parent instanceof ViewGroup) {
+        if (parent instanceof ViewGroup) {
             ViewGroup.LayoutParams params = ((ViewGroup) parent).getLayoutParams();
-            if(params instanceof RelativeLayout.LayoutParams) {
+            if (params instanceof RelativeLayout.LayoutParams) {
                 ((RelativeLayout.LayoutParams) params).leftMargin = (int) EaseUtils.dip2px(mContext, 12);
             }
         }
@@ -390,9 +557,9 @@ public void onRightClick(View view) {
                 LiveDataBus.get().with(DemoConstant.EVENT_CHAT_MODEL_TO_NORMAL).postValue(EaseEvent.create(DemoConstant.EVENT_CHAT_MODEL_TO_NORMAL, EaseEvent.TYPE.NOTIFY));
             }
         });
-        if(chatType != SINGLE_CHAT) {
+        if (chatType != SINGLE_CHAT) {
             boolean hasProvided = DemoHelper.getInstance().setGroupInfo(mContext, conversationId, titleBar.getTitle(), titleBar.getIcon());
-            if(!hasProvided) {
+            if (!hasProvided) {
                 setGroupInfo();
             }
         } else {
@@ -404,16 +571,16 @@ public void onRightClick(View view) {
 
     private void setGroupInfo() {
         String title = "";
-        if(chatType == EaseChatType.GROUP_CHAT) {
+        if (chatType == EaseChatType.GROUP_CHAT) {
             title = GroupHelper.getGroupName(conversationId);
             titleBar.getIcon().setImageResource(R.drawable.icon);
-        }else if(chatType == EaseChatType.CHATROOM) {
+        } else if (chatType == EaseChatType.CHATROOM) {
             titleBar.getIcon().setImageResource(R.drawable.icon);
             ChatRoom room = ChatClient.getInstance().chatroomManager().getChatRoom(conversationId);
-            if(room == null) {
+            if (room == null) {
                 return;
             }
-            title =  TextUtils.isEmpty(room.getName()) ? conversationId : room.getName();
+            title = TextUtils.isEmpty(room.getName()) ? conversationId : room.getName();
         }
         titleBar.getTitle().setText(title);
     }
@@ -500,22 +667,22 @@ public void onModifyMessageSuccess(ChatMessage messageModified) {
     }
 
 
-    private void translationMessage(ChatMessage message,String language){
+    private void translationMessage(ChatMessage message, String language) {
         List<String> list = new ArrayList<>();
         list.add(language);
-        viewModel.translationMessage(message,list);
+        viewModel.translationMessage(message, list);
     }
 
     @Override
     public void addMsgAttrsBeforeSend(ChatMessage message) {
         super.addMsgAttrsBeforeSend(message);
         String[] autoLanguage = TranslationHelper.getLanguageByType(DemoConstant.TRANSLATION_TYPE_AUTO, conversationId);
-        if (!TextUtils.isEmpty(autoLanguage[0])){
-            translationMessage(message,autoLanguage[0]);
+        if (!TextUtils.isEmpty(autoLanguage[0])) {
+            translationMessage(message, autoLanguage[0]);
         }
     }
 
-    private void setPickAtContentStyle(Editable editable){
+    private void setPickAtContentStyle(Editable editable) {
         Pattern pattern = Pattern.compile("@([^\\s]+)");
         Matcher matcher = pattern.matcher(editable);
         while (matcher.find()) {
@@ -528,18 +695,18 @@ private void setPickAtContentStyle(Editable editable){
         }
     }
 
-    private boolean removePickAt(View v, int keyCode, KeyEvent event){
+    private boolean removePickAt(View v, int keyCode, KeyEvent event) {
         if (keyCode == KeyEvent.KEYCODE_DEL && event.getAction() == KeyEvent.ACTION_DOWN && v instanceof EditText) {
-            int selectionStart = ((EditText)v).getSelectionStart();
-            int selectionEnd = ((EditText)v).getSelectionEnd();
-            SpannableStringBuilder text = (SpannableStringBuilder) ((EditText)v).getText();
+            int selectionStart = ((EditText) v).getSelectionStart();
+            int selectionEnd = ((EditText) v).getSelectionEnd();
+            SpannableStringBuilder text = (SpannableStringBuilder) ((EditText) v).getText();
             ForegroundColorSpan[] spans = text.getSpans(0, text.length(), ForegroundColorSpan.class);
             for (ForegroundColorSpan span : spans) {
                 int spanStart = text.getSpanStart(span);
                 int spanEnd = text.getSpanEnd(span);
                 if (selectionStart >= spanStart && selectionEnd <= spanEnd) {
-                    if (spanStart != -1 && spanEnd != -1){
-                        text.delete(spanStart+1, spanEnd);
+                    if (spanStart != -1 && spanEnd != -1) {
+                        text.delete(spanStart + 1, spanEnd);
                     }
                 }
             }
@@ -547,14 +714,16 @@ private boolean removePickAt(View v, int keyCode, KeyEvent event){
         return false;
     }
 
-    private void showTranslationDialog(){
-        if (translationType == 0){ return;}
+    private void showTranslationDialog() {
+        if (translationType == 0) {
+            return;
+        }
         translationDialog = new AlertDialog.Builder(mContext)
                 .setContentView(R.layout.dialog_auto_translation)
                 .setText(R.id.tv_content,
                         translationType == DemoConstant.TRANSLATION_NO_LANGUAGE ?
                                 getString(R.string.translation_auto_about_info)
-                              : getString(R.string.translation_unable)
+                                : getString(R.string.translation_unable)
                 )
                 .setText(R.id.btn_ok, getString(R.string.translation_setting))
                 .setLayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.WRAP_CONTENT)
@@ -564,11 +733,11 @@ private void showTranslationDialog(){
                     @Override
                     public void onClick(View v) {
                         Intent starter;
-                        if (translationType == DemoConstant.TRANSLATION_NO_LANGUAGE){
+                        if (translationType == DemoConstant.TRANSLATION_NO_LANGUAGE) {
                             starter = new Intent(mContext, LanguageActivity.class);
                             starter.putExtra(DemoConstant.TRANSLATION_TYPE, DemoConstant.TRANSLATION_TYPE_MESSAGE);
                             starter.putExtra(DemoConstant.TRANSLATION_SELECT_MAX_COUNT, 1);
-                        }else {
+                        } else {
                             starter = new Intent(mContext, TranslationSettingsActivity.class);
                         }
                         launcher.launch(starter);
@@ -583,7 +752,7 @@ public void onClick(View v) {
         translationDialog.show();
     }
 
-    private String getPreferredLanguageCode(){
+    private String getPreferredLanguageCode() {
         String[] language = TranslationHelper.getLanguageByType(DemoConstant.TRANSLATION_TYPE_MESSAGE, "");
         return language[0];
     }
@@ -597,8 +766,53 @@ public void onResume() {
     @Override
     public void onPause() {
         super.onPause();
-        if(mContext != null && mContext.isFinishing()) {
+        if (mContext != null && mContext.isFinishing()) {
             isDestroy = true;
         }
     }
+
+    /**
+     * Parse Resource<T>
+     *
+     * @param response
+     * @param callback
+     * @param <T>
+     */
+    public <T> void parseResource(Resource<T> response, @NonNull OnResourceParseCallback<T> callback) {
+        if (response == null) {
+            return;
+        }
+        if (response.status == Status.SUCCESS) {
+            callback.onHideLoading();
+            callback.onSuccess(response.data);
+        } else if (response.status == Status.ERROR) {
+            callback.onHideLoading();
+            callback.onError(response.errorCode, response.getMessage());
+        } else if (response.status == Status.LOADING) {
+            callback.onLoading(response.data);
+        }
+    }
+
+    @Override
+    public void onMessageReceived(List<ChatMessage> messages) {
+
+    }
+
+    @Override
+    public void onMessagePinChanged(String messageId, String conversationId, MessagePinInfo.PinOperation pinOperation, MessagePinInfo pinInfo) {
+        ChatMessage message = ChatClient.getInstance().chatManager().getMessage(messageId);
+        if(message!=null) {
+            updatePinMessage(message,pinInfo.operatorId());
+        }else{
+            viewModel.getPinnedMessagesFromServer(conversationId);
+        }
+    }
+
+
+    @Override
+    public void onDestroy() {
+        super.onDestroy();
+        ChatClient.getInstance().chatManager().removeMessageListener(this);
+    }
+
 }
diff --git a/app/src/main/java/io/agora/chatdemo/chat/PinListItemSpaceDecoration.java b/app/src/main/java/io/agora/chatdemo/chat/PinListItemSpaceDecoration.java
new file mode 100644
index 00000000..6cc676f9
--- /dev/null
+++ b/app/src/main/java/io/agora/chatdemo/chat/PinListItemSpaceDecoration.java
@@ -0,0 +1,29 @@
+package io.agora.chatdemo.chat;
+
+import android.graphics.Rect;
+import android.view.View;
+
+import androidx.recyclerview.widget.RecyclerView;
+
+public class PinListItemSpaceDecoration extends RecyclerView.ItemDecoration {
+   private int space;
+
+   public PinListItemSpaceDecoration(int space) {
+      this.space = space;
+   }
+
+   @Override
+   public void getItemOffsets(Rect outRect, View view, RecyclerView parent, RecyclerView.State state) {
+      outRect.left = space;
+      outRect.right = space;
+      outRect.bottom = space;
+
+
+      if (parent.getChildAdapterPosition(view) == 0) {
+         outRect.top = space;
+      } else {
+         outRect.top = 0;
+      }
+   }
+}
+
diff --git a/app/src/main/java/io/agora/chatdemo/chat/adapter/PinMessageListAdapter.java b/app/src/main/java/io/agora/chatdemo/chat/adapter/PinMessageListAdapter.java
new file mode 100644
index 00000000..a8bf64ba
--- /dev/null
+++ b/app/src/main/java/io/agora/chatdemo/chat/adapter/PinMessageListAdapter.java
@@ -0,0 +1,44 @@
+package io.agora.chatdemo.chat.adapter;
+
+import android.view.LayoutInflater;
+import android.view.ViewGroup;
+
+import androidx.annotation.NonNull;
+
+import io.agora.chat.ChatMessage;
+import io.agora.chat.uikit.adapter.EaseBaseRecyclerViewAdapter;
+import io.agora.chatdemo.R;
+import io.agora.chatdemo.chat.viewholder.pinmessage.PinDefaultViewHolder;
+import io.agora.chatdemo.chat.viewholder.pinmessage.PinImageMessageViewHolder;
+import io.agora.chatdemo.chat.viewholder.pinmessage.PinTextMessageViewHolder;
+
+
+public class PinMessageListAdapter extends EaseBaseRecyclerViewAdapter<ChatMessage> {
+
+    @Override
+    public int getItemNotEmptyViewType(int position) {
+        return mData.get(position).getType().ordinal();
+    }
+
+    @Override
+    public ViewHolder<ChatMessage> getViewHolder(ViewGroup parent, int viewType) {
+        ViewHolder viewHolder ;
+        switch (ChatMessage.Type.values()[viewType]) {
+            case TXT:
+                viewHolder=new PinTextMessageViewHolder(mItemSubViewListener,LayoutInflater.from(mContext).inflate(R.layout.pinlist_text, parent, false));
+                break;
+            case IMAGE:
+                viewHolder=new PinImageMessageViewHolder(mItemSubViewListener,LayoutInflater.from(mContext).inflate(R.layout.pinlist_image, parent, false));
+                break;
+            default:
+                viewHolder=new PinDefaultViewHolder(mItemSubViewListener,LayoutInflater.from(mContext).inflate(R.layout.pinlist_default, parent, false));
+                break;
+        }
+        return viewHolder;
+    }
+
+    @Override
+    public void onBindViewHolder(@NonNull ViewHolder<ChatMessage> holder, int position) {
+        super.onBindViewHolder(holder, position);
+    }
+}
diff --git a/app/src/main/java/io/agora/chatdemo/chat/chatrow/ChatRowCustomTextView.java b/app/src/main/java/io/agora/chatdemo/chat/chatrow/ChatRowCustomTextView.java
index c2314b75..03b23a55 100644
--- a/app/src/main/java/io/agora/chatdemo/chat/chatrow/ChatRowCustomTextView.java
+++ b/app/src/main/java/io/agora/chatdemo/chat/chatrow/ChatRowCustomTextView.java
@@ -95,11 +95,11 @@ protected void onFindViewById() {
         inflater.inflate(showSenderType
                         ? R.layout.layout_custom_content_fill_send
                         : R.layout.layout_custom_content_fill_received
-                        , findViewById(R.id.flContentFillArea), true);
+                        , findViewById(io.agora.chat.uikit.R.id.flContentFillArea), true);
         inflater.inflate(showSenderType
                         ? R.layout.layout_custom_bubble_bottom_fill_send
                         : R.layout.layout_custom_bubble_bottom_fill_received
-                        , findViewById(R.id.flBubbleBottomFillArea), true);
+                        , findViewById(io.agora.chat.uikit.R.id.flBubbleBottomFillArea), true);
 
         // flContentFillArea
         mTitle = findViewById(R.id.tv_title);
@@ -120,7 +120,7 @@ public void onSetUpView() {
         mDescribe.setVisibility(GONE);
         mTitle.setVisibility(GONE);
 
-        findViewById(R.id.flContentFillArea).setOnClickListener(new OnClickListener() {
+        findViewById(io.agora.chat.uikit.R.id.flContentFillArea).setOnClickListener(new OnClickListener() {
             @Override
             public void onClick(View v) {
                 if (urlPreviewMap.containsKey(message.getMsgId())){
@@ -129,7 +129,7 @@ public void onClick(View v) {
             }
         });
 
-        findViewById(R.id.flContentFillArea).setOnLongClickListener(new OnLongClickListener() {
+        findViewById(io.agora.chat.uikit.R.id.flContentFillArea).setOnLongClickListener(new OnLongClickListener() {
             @Override
             public boolean onLongClick(View v) {
                 if (itemClickListener != null) {
diff --git a/app/src/main/java/io/agora/chatdemo/chat/chatrow/ChatRowSystemNotification.java b/app/src/main/java/io/agora/chatdemo/chat/chatrow/ChatRowSystemNotification.java
index d9e6a7cb..797b2b37 100644
--- a/app/src/main/java/io/agora/chatdemo/chat/chatrow/ChatRowSystemNotification.java
+++ b/app/src/main/java/io/agora/chatdemo/chat/chatrow/ChatRowSystemNotification.java
@@ -76,7 +76,7 @@ public void onSetUpView() {
 
     public SpannableStringBuilder getStrAfter(int start,int end){
         SpannableStringBuilder builder = new SpannableStringBuilder(tv_chatcontent.getText().toString());
-        ForegroundColorSpan graySpan = new ForegroundColorSpan(getResources().getColor(R.color.blue));
+        ForegroundColorSpan graySpan = new ForegroundColorSpan(getResources().getColor(io.agora.chat.uikit.R.color.blue));
         StyleSpan styleSpan = new StyleSpan(android.graphics.Typeface.BOLD);
         builder.setSpan(styleSpan,start,end,Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
         return builder;
diff --git a/app/src/main/java/io/agora/chatdemo/chat/viewholder/pinmessage/PinDefaultViewHolder.java b/app/src/main/java/io/agora/chatdemo/chat/viewholder/pinmessage/PinDefaultViewHolder.java
new file mode 100644
index 00000000..6d55031a
--- /dev/null
+++ b/app/src/main/java/io/agora/chatdemo/chat/viewholder/pinmessage/PinDefaultViewHolder.java
@@ -0,0 +1,68 @@
+package io.agora.chatdemo.chat.viewholder.pinmessage;
+
+
+import android.view.View;
+import android.widget.ImageView;
+import android.widget.TextView;
+
+import androidx.annotation.NonNull;
+
+import java.text.SimpleDateFormat;
+import java.util.Date;
+import java.util.TimeZone;
+
+import io.agora.chat.ChatMessage;
+import io.agora.chat.FileMessageBody;
+import io.agora.chat.uikit.adapter.EaseBaseRecyclerViewAdapter;
+import io.agora.chatdemo.R;
+
+public class PinDefaultViewHolder extends EaseBaseRecyclerViewAdapter.ViewHolder<ChatMessage> {
+    private final EaseBaseRecyclerViewAdapter.OnItemSubViewClickListener mItemSubViewListener;
+    private TextView from;
+    private TextView content;
+    private TextView time;
+    private ImageView state;
+    public PinDefaultViewHolder(EaseBaseRecyclerViewAdapter.OnItemSubViewClickListener mItemSubViewListener, @NonNull View itemView) {
+        super(itemView);
+        this.mItemSubViewListener = mItemSubViewListener;
+    }
+
+    @Override
+    public void initView(View itemView) {
+        super.initView(itemView);
+        from = findViewById(R.id.tv_from);
+        content = findViewById(R.id.tv_content);
+        time = findViewById(R.id.tv_time);
+        state=findViewById(R.id.iv_state);
+    }
+
+    @Override
+    public void setData(ChatMessage message, int position) {
+        String operatorId = message.pinnedInfo().operatorId();
+        long pinTime = message.pinnedInfo().pinTime();
+
+        from.setText(operatorId +" pinned "+message.getFrom()+"'s message");
+        if(message.getType()== ChatMessage.Type.FILE) {
+            FileMessageBody body= (FileMessageBody) message.getBody();
+            content.setText("[File]"+body.displayName());
+        }else if(message.getType()== ChatMessage.Type.CUSTOM) {
+            content.setText("[Custom]");
+        }else{
+            content.setText("["+message.getType().name()+"]");
+        }
+
+        SimpleDateFormat sdf = new SimpleDateFormat("MM-dd, HH:mm");
+        sdf.setTimeZone(TimeZone.getTimeZone("GMT+8"));
+        String formattedDate = sdf.format(new Date(pinTime));
+        time.setText(formattedDate);
+
+        state.setOnClickListener(new View.OnClickListener() {
+            @Override
+            public void onClick(View v) {
+                if(mItemSubViewListener!=null) {
+                    mItemSubViewListener.onItemSubViewClick(v, position);
+                }
+            }
+        });
+    }
+}
diff --git a/app/src/main/java/io/agora/chatdemo/chat/viewholder/pinmessage/PinImageMessageViewHolder.java b/app/src/main/java/io/agora/chatdemo/chat/viewholder/pinmessage/PinImageMessageViewHolder.java
new file mode 100644
index 00000000..9dbcb0fb
--- /dev/null
+++ b/app/src/main/java/io/agora/chatdemo/chat/viewholder/pinmessage/PinImageMessageViewHolder.java
@@ -0,0 +1,65 @@
+package io.agora.chatdemo.chat.viewholder.pinmessage;
+
+
+import android.view.View;
+import android.widget.ImageView;
+import android.widget.TextView;
+
+import androidx.annotation.NonNull;
+
+import com.bumptech.glide.Glide;
+
+import java.text.SimpleDateFormat;
+import java.util.Date;
+import java.util.TimeZone;
+
+import io.agora.chat.ChatMessage;
+import io.agora.chat.ImageMessageBody;
+import io.agora.chat.uikit.adapter.EaseBaseRecyclerViewAdapter;
+import io.agora.chatdemo.R;
+
+public class PinImageMessageViewHolder extends EaseBaseRecyclerViewAdapter.ViewHolder<ChatMessage> {
+    private final EaseBaseRecyclerViewAdapter.OnItemSubViewClickListener mItemSubViewListener;
+    private TextView from;
+    private ImageView content;
+    private TextView time;
+    private ImageView state;
+    public PinImageMessageViewHolder(EaseBaseRecyclerViewAdapter.OnItemSubViewClickListener mItemSubViewListener, @NonNull View itemView) {
+        super(itemView);
+        this.mItemSubViewListener = mItemSubViewListener;
+    }
+
+    @Override
+    public void initView(View itemView) {
+        super.initView(itemView);
+        from = findViewById(R.id.tv_from);
+        content = findViewById(R.id.iv_content);
+        time = findViewById(R.id.tv_time);
+        state=findViewById(R.id.iv_state);
+    }
+
+    @Override
+    public void setData(ChatMessage message, int position) {
+        String operatorId = message.pinnedInfo().operatorId();
+        long pinTime = message.pinnedInfo().pinTime();
+
+        from.setText(operatorId +" pinned "+message.getFrom()+"'s message");
+
+        ImageMessageBody body = (ImageMessageBody) message.getBody();
+        Glide.with(itemView.getContext()).load(body.getRemoteUrl()).into(content);
+
+        SimpleDateFormat sdf = new SimpleDateFormat("MM-dd, HH:mm");
+        sdf.setTimeZone(TimeZone.getTimeZone("GMT+8"));
+        String formattedDate = sdf.format(new Date(pinTime));
+        time.setText(formattedDate);
+
+        state.setOnClickListener(new View.OnClickListener() {
+            @Override
+            public void onClick(View v) {
+                if(mItemSubViewListener!=null) {
+                    mItemSubViewListener.onItemSubViewClick(v, position);
+                }
+            }
+        });
+    }
+}
diff --git a/app/src/main/java/io/agora/chatdemo/chat/viewholder/pinmessage/PinTextMessageViewHolder.java b/app/src/main/java/io/agora/chatdemo/chat/viewholder/pinmessage/PinTextMessageViewHolder.java
new file mode 100644
index 00000000..c713744f
--- /dev/null
+++ b/app/src/main/java/io/agora/chatdemo/chat/viewholder/pinmessage/PinTextMessageViewHolder.java
@@ -0,0 +1,68 @@
+package io.agora.chatdemo.chat.viewholder.pinmessage;
+
+
+import android.view.View;
+import android.widget.ImageView;
+import android.widget.TextView;
+
+import androidx.annotation.NonNull;
+
+import java.text.SimpleDateFormat;
+import java.util.Date;
+import java.util.TimeZone;
+
+import io.agora.chat.ChatMessage;
+import io.agora.chat.TextMessageBody;
+import io.agora.chat.uikit.adapter.EaseBaseRecyclerViewAdapter;
+import io.agora.chatdemo.R;
+
+public class PinTextMessageViewHolder extends EaseBaseRecyclerViewAdapter.ViewHolder<ChatMessage> {
+
+    private final EaseBaseRecyclerViewAdapter.OnItemSubViewClickListener mItemSubViewListener;
+    private TextView from;
+    private TextView content;
+    private TextView time;
+    private ImageView state;
+
+    public PinTextMessageViewHolder(EaseBaseRecyclerViewAdapter.OnItemSubViewClickListener mItemSubViewListener, @NonNull View itemView) {
+        super(itemView);
+        this.mItemSubViewListener = mItemSubViewListener;
+    }
+
+    @Override
+    public void initView(View itemView) {
+        super.initView(itemView);
+        from = findViewById(R.id.tv_from);
+        content = findViewById(R.id.tv_content);
+        time = findViewById(R.id.tv_time);
+        state=findViewById(R.id.iv_state);
+
+    }
+
+    @Override
+    public void setData(ChatMessage message, int position) {
+        String operatorId = message.pinnedInfo().operatorId();
+        long pinTime = message.pinnedInfo().pinTime();
+
+        from.setText(operatorId +" pinned "+message.getFrom()+"'s message");
+
+        TextMessageBody body = (TextMessageBody) message.getBody();
+        content.setText(body.getMessage());
+
+        SimpleDateFormat sdf = new SimpleDateFormat("MM-dd, HH:mm");
+        sdf.setTimeZone(TimeZone.getTimeZone("GMT+8"));
+        String formattedDate = sdf.format(new Date(pinTime));
+        time.setText(formattedDate);
+
+        state.setOnClickListener(new View.OnClickListener() {
+            @Override
+            public void onClick(View v) {
+                if(mItemSubViewListener!=null) {
+                    mItemSubViewListener.onItemSubViewClick(v, position);
+                }
+            }
+        });
+
+
+    }
+}
diff --git a/app/src/main/java/io/agora/chatdemo/chat/viewmodel/ChatViewModel.java b/app/src/main/java/io/agora/chatdemo/chat/viewmodel/ChatViewModel.java
index 7311714d..8684ec3f 100644
--- a/app/src/main/java/io/agora/chatdemo/chat/viewmodel/ChatViewModel.java
+++ b/app/src/main/java/io/agora/chatdemo/chat/viewmodel/ChatViewModel.java
@@ -29,9 +29,11 @@ public class ChatViewModel extends AndroidViewModel {
     private SingleSourceLiveData<Resource<Boolean>> makeConversationReadObservable;
     private SingleSourceLiveData<Resource< List<String>>> getNoPushUsersObservable;
     private SingleSourceLiveData<Resource<Boolean>> setNoPushUsersObservable;
-    private SingleSourceLiveData<Resource<Boolean>> chatManagerObservable;
+    private SingleSourceLiveData<Resource<Boolean>> reportMessageObservable;
     private SingleSourceLiveData<Resource<Boolean>> removeMessagesObservable;
     private SingleSourceLiveData<Resource<ChatMessage>> translationMessagesObservable;
+    private SingleSourceLiveData<Resource<ChatMessage>> pinMessageObservable;
+    private SingleSourceLiveData<Resource<List<ChatMessage>>> getPinMessageObservable;
 
     public ChatViewModel(@NonNull Application application) {
         super(application);
@@ -43,9 +45,11 @@ public ChatViewModel(@NonNull Application application) {
         getNoPushUsersObservable = new SingleSourceLiveData<>();
         setNoPushUsersObservable = new SingleSourceLiveData<>();
         presenceObservable = new SingleSourceLiveData<>();
-        chatManagerObservable = new SingleSourceLiveData<>();
+        reportMessageObservable = new SingleSourceLiveData<>();
         removeMessagesObservable = new SingleSourceLiveData<>();
         translationMessagesObservable = new SingleSourceLiveData<>();
+        pinMessageObservable = new SingleSourceLiveData<>();
+        getPinMessageObservable = new SingleSourceLiveData<>();
     }
     public LiveData<Resource<List<Presence>>> getPresenceObservable(){
         return presenceObservable;
@@ -56,8 +60,8 @@ public void fetchPresenceStatus(List<String> userIds){
     public LiveData<Resource<ChatRoom>> getChatRoomObservable() {
         return chatRoomObservable;
     }
-    public LiveData<Resource<Boolean>> getChatManagerObservable(){
-        return chatManagerObservable;
+    public LiveData<Resource<Boolean>> getReportMessageObservable(){
+        return reportMessageObservable;
     }
     public LiveData<Resource<List<String>>> getNoPushUsersObservable() {
         return getNoPushUsersObservable;
@@ -104,7 +108,7 @@ public LiveData<Resource<Boolean>> getMakeConversationReadObservable() {
     }
 
     public void reportMessage(String reportMsgId, String reportType, String reportReason ){
-        chatManagerObservable.setSource(chatManagerRepository.reportMessage(reportMsgId,reportType,reportReason));
+        reportMessageObservable.setSource(chatManagerRepository.reportMessage(reportMsgId,reportType,reportReason));
     }
 
     public LiveData<Resource<Boolean>> getRemoveMessagesObservable() {
@@ -129,4 +133,19 @@ public void removeMessagesFromServer(String conversationId, Conversation.Convers
     public void translationMessage(ChatMessage message,List<String> targetLanguage){
         translationMessagesObservable.setSource(chatManagerRepository.translationMessage(message,targetLanguage));
     }
+
+    public void pinMessage(ChatMessage message,boolean isPinned) {
+        pinMessageObservable.setSource(chatManagerRepository.pinMessage(message,isPinned));
+    }
+
+    public LiveData<Resource<ChatMessage>> pinMessageObservable(){
+        return pinMessageObservable;
+    }
+
+    public void getPinnedMessagesFromServer(String conversationId) {
+        getPinMessageObservable.setSource(chatManagerRepository.getPinnedMessagesFromServer(conversationId));
+    }
+    public LiveData<Resource<List<ChatMessage>>> getPinMessageObservable(){
+        return getPinMessageObservable;
+    }
 }
diff --git a/app/src/main/java/io/agora/chatdemo/chatthread/ChatThreadActivity.java b/app/src/main/java/io/agora/chatdemo/chatthread/ChatThreadActivity.java
index 1c804b01..b790507e 100644
--- a/app/src/main/java/io/agora/chatdemo/chatthread/ChatThreadActivity.java
+++ b/app/src/main/java/io/agora/chatdemo/chatthread/ChatThreadActivity.java
@@ -215,7 +215,7 @@ private void dismissMultiSelectView(View view) {
     private void showDeleteDialog(List<String> deleteMsgIdList, View multiView) {
         new SimpleDialog.Builder(this)
                 .setTitle(getString(R.string.chat_delete_multi_messages_title, deleteMsgIdList.size()))
-                .setOnConfirmClickListener(R.string.ease_action_delete, new SimpleDialog.OnConfirmClickListener() {
+                .setOnConfirmClickListener(io.agora.chat.uikit.R.string.ease_action_delete, new SimpleDialog.OnConfirmClickListener() {
                     @Override
                     public void onConfirmClick(View view) {
                         dismissMultiSelectView(multiView);
@@ -335,7 +335,7 @@ public void onHideLoading() {
                 e.printStackTrace();
             }
             if(!TextUtils.isEmpty(to) && mForwardMsgIdList != null) {
-                ChatMessage chatMessage = ChatMessage.createCombinedSendMessage(getString(R.string.ease_combine_default)
+                ChatMessage chatMessage = ChatMessage.createCombinedSendMessage(getString(io.agora.chat.uikit.R.string.ease_combine_default)
                         , EaseChatMessageMultiSelectHelper.getCombineMessageSummary(mForwardMsgIdList)
                         , getString(R.string.forward_compatible_text), mForwardMsgIdList, to);
                 if(chatType == ChatMessage.ChatType.GroupChat) {
diff --git a/app/src/main/java/io/agora/chatdemo/chatthread/ChatThreadCreateActivity.java b/app/src/main/java/io/agora/chatdemo/chatthread/ChatThreadCreateActivity.java
index 3493c85a..97188f0d 100644
--- a/app/src/main/java/io/agora/chatdemo/chatthread/ChatThreadCreateActivity.java
+++ b/app/src/main/java/io/agora/chatdemo/chatthread/ChatThreadCreateActivity.java
@@ -65,7 +65,7 @@ public void onBackPress(View view) {
                         @Override
                         public boolean onChatExtendMenuItemClick(View view, int itemId) {
                             EMLog.e("TAG", "onChatExtendMenuItemClick");
-                            if (itemId == R.id.extend_item_take_picture) {
+                            if (itemId == io.agora.chat.uikit.R.id.extend_item_take_picture) {
                                 // check if has permissions
                                 if (!PermissionsManager.getInstance().hasPermission(mContext, Manifest.permission.CAMERA)) {
                                     PermissionsManager.getInstance().requestPermissionsIfNecessaryForResult(mContext
@@ -78,14 +78,14 @@ public boolean onChatExtendMenuItemClick(View view, int itemId) {
                                     return true;
                                 }
                                 return false;
-                            } else if (itemId == R.id.extend_item_picture || itemId == R.id.extend_item_file) {
+                            } else if (itemId == io.agora.chat.uikit.R.id.extend_item_picture || itemId == io.agora.chat.uikit.R.id.extend_item_file) {
                                 if (!PermissionsManager.getInstance().hasPermission(mContext, Manifest.permission.READ_EXTERNAL_STORAGE)) {
                                     PermissionsManager.getInstance().requestPermissionsIfNecessaryForResult(mContext
                                             , new String[]{Manifest.permission.READ_EXTERNAL_STORAGE}, null);
                                     return true;
                                 }
                                 return false;
-                            } else if (itemId == R.id.extend_item_video) {
+                            } else if (itemId == io.agora.chat.uikit.R.id.extend_item_video) {
                                 if (!PermissionsManager.getInstance().hasPermission(mContext, Manifest.permission.CAMERA)) {
                                     PermissionsManager.getInstance().requestPermissionsIfNecessaryForResult(mContext
                                             , new String[]{Manifest.permission.CAMERA}, null);
diff --git a/app/src/main/java/io/agora/chatdemo/chatthread/ChatThreadFragment.java b/app/src/main/java/io/agora/chatdemo/chatthread/ChatThreadFragment.java
index 0676047e..8119f635 100644
--- a/app/src/main/java/io/agora/chatdemo/chatthread/ChatThreadFragment.java
+++ b/app/src/main/java/io/agora/chatdemo/chatthread/ChatThreadFragment.java
@@ -51,16 +51,15 @@ public void onPreMenu(EasePopupWindowHelper helper, ChatMessage message) {
         boolean isRecall = message.getBooleanAttribute(DemoConstant.MESSAGE_TYPE_RECALL, false);
         if(isRecall) {
             helper.showHeaderView(false);
-            helper.findItemVisible(R.id.action_chat_delete, true);
-            helper.findItemVisible(R.id.action_chat_unsent, false);
-            helper.findItemVisible(R.id.action_chat_recall, false);
-            helper.findItemVisible(R.id.action_chat_copy, false);
+            helper.findItemVisible(io.agora.chat.uikit.R.id.action_chat_delete, true);
+            helper.findItemVisible(io.agora.chat.uikit.R.id.action_chat_recall, false);
+            helper.findItemVisible(io.agora.chat.uikit.R.id.action_chat_copy, false);
         }
     }
 
     @Override
     public boolean onMenuItemClick(MenuItemBean item, ChatMessage message) {
-        if(item.getItemId() == R.id.action_chat_select) {
+        if(item.getItemId() == io.agora.chat.uikit.R.id.action_chat_select) {
             showSelectModelTitle();
         }
         return super.onMenuItemClick(item, message);
@@ -80,7 +79,7 @@ public void recallFail(int code, String errorMsg) {
 
     private void showSelectModelTitle() {
         titleBar.setDisplayHomeAsUpEnabled(false);
-        titleBar.setRightTitle(getString(R.string.ease_cancel));
+        titleBar.setRightTitle(getString(io.agora.chat.uikit.R.string.ease_cancel));
         titleBar.getRightText().setTextColor(ContextCompat.getColor(mContext, R.color.color_action_text));
         titleBar.getRightText().setVisibility(View.VISIBLE);
         titleBar.getRightImage().setVisibility(View.GONE);
diff --git a/app/src/main/java/io/agora/chatdemo/contact/AddContactOrGroupFragment.java b/app/src/main/java/io/agora/chatdemo/contact/AddContactOrGroupFragment.java
index e09a8b94..0f7760f7 100644
--- a/app/src/main/java/io/agora/chatdemo/contact/AddContactOrGroupFragment.java
+++ b/app/src/main/java/io/agora/chatdemo/contact/AddContactOrGroupFragment.java
@@ -50,7 +50,7 @@ public void onClick(View v) {
 
     @Override
     public int getTitleBarRightText() {
-        return R.string.ease_cancel;
+        return io.agora.chat.uikit.R.string.ease_cancel;
     }
 
     @Override
diff --git a/app/src/main/java/io/agora/chatdemo/contact/SearchContactFragment.java b/app/src/main/java/io/agora/chatdemo/contact/SearchContactFragment.java
index d9a730f5..d8b6df7f 100644
--- a/app/src/main/java/io/agora/chatdemo/contact/SearchContactFragment.java
+++ b/app/src/main/java/io/agora/chatdemo/contact/SearchContactFragment.java
@@ -80,7 +80,7 @@ public void onItemClick(View view, int position) {
 
     @Override
     public int getTitleBarRightText() {
-        return R.string.ease_cancel;
+        return io.agora.chat.uikit.R.string.ease_cancel;
     }
 
     @Override
diff --git a/app/src/main/java/io/agora/chatdemo/conversation/ConversationListFragment.java b/app/src/main/java/io/agora/chatdemo/conversation/ConversationListFragment.java
index 3cfaa511..86beae0b 100644
--- a/app/src/main/java/io/agora/chatdemo/conversation/ConversationListFragment.java
+++ b/app/src/main/java/io/agora/chatdemo/conversation/ConversationListFragment.java
@@ -74,7 +74,7 @@ public class ConversationListFragment extends EaseConversationListFragment imple
     public void initView(Bundle savedInstanceState) {
         super.initView(savedInstanceState);
         titleBarLayout = LayoutInflater.from(mContext).inflate(R.layout.layout_conversation_list_title_bar, null);
-        ViewGroup.LayoutParams titleBarParams = new ViewGroup.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, (int) getResources().getDimension(R.dimen.ease_common_title_bar_height));
+        ViewGroup.LayoutParams titleBarParams = new ViewGroup.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, (int) getResources().getDimension(io.agora.chat.uikit.R.dimen.ease_common_title_bar_height));
         titleBarLayout.setLayoutParams(titleBarParams);
         llRoot.addView(titleBarLayout, 0);
         ImageView rightIcon = titleBarLayout.findViewById(R.id.right_image);
@@ -114,7 +114,6 @@ public void afterTextChanged(Editable s) {
         presenceView = titleBarLayout.findViewById(R.id.presence_view);
         if(presenceView != null) {
             presenceView.setVisibility(View.VISIBLE);
-            presenceView.setPresenceTextViewArrowVisible(true);
             presenceView.setNameTextViewVisibility(View.INVISIBLE);
             RelativeLayout.LayoutParams params = (RelativeLayout.LayoutParams) presenceView.getLayoutParams();
             params.setMargins(UIUtils.dp2px(mContext, 16), 0, 0, 0);
@@ -388,7 +387,7 @@ public void onConfirmClick(View view) {
                                 viewModel.publishPresence(getString(PresenceData.LEAVE.getPresence()));
                                 break;
                         }
-                        customView.setText(R.string.ease_presence_custom);
+                        customView.setText(io.agora.chat.uikit.R.string.ease_presence_custom);
                         changePresenceDialog.dismiss();
                     }
                 })
diff --git a/app/src/main/java/io/agora/chatdemo/general/dialog/SimpleDialog.java b/app/src/main/java/io/agora/chatdemo/general/dialog/SimpleDialog.java
index 6f1d523d..98b7029c 100644
--- a/app/src/main/java/io/agora/chatdemo/general/dialog/SimpleDialog.java
+++ b/app/src/main/java/io/agora/chatdemo/general/dialog/SimpleDialog.java
@@ -19,9 +19,9 @@
 import androidx.annotation.NonNull;
 import androidx.annotation.Nullable;
 import androidx.annotation.StringRes;
-import androidx.appcompat.app.AppCompatActivity;
 import androidx.constraintlayout.widget.Group;
 import androidx.core.content.ContextCompat;
+import androidx.fragment.app.FragmentActivity;
 import androidx.fragment.app.FragmentTransaction;
 
 import java.lang.reflect.Field;
@@ -256,12 +256,12 @@ public <T extends View> T getViewById(int viewId) {
     }
 
     public static class Builder {
-        public AppCompatActivity context;
+        public FragmentActivity context;
         private OnConfirmClickListener listener;
         private onCancelClickListener cancelClickListener;
         protected Bundle bundle;
 
-        public Builder(AppCompatActivity context) {
+        public Builder(FragmentActivity context) {
             this.context = context;
             this.bundle = new Bundle();
         }
diff --git a/app/src/main/java/io/agora/chatdemo/general/manager/UsersManager.java b/app/src/main/java/io/agora/chatdemo/general/manager/UsersManager.java
index 78583b23..ae0fb9d7 100644
--- a/app/src/main/java/io/agora/chatdemo/general/manager/UsersManager.java
+++ b/app/src/main/java/io/agora/chatdemo/general/manager/UsersManager.java
@@ -183,7 +183,7 @@ public void onError(int error, String errorMsg) {
 		}
 	}
 	public void setUserInfo(Context context, String username, TextView tvName, ImageView avatar) {
-		setUserInfo(context, username, R.drawable.ease_default_avatar, tvName, avatar);
+		setUserInfo(context, username, io.agora.chat.uikit.R.drawable.ease_default_avatar, tvName, avatar);
 	}
 
 	public void setUserInfo(Context context, String username, @DrawableRes int defaultAvatar, TextView tvName, ImageView avatar) {
@@ -281,6 +281,7 @@ public void updateUserPresenceView(String username,EasePresenceView presenceView
 		Presence presence = DemoHelper.getInstance().getPresences().get(username);
 		if(presence!=null && presenceView != null) {
 			presenceView.setVisibility(View.VISIBLE);
+			presenceView.setPresenceTextViewArrowVisible(true);
 			presenceView.setPresenceData(getUserInfo(username).getAvatar(),presence);
 		}
 	}
diff --git a/app/src/main/java/io/agora/chatdemo/general/models/PresenceData.java b/app/src/main/java/io/agora/chatdemo/general/models/PresenceData.java
index 669d6ce6..67318394 100644
--- a/app/src/main/java/io/agora/chatdemo/general/models/PresenceData.java
+++ b/app/src/main/java/io/agora/chatdemo/general/models/PresenceData.java
@@ -7,12 +7,12 @@
 
 
 public enum PresenceData {
-    ONLINE(R.string.ease_presence_online,R.drawable.ease_presence_online),
-    BUSY(R.string.ease_presence_busy,R.drawable.ease_presence_busy),
-    DO_NOT_DISTURB(R.string.ease_presence_do_not_disturb,R.drawable.ease_presence_do_not_disturb),
-    LEAVE(R.string.ease_presence_leave,R.drawable.ease_presence_leave),
-    OFFLINE(R.string.ease_presence_offline,R.drawable.ease_presence_offline),
-    CUSTOM(R.string.ease_presence_custom,R.drawable.ease_presence_custom)
+    ONLINE(io.agora.chat.uikit.R.string.ease_presence_online,R.drawable.ease_presence_online),
+    BUSY(io.agora.chat.uikit.R.string.ease_presence_busy,R.drawable.ease_presence_busy),
+    DO_NOT_DISTURB(io.agora.chat.uikit.R.string.ease_presence_do_not_disturb,R.drawable.ease_presence_do_not_disturb),
+    LEAVE(io.agora.chat.uikit.R.string.ease_presence_leave,R.drawable.ease_presence_leave),
+    OFFLINE(io.agora.chat.uikit.R.string.ease_presence_offline,R.drawable.ease_presence_offline),
+    CUSTOM(io.agora.chat.uikit.R.string.ease_presence_custom,R.drawable.ease_presence_custom)
     ;
 
     PresenceData(@StringRes int mPresence, @DrawableRes int mPresenceIcon) {
diff --git a/app/src/main/java/io/agora/chatdemo/general/repositories/EMChatManagerRepository.java b/app/src/main/java/io/agora/chatdemo/general/repositories/EMChatManagerRepository.java
index 02ef2fd1..92e984ae 100644
--- a/app/src/main/java/io/agora/chatdemo/general/repositories/EMChatManagerRepository.java
+++ b/app/src/main/java/io/agora/chatdemo/general/repositories/EMChatManagerRepository.java
@@ -277,4 +277,56 @@ public void onError(int error, String errorMsg) {
         }.asLiveData();
     }
 
+    public LiveData<Resource<ChatMessage>> pinMessage(@NonNull ChatMessage message,boolean isPined) {
+        return new NetworkOnlyResource<ChatMessage>() {
+            @Override
+            protected void createCall(@NonNull ResultCallBack<LiveData<ChatMessage>> callBack) {
+                if(isPined) {
+                    getChatManager().asyncPinMessage(message.getMsgId(), new CallBack() {
+                        @Override
+                        public void onSuccess() {
+                            callBack.onSuccess(createLiveData(message));
+                        }
+
+                        @Override
+                        public void onError(int code, String error) {
+                            callBack.onError(code, error);
+                        }
+                    });
+                }else{
+                    getChatManager().asyncUnPinMessage(message.getMsgId(), new CallBack() {
+                        @Override
+                        public void onSuccess() {
+                            callBack.onSuccess(createLiveData(message));
+                        }
+
+                        @Override
+                        public void onError(int code, String error) {
+                            callBack.onError(code, error);
+                        }
+                    });
+                }
+
+            }
+        }.asLiveData();
+    }
+
+    public LiveData<Resource<List<ChatMessage>>> getPinnedMessagesFromServer(String conversationId) {
+        return new NetworkOnlyResource<List<ChatMessage>>() {
+            @Override
+            protected void createCall(@NonNull ResultCallBack<LiveData<List<ChatMessage>>> callBack) {
+                getChatManager().asyncGetPinnedMessagesFromServer(conversationId, new ValueCallBack<List<ChatMessage>>() {
+                    @Override
+                    public void onSuccess(List<ChatMessage> value) {
+                        callBack.onSuccess(createLiveData(value));
+                    }
+
+                    @Override
+                    public void onError(int error, String errorMsg) {
+                        callBack.onError(error,errorMsg);
+                    }
+                });
+            }
+        }.asLiveData();
+    }
 }
diff --git a/app/src/main/java/io/agora/chatdemo/general/repositories/EMClientRepository.java b/app/src/main/java/io/agora/chatdemo/general/repositories/EMClientRepository.java
index d5c0cd9e..7448f6e3 100644
--- a/app/src/main/java/io/agora/chatdemo/general/repositories/EMClientRepository.java
+++ b/app/src/main/java/io/agora/chatdemo/general/repositories/EMClientRepository.java
@@ -41,7 +41,6 @@
 import io.agora.chatdemo.general.net.ErrorCode;
 import io.agora.chatdemo.general.net.Resource;
 import io.agora.chatdemo.general.utils.CommonUtils;
-import io.agora.chatdemo.sign.SignInActivity;
 import io.agora.cloud.HttpClientManager;
 import io.agora.cloud.HttpResponse;
 import io.agora.exceptions.ChatException;
@@ -408,7 +407,8 @@ protected void createCall(@NonNull ResultCallBack<LiveData<Boolean>> callBack) {
                 ChatClient.getInstance().login(username, pwd, new CallBack() {
                     @Override
                     public void onSuccess() {
-                        success(username, callBack);
+                        DemoHelper.getInstance().getUsersManager().setCurrentUser(username);
+                        success(pwd, callBack);
                     }
 
                     @Override
diff --git a/app/src/main/java/io/agora/chatdemo/general/widget/EasePresenceView.java b/app/src/main/java/io/agora/chatdemo/general/widget/EasePresenceView.java
index 8bb16986..ddc08915 100644
--- a/app/src/main/java/io/agora/chatdemo/general/widget/EasePresenceView.java
+++ b/app/src/main/java/io/agora/chatdemo/general/widget/EasePresenceView.java
@@ -61,14 +61,14 @@ public void setPresenceData(String avatar, Presence presence) {
                 int resourceId = Integer.parseInt(avatar);
                 Glide.with(this)
                         .load(resourceId)
-                        .placeholder(R.drawable.ease_default_avatar)
-                        .error(R.drawable.ease_default_avatar)
+                        .placeholder(io.agora.chat.uikit.R.drawable.ease_default_avatar)
+                        .error(io.agora.chat.uikit.R.drawable.ease_default_avatar)
                         .into(ivAvatar);
             } catch (NumberFormatException e) {
                 Glide.with(this)
                         .load(avatar)
-                        .placeholder(R.drawable.ease_default_avatar)
-                        .error(R.drawable.ease_default_avatar)
+                        .placeholder(io.agora.chat.uikit.R.drawable.ease_default_avatar)
+                        .error(io.agora.chat.uikit.R.drawable.ease_default_avatar)
                         .into(ivAvatar);
             }
         }
diff --git a/app/src/main/java/io/agora/chatdemo/general/widget/PinInfoView.java b/app/src/main/java/io/agora/chatdemo/general/widget/PinInfoView.java
new file mode 100644
index 00000000..7818670c
--- /dev/null
+++ b/app/src/main/java/io/agora/chatdemo/general/widget/PinInfoView.java
@@ -0,0 +1,118 @@
+package io.agora.chatdemo.general.widget;
+
+
+import android.content.Context;
+import android.util.AttributeSet;
+import android.view.LayoutInflater;
+import android.view.View;
+import android.view.ViewGroup;
+import android.widget.RelativeLayout;
+
+import com.google.android.gms.common.util.CollectionUtils;
+
+import java.util.ArrayList;
+import java.util.List;
+
+import io.agora.chat.ChatMessage;
+import io.agora.chat.uikit.adapter.EaseBaseRecyclerViewAdapter;
+import io.agora.chatdemo.R;
+import io.agora.util.EMLog;
+
+public class PinInfoView extends RelativeLayout {
+
+    private List<ChatMessage> pinMessages=new ArrayList<>();
+    private View primaryView;
+    private PinMessageListViewGroup pinMessageListView;
+
+    public PinInfoView(Context context) {
+        super(context);
+        init();
+    }
+
+    public PinInfoView(Context context, AttributeSet attrs) {
+        super(context, attrs);
+        init();
+    }
+
+    private void init() {
+        primaryView = LayoutInflater.from(getContext()).inflate(R.layout.pin_info_view, this, false);
+        addView(primaryView);
+        findViewById(R.id.tv_info2).setOnClickListener(v->{
+            showPinListView();
+        });
+
+        pinMessageListView = new PinMessageListViewGroup(getContext());
+        RelativeLayout.LayoutParams layoutParams = new RelativeLayout.LayoutParams(
+                RelativeLayout.LayoutParams.MATCH_PARENT,
+                ViewGroup.LayoutParams.MATCH_PARENT);
+        pinMessageListView.setVisibility(View.GONE);
+        addView(pinMessageListView, layoutParams);
+    }
+
+    private void showPinListView() {
+        primaryView.setVisibility(GONE);
+        pinMessageListView.show(pinMessages);
+    }
+    private void showPrimaryView() {
+        setVisibility(VISIBLE);
+        primaryView.setVisibility(VISIBLE);
+        pinMessageListView.setVisibility(GONE);
+    }
+
+    public void setData(List<ChatMessage> messages) {
+        pinMessages.clear();
+        if(!CollectionUtils.isEmpty(messages)) {
+            pinMessages.addAll(0,messages);
+        }
+        setVisibility(VISIBLE);
+    }
+
+    public void removeData(ChatMessage message) {
+        if(message!=null) {
+            for (int i = 0; i < pinMessages.size(); i++) {
+                if(pinMessages.get(i).getMsgId().equals(message.getMsgId())) {
+                    pinMessages.remove(message);
+                    break;
+                }
+            }
+            pinMessageListView.removeData(message);
+            if(pinMessages.isEmpty()) {
+                setVisibility(GONE);
+            }
+        }
+    }
+
+    public void addData(ChatMessage message) {
+        if(message!=null) {
+            pinMessages.add(0,message);
+        }
+        showPrimaryView();
+    }
+
+    public void restView() {
+        primaryView.setVisibility(VISIBLE);
+        pinMessageListView.setVisibility(GONE);
+    }
+
+    public List<ChatMessage> getPinMessages() {
+        return pinMessages;
+    }
+
+    public void setOnItemClickListener(PinMessageListViewGroup.OnItemClickListener listener) {
+        pinMessageListView.setOnItemClickListener(listener);
+    }
+
+    public void setOnItemSubViewClickListener(EaseBaseRecyclerViewAdapter.OnItemSubViewClickListener onItemSubViewClickListener) {
+        pinMessageListView.setOnItemSubViewClickListener(onItemSubViewClickListener);
+    }
+
+    public void setInnerLayoutMaxHeight(int height) {
+        if(pinMessageListView!=null) {
+            EMLog.d("PinInfoView", "setInnerLayoutMaxHeight: " + height);
+            pinMessageListView.setConstraintLayoutMaxHeight(height);
+        }
+    }
+}
+
+
+
diff --git a/app/src/main/java/io/agora/chatdemo/general/widget/PinMessageListViewGroup.java b/app/src/main/java/io/agora/chatdemo/general/widget/PinMessageListViewGroup.java
new file mode 100644
index 00000000..779de9e4
--- /dev/null
+++ b/app/src/main/java/io/agora/chatdemo/general/widget/PinMessageListViewGroup.java
@@ -0,0 +1,164 @@
+package io.agora.chatdemo.general.widget;
+
+import android.content.Context;
+import android.graphics.Color;
+import android.util.AttributeSet;
+import android.view.LayoutInflater;
+import android.view.MotionEvent;
+import android.view.View;
+import android.widget.LinearLayout;
+import android.widget.TextView;
+
+import androidx.annotation.Nullable;
+import androidx.constraintlayout.widget.ConstraintLayout;
+import androidx.constraintlayout.widget.ConstraintSet;
+import androidx.recyclerview.widget.LinearLayoutManager;
+
+import com.google.android.gms.common.util.CollectionUtils;
+
+import java.util.List;
+
+import io.agora.chat.ChatMessage;
+import io.agora.chat.uikit.adapter.EaseBaseRecyclerViewAdapter;
+import io.agora.chat.uikit.widget.EaseRecyclerView;
+import io.agora.chatdemo.R;
+import io.agora.chatdemo.chat.PinListItemSpaceDecoration;
+import io.agora.chatdemo.chat.adapter.PinMessageListAdapter;
+
+public class PinMessageListViewGroup extends LinearLayout {
+
+    private ConstraintLayout constraintLayout;
+    private EaseRecyclerView recyclerView;
+    private PinMessageListAdapter adapter;
+    private OnItemClickListener itemClickListener;
+    private TextView tvCount;
+    private View clBottom;
+    private EaseBaseRecyclerViewAdapter.OnItemSubViewClickListener itemSubViewClickListener;
+
+    public PinMessageListViewGroup(Context context) {
+        super(context);
+        init();
+    }
+
+    public PinMessageListViewGroup(Context context, @Nullable AttributeSet attrs) {
+        super(context, attrs);
+        init();
+    }
+
+    private void init() {
+        setClickable(true);
+        setBackgroundColor(Color.parseColor("#80000000"));
+
+        constraintLayout = (ConstraintLayout) LayoutInflater.from(getContext()).inflate(R.layout.pin_message_list_view_group, this, false);
+        addView(constraintLayout);
+
+        tvCount = findViewById(R.id.tv_count);
+        recyclerView = findViewById(R.id.rv_list);
+        clBottom = findViewById(R.id.cl_bottom);
+
+
+        adapter = new PinMessageListAdapter();
+
+
+        int space = dpToPx(8);
+        PinListItemSpaceDecoration itemDecoration = new PinListItemSpaceDecoration(space);
+        recyclerView.addItemDecoration(itemDecoration);
+        recyclerView.setLayoutManager(new LinearLayoutManager(getContext()));
+
+        adapter.setOnItemClickListener(new io.agora.chat.uikit.interfaces.OnItemClickListener() {
+            @Override
+            public void onItemClick(View view, int position) {
+                if (itemClickListener != null) {
+                    itemClickListener.onItemClick(adapter.getItem(position));
+                }
+            }
+        });
+        adapter.setOnItemSubViewClickListener(new EaseBaseRecyclerViewAdapter.OnItemSubViewClickListener() {
+            @Override
+            public void onItemSubViewClick(View view, int position) {
+                if (itemSubViewClickListener != null) {
+                    itemSubViewClickListener.onItemSubViewClick(view, position);
+                }
+            }
+        });
+
+        recyclerView.setAdapter(adapter);
+
+    }
+
+    long startY = 0;
+    @Override
+    public boolean dispatchTouchEvent(MotionEvent event) {
+        switch (event.getAction()) {
+            case MotionEvent.ACTION_DOWN:
+                startY = (long) event.getY();
+                break;
+            case MotionEvent.ACTION_UP:
+                if (!recyclerView.canScrollVertically(-1) && startY-event.getY()> 20) {
+                    ((PinInfoView) getParent()).restView();
+                    return true;
+                }
+                if (event.getX() < 0 || event.getX() > getWidth() ||
+                        event.getY() < 0 || event.getY() > getHeight()
+                        || event.getY() > clBottom.getTop()) {
+                    ((PinInfoView) getParent()).restView();
+                    return true;
+                }
+                break;
+        }
+        return super.dispatchTouchEvent(event);
+    }
+
+    public void setData(List<ChatMessage> data) {
+        tvCount.setText(String.valueOf(data.size()) + " Pin Message");
+        adapter.setData(data);
+    }
+
+    public void setOnItemClickListener(OnItemClickListener listener) {
+        this.itemClickListener = listener;
+    }
+
+    public void setOnItemSubViewClickListener(EaseBaseRecyclerViewAdapter.OnItemSubViewClickListener listener) {
+        this.itemSubViewClickListener = listener;
+    }
+
+    public void show(List<ChatMessage> messages) {
+        setVisibility(VISIBLE);
+        setData(messages);
+    }
+
+    public void removeData(ChatMessage message) {
+        List<ChatMessage> messageList = adapter.getData();
+        if (messageList != null && message != null) {
+            for (int i = 0; i < messageList.size(); i++) {
+                if (messageList.get(i).getMsgId().equals(message.getMsgId())) {
+                    messageList.remove(message);
+                    break;
+                }
+            }
+            adapter.notifyDataSetChanged();
+        }
+        if (CollectionUtils.isEmpty(adapter.getData())) {
+            setVisibility(GONE);
+        }
+    }
+
+    public void setConstraintLayoutMaxHeight(int height) {
+        ConstraintSet constraintSet = new ConstraintSet();
+        constraintSet.clone(constraintLayout);
+        int recyclerViewId = R.id.rv_list;
+        int rvHeight = height - tvCount.getHeight() - clBottom.getHeight();
+        constraintSet.constrainMaxHeight(recyclerViewId, rvHeight);
+        constraintSet.applyTo(constraintLayout);
+    }
+
+    public interface OnItemClickListener {
+        void onItemClick(ChatMessage message);
+    }
+
+    private int dpToPx(int dp) {
+        float density = getResources().getDisplayMetrics().density;
+        return (int) (dp * density + 0.5f);
+    }
+}
+
diff --git a/app/src/main/java/io/agora/chatdemo/global/BottomSheetChildHelper.java b/app/src/main/java/io/agora/chatdemo/global/BottomSheetChildHelper.java
index 1c6e02f3..8c689b88 100644
--- a/app/src/main/java/io/agora/chatdemo/global/BottomSheetChildHelper.java
+++ b/app/src/main/java/io/agora/chatdemo/global/BottomSheetChildHelper.java
@@ -16,7 +16,7 @@ int getTitlebarTitle() {
 
     default @StringRes
     int getTitleBarRightText() {
-        return R.string.ease_cancel;
+        return io.agora.chat.uikit.R.string.ease_cancel;
     }
 
     default @ColorRes
diff --git a/app/src/main/java/io/agora/chatdemo/group/adapter/HomeHeaderMenuAdapter.java b/app/src/main/java/io/agora/chatdemo/group/adapter/HomeHeaderMenuAdapter.java
index 30b93a3a..595d55c4 100644
--- a/app/src/main/java/io/agora/chatdemo/group/adapter/HomeHeaderMenuAdapter.java
+++ b/app/src/main/java/io/agora/chatdemo/group/adapter/HomeHeaderMenuAdapter.java
@@ -21,7 +21,7 @@ public ViewHolder<Pair<Integer, Integer>> getViewHolder(ViewGroup parent, int vi
 
     @Override
     public int getEmptyLayoutId() {
-        return R.layout.ease_layout_no_data_show_nothing;
+        return io.agora.chat.uikit.R.layout.ease_layout_no_data_show_nothing;
     }
 
     private class HomeMenuViewHolder extends ViewHolder<Pair<Integer, Integer>> {
diff --git a/app/src/main/java/io/agora/chatdemo/group/fragments/BottomSheetMenuFragment.java b/app/src/main/java/io/agora/chatdemo/group/fragments/BottomSheetMenuFragment.java
index 2d2933d9..d4adeb66 100644
--- a/app/src/main/java/io/agora/chatdemo/group/fragments/BottomSheetMenuFragment.java
+++ b/app/src/main/java/io/agora/chatdemo/group/fragments/BottomSheetMenuFragment.java
@@ -106,7 +106,7 @@ public int getTitlebarTitle() {
 
     @Override
     public int getTitleBarRightText() {
-        return R.string.ease_cancel;
+        return io.agora.chat.uikit.R.string.ease_cancel;
     }
 
     @Override
diff --git a/app/src/main/java/io/agora/chatdemo/group/fragments/GroupAllMembersFragment.java b/app/src/main/java/io/agora/chatdemo/group/fragments/GroupAllMembersFragment.java
index e995bf32..8139d69c 100644
--- a/app/src/main/java/io/agora/chatdemo/group/fragments/GroupAllMembersFragment.java
+++ b/app/src/main/java/io/agora/chatdemo/group/fragments/GroupAllMembersFragment.java
@@ -37,7 +37,7 @@ public class GroupAllMembersFragment extends GroupBaseManageFragment {
     @Override
     protected void initView(Bundle savedInstanceState) {
         super.initView(savedInstanceState);
-        listAdapter.setEmptyView(R.layout.ease_layout_no_data_show_nothing);
+        listAdapter.setEmptyView(io.agora.chat.uikit.R.layout.ease_layout_no_data_show_nothing);
         currentUserInfo = DemoHelper.getInstance().getUsersManager().getCurrentUserInfo();
         if (isPickAt){
             listAdapter.setShowInitials(true);
@@ -162,7 +162,7 @@ protected void loadData() {
     public void addHeader(ConcatAdapter adapter) {
         managersAdapter = new ContactListAdapter();
         managersAdapter.setGroupId(groupId);
-        managersAdapter.setEmptyView(R.layout.ease_layout_no_data_show_nothing);
+        managersAdapter.setEmptyView(io.agora.chat.uikit.R.layout.ease_layout_no_data_show_nothing);
         adapter.addAdapter(managersAdapter);
     }
 
diff --git a/app/src/main/java/io/agora/chatdemo/group/fragments/MultiplyVideoSelectMemberChildFragment.java b/app/src/main/java/io/agora/chatdemo/group/fragments/MultiplyVideoSelectMemberChildFragment.java
index 61e3e0f2..de1471b1 100644
--- a/app/src/main/java/io/agora/chatdemo/group/fragments/MultiplyVideoSelectMemberChildFragment.java
+++ b/app/src/main/java/io/agora/chatdemo/group/fragments/MultiplyVideoSelectMemberChildFragment.java
@@ -139,7 +139,7 @@ public boolean onTitlebarRightTextViewClick() {
             }
         }
         if(finalUsers.size()>EaseCallKit.getInstance().getLargestNumInChannel()-1) {
-            ToastUtils.showToast(getString(R.string.ease_call_max_people_in_channel));
+            ToastUtils.showToast(getString(io.agora.chat.callkit.R.string.ease_call_max_people_in_channel));
             return true;
         }
         Map<String, Object> ext = new HashMap<>();
diff --git a/app/src/main/java/io/agora/chatdemo/me/CustomPresenceActivity.java b/app/src/main/java/io/agora/chatdemo/me/CustomPresenceActivity.java
index 13426693..ac7a254c 100644
--- a/app/src/main/java/io/agora/chatdemo/me/CustomPresenceActivity.java
+++ b/app/src/main/java/io/agora/chatdemo/me/CustomPresenceActivity.java
@@ -41,8 +41,8 @@ protected void initView(Bundle savedInstanceState) {
         ivDelete = findViewById(R.id.iv_delete);
         tvCount = findViewById(R.id.tvCount);
 
-        titleBar.setRightTitle(getString(R.string.ease_presence_done));
-        titleBar.setTitle(getString(R.string.ease_presence_custom));
+        titleBar.setRightTitle(getString(io.agora.chat.uikit.R.string.ease_presence_done));
+        titleBar.setTitle(getString(io.agora.chat.uikit.R.string.ease_presence_custom));
         titleBar.setTitlePosition(EaseTitleBar.TitlePosition.Left);
         titleBar.setRightTitleColor(R.color.color_light_gray_999999);
     }
diff --git a/app/src/main/java/io/agora/chatdemo/me/MeFragment.java b/app/src/main/java/io/agora/chatdemo/me/MeFragment.java
index 35dc27ee..be60d2f3 100644
--- a/app/src/main/java/io/agora/chatdemo/me/MeFragment.java
+++ b/app/src/main/java/io/agora/chatdemo/me/MeFragment.java
@@ -255,8 +255,8 @@ public void onActivityResult(int requestCode, int resultCode, @Nullable Intent d
 
         if ((requestCode == REQUEST_CODE && resultCode == RESULT_OK)) {
             if (data != null) {
-                int headImg = data.getIntExtra("headImage", R.drawable.ease_default_avatar);
-                Glide.with(mContext).load(headImg).placeholder(R.drawable.ease_default_avatar).into(mBinding.layoutUserinfo.ivUserAvatar);
+                int headImg = data.getIntExtra("headImage", io.agora.chat.uikit.R.drawable.ease_default_avatar);
+                Glide.with(mContext).load(headImg).placeholder(io.agora.chat.uikit.R.drawable.ease_default_avatar).into(mBinding.layoutUserinfo.ivUserAvatar);
             }
         }
     }
diff --git a/app/src/main/java/io/agora/chatdemo/me/SetPresenceFragment.java b/app/src/main/java/io/agora/chatdemo/me/SetPresenceFragment.java
index ed734a62..f802cb22 100644
--- a/app/src/main/java/io/agora/chatdemo/me/SetPresenceFragment.java
+++ b/app/src/main/java/io/agora/chatdemo/me/SetPresenceFragment.java
@@ -53,8 +53,8 @@ protected void initView(Bundle savedInstanceState) {
         rbCustom = findViewById(R.id.rb_custom);
         titleBar = findViewById(R.id.title_bar);
         radioGroup = findViewById(R.id.rg_presence);
-        titleBar.setRightTitle(getString(R.string.ease_presence_done));
-        titleBar.setTitle(getString(R.string.ease_presence_custom));
+        titleBar.setRightTitle(getString(io.agora.chat.uikit.R.string.ease_presence_done));
+        titleBar.setTitle(getString(io.agora.chat.uikit.R.string.ease_presence_custom));
         titleBar.setTitlePosition(EaseTitleBar.TitlePosition.Left);
         titleBar.setRightTitleColor(R.color.group_blue_154dfe);
 
@@ -193,7 +193,7 @@ private void publishPresence() {
 
     @Override
     public void onRightClick(View view) {
-        if (!TextUtils.equals(rbCustom.getText(), getString(R.string.ease_presence_custom))&&currentSelectedId!=R.id.rb_custom) {
+        if (!TextUtils.equals(rbCustom.getText(), getString(io.agora.chat.uikit.R.string.ease_presence_custom))&&currentSelectedId!=R.id.rb_custom) {
             showDialog();
         } else {
             publishPresence();
diff --git a/app/src/main/res/drawable-xxhdpi/chat_item_menu_pin.png b/app/src/main/res/drawable-xxhdpi/chat_item_menu_pin.png
new file mode 100644
index 00000000..63482071
Binary files /dev/null and b/app/src/main/res/drawable-xxhdpi/chat_item_menu_pin.png differ
diff --git a/app/src/main/res/drawable-xxhdpi/chat_pin_onlight.png b/app/src/main/res/drawable-xxhdpi/chat_pin_onlight.png
new file mode 100644
index 00000000..168700d7
Binary files /dev/null and b/app/src/main/res/drawable-xxhdpi/chat_pin_onlight.png differ
diff --git a/app/src/main/res/drawable-xxhdpi/chat_pin_rectangle.png b/app/src/main/res/drawable-xxhdpi/chat_pin_rectangle.png
new file mode 100644
index 00000000..74b1e283
Binary files /dev/null and b/app/src/main/res/drawable-xxhdpi/chat_pin_rectangle.png differ
diff --git a/app/src/main/res/drawable-xxhdpi/chat_pininfo_icon.png b/app/src/main/res/drawable-xxhdpi/chat_pininfo_icon.png
new file mode 100644
index 00000000..9d966f0f
Binary files /dev/null and b/app/src/main/res/drawable-xxhdpi/chat_pininfo_icon.png differ
diff --git a/app/src/main/res/drawable/shape_gray_ebebeb_corner_8.xml b/app/src/main/res/drawable/shape_gray_ebebeb_corner_8.xml
new file mode 100644
index 00000000..7435f4ae
--- /dev/null
+++ b/app/src/main/res/drawable/shape_gray_ebebeb_corner_8.xml
@@ -0,0 +1,7 @@
+<?xml version="1.0" encoding="utf-8"?>
+<shape xmlns:android="http://schemas.android.com/apk/res/android">
+    <solid
+        android:color="@color/pin_message_head_bg_back"
+        />
+    <corners android:radius="8dp"/>
+</shape>
\ No newline at end of file
diff --git a/app/src/main/res/drawable/shape_gray_f5f5f5_corner_8.xml b/app/src/main/res/drawable/shape_gray_f5f5f5_corner_8.xml
new file mode 100644
index 00000000..51bef490
--- /dev/null
+++ b/app/src/main/res/drawable/shape_gray_f5f5f5_corner_8.xml
@@ -0,0 +1,7 @@
+<?xml version="1.0" encoding="utf-8"?>
+<shape xmlns:android="http://schemas.android.com/apk/res/android">
+    <solid
+        android:color="@color/pin_message_head_bg"
+        />
+    <corners android:radius="8dp"/>
+</shape>
\ No newline at end of file
diff --git a/app/src/main/res/layout/pin_info_view.xml b/app/src/main/res/layout/pin_info_view.xml
new file mode 100644
index 00000000..c4a475be
--- /dev/null
+++ b/app/src/main/res/layout/pin_info_view.xml
@@ -0,0 +1,40 @@
+<?xml version="1.0" encoding="utf-8"?>
+<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:app="http://schemas.android.com/apk/res-auto"
+    android:layout_width="match_parent"
+    android:layout_height="wrap_content"
+    android:padding="8dp">
+
+    <TextView
+        android:id="@+id/tv_info1"
+        android:layout_width="match_parent"
+        android:layout_height="34dp"
+        android:layout_marginLeft="8dp"
+        android:layout_marginTop="8dp"
+        android:layout_marginRight="8dp"
+        android:background="@drawable/shape_gray_ebebeb_corner_8"
+        android:gravity="left|center_vertical"
+        android:paddingLeft="8dp"
+        android:textColor="@color/black"
+        android:textSize="14sp"
+        app:layout_constraintLeft_toLeftOf="parent"
+        app:layout_constraintRight_toRightOf="parent"
+        app:layout_constraintTop_toTopOf="parent" />
+
+    <TextView
+        android:id="@+id/tv_info2"
+        android:layout_width="match_parent"
+        android:layout_height="34dp"
+        android:background="@drawable/shape_gray_f5f5f5_corner_8"
+        android:drawableLeft="@drawable/chat_pininfo_icon"
+        android:drawablePadding="8dp"
+        android:gravity="left|center_vertical"
+        android:paddingLeft="8dp"
+        android:text="@string/pin_info_view_text"
+        android:textColor="@color/black"
+        android:textSize="14sp"
+        app:layout_constraintLeft_toLeftOf="parent"
+        app:layout_constraintRight_toRightOf="parent"
+        app:layout_constraintTop_toTopOf="parent" />
+
+</androidx.constraintlayout.widget.ConstraintLayout>
\ No newline at end of file
diff --git a/app/src/main/res/layout/pin_message_list_view_group.xml b/app/src/main/res/layout/pin_message_list_view_group.xml
new file mode 100644
index 00000000..89f66640
--- /dev/null
+++ b/app/src/main/res/layout/pin_message_list_view_group.xml
@@ -0,0 +1,46 @@
+<?xml version="1.0" encoding="utf-8"?>
+<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:app="http://schemas.android.com/apk/res-auto"
+    android:layout_width="match_parent"
+    android:layout_height="wrap_content"
+    android:background="@color/common_bg">
+
+    <TextView
+        android:id="@+id/tv_count"
+        android:layout_width="match_parent"
+        android:layout_height="34dp"
+        android:drawablePadding="8dp"
+        android:drawableLeft="@drawable/chat_pininfo_icon"
+        android:gravity="left|center_vertical"
+        android:paddingLeft="8dp"
+        android:text="@string/pin_info_view_text"
+        android:textColor="@color/black"
+        android:textSize="14sp"
+        app:layout_constraintTop_toTopOf="parent" />
+
+    <io.agora.chat.uikit.widget.EaseRecyclerView
+        android:id="@+id/rv_list"
+        android:layout_width="match_parent"
+        android:layout_height="wrap_content"
+        android:scrollbars="vertical"
+        app:layout_constraintTop_toBottomOf="@id/tv_count" />
+
+    <androidx.constraintlayout.widget.ConstraintLayout
+        android:id="@+id/cl_bottom"
+        android:layout_width="match_parent"
+        android:layout_height="wrap_content"
+        android:padding="5dp"
+        app:layout_constraintTop_toBottomOf="@id/rv_list">
+
+        <ImageButton
+            android:id="@+id/ib_bottom"
+            android:layout_width="36dp"
+            android:layout_height="5dp"
+            android:src="@drawable/chat_pin_rectangle"
+            app:layout_constraintBottom_toBottomOf="parent"
+            app:layout_constraintLeft_toLeftOf="parent"
+            app:layout_constraintRight_toRightOf="parent"
+            app:layout_constraintTop_toTopOf="parent" />
+    </androidx.constraintlayout.widget.ConstraintLayout>
+
+</androidx.constraintlayout.widget.ConstraintLayout>
\ No newline at end of file
diff --git a/app/src/main/res/layout/pinlist_default.xml b/app/src/main/res/layout/pinlist_default.xml
new file mode 100644
index 00000000..313a185b
--- /dev/null
+++ b/app/src/main/res/layout/pinlist_default.xml
@@ -0,0 +1,52 @@
+<?xml version="1.0" encoding="utf-8"?>
+<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
+    android:layout_width="match_parent"
+    xmlns:app="http://schemas.android.com/apk/res-auto"
+    xmlns:tools="http://schemas.android.com/tools"
+    android:background="@drawable/shape_gray_ebebeb_corner_8"
+    android:paddingBottom="8dp"
+    android:paddingTop="6dp"
+    android:paddingRight="8dp"
+    android:paddingLeft="8dp"
+    android:layout_height="wrap_content">
+
+    <TextView
+        android:id="@+id/tv_from"
+        app:layout_constraintTop_toTopOf="parent"
+        app:layout_constraintLeft_toLeftOf="parent"
+        tools:text="From"
+        android:maxLength="50"
+        android:textColor="@color/black"
+        android:ellipsize="end"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"/>
+    <TextView
+        android:id="@+id/tv_content"
+        app:layout_constraintTop_toBottomOf="@id/tv_from"
+        app:layout_constraintLeft_toLeftOf="parent"
+        tools:text="Non sono sicuro, ma penso all’ una e mezza. Stevie, sai a che ora chiudono le banche?"
+        android:maxLength="50"
+        android:textColor="@color/color_light_gray_666666"
+        android:ellipsize="end"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"/>
+
+    <TextView
+        android:id="@+id/tv_time"
+        app:layout_constraintTop_toTopOf="parent"
+        app:layout_constraintRight_toRightOf="parent"
+        tools:text="09:51"
+        android:textSize="12sp"
+        android:textColor="@color/color_light_gray_999999"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"/>
+
+    <ImageView
+        android:id="@+id/iv_state"
+        app:layout_constraintBottom_toBottomOf="parent"
+        app:layout_constraintRight_toRightOf="parent"
+        android:src="@drawable/chat_pin_onlight"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"/>
+
+</androidx.constraintlayout.widget.ConstraintLayout>
\ No newline at end of file
diff --git a/app/src/main/res/layout/pinlist_image.xml b/app/src/main/res/layout/pinlist_image.xml
new file mode 100644
index 00000000..0ad95f3d
--- /dev/null
+++ b/app/src/main/res/layout/pinlist_image.xml
@@ -0,0 +1,53 @@
+<?xml version="1.0" encoding="utf-8"?>
+<androidx.constraintlayout.widget.ConstraintLayout 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="wrap_content"
+    android:background="@drawable/shape_gray_ebebeb_corner_8"
+    android:paddingLeft="8dp"
+    android:paddingTop="6dp"
+    android:paddingRight="8dp"
+    android:paddingBottom="8dp">
+
+    <TextView
+        android:id="@+id/tv_from"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        android:ellipsize="end"
+        android:maxLength="50"
+        android:textColor="@color/black"
+        app:layout_constraintLeft_toLeftOf="parent"
+        app:layout_constraintTop_toTopOf="parent"
+        tools:text="From" />
+
+    <io.agora.chat.uikit.widget.EaseImageView
+        android:id="@+id/iv_content"
+        android:layout_width="100dp"
+        android:layout_height="138dp"
+        android:scaleType="centerCrop"
+        app:ease_radius="4dp"
+        app:ease_shape_type="rectangle"
+        app:layout_constraintLeft_toLeftOf="parent"
+        app:layout_constraintTop_toBottomOf="@id/tv_from"
+        tools:src="@drawable/agora_avatar_3" />
+
+    <TextView
+        android:id="@+id/tv_time"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        android:textColor="@color/color_light_gray_999999"
+        android:textSize="12sp"
+        app:layout_constraintRight_toRightOf="parent"
+        app:layout_constraintTop_toTopOf="parent"
+        tools:text="09:51" />
+
+    <ImageView
+        android:id="@+id/iv_state"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        android:src="@drawable/chat_pin_onlight"
+        app:layout_constraintBottom_toBottomOf="parent"
+        app:layout_constraintRight_toRightOf="parent" />
+
+</androidx.constraintlayout.widget.ConstraintLayout>
\ No newline at end of file
diff --git a/app/src/main/res/layout/pinlist_text.xml b/app/src/main/res/layout/pinlist_text.xml
new file mode 100644
index 00000000..0d0eac24
--- /dev/null
+++ b/app/src/main/res/layout/pinlist_text.xml
@@ -0,0 +1,53 @@
+<?xml version="1.0" encoding="utf-8"?>
+<androidx.constraintlayout.widget.ConstraintLayout 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="wrap_content"
+    android:background="@drawable/shape_gray_ebebeb_corner_8"
+    android:paddingLeft="8dp"
+    android:paddingTop="6dp"
+    android:paddingRight="8dp"
+    android:paddingBottom="8dp">
+
+    <TextView
+        android:id="@+id/tv_from"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        android:ellipsize="end"
+        android:maxLength="50"
+        android:textColor="@color/black"
+        app:layout_constraintLeft_toLeftOf="parent"
+        app:layout_constraintTop_toTopOf="parent"
+        tools:text="From" />
+
+    <TextView
+        android:id="@+id/tv_content"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        android:ellipsize="end"
+        android:maxLength="50"
+        android:textColor="@color/color_light_gray_666666"
+        app:layout_constraintLeft_toLeftOf="parent"
+        app:layout_constraintTop_toBottomOf="@id/tv_from"
+        tools:text="Non sono sicuro, ma penso all’ una e mezza. Stevie, sai a che ora chiudono le banche?" />
+
+    <TextView
+        android:id="@+id/tv_time"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        android:textColor="@color/color_light_gray_999999"
+        android:textSize="12sp"
+        app:layout_constraintRight_toRightOf="parent"
+        app:layout_constraintTop_toTopOf="parent"
+        tools:text="09:51" />
+
+    <ImageView
+        android:id="@+id/iv_state"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        android:src="@drawable/chat_pin_onlight"
+        app:layout_constraintBottom_toBottomOf="parent"
+        app:layout_constraintRight_toRightOf="parent" />
+
+</androidx.constraintlayout.widget.ConstraintLayout>
\ No newline at end of file
diff --git a/app/src/main/res/values/colors.xml b/app/src/main/res/values/colors.xml
index 128d8f9a..379132dd 100644
--- a/app/src/main/res/values/colors.xml
+++ b/app/src/main/res/values/colors.xml
@@ -70,6 +70,8 @@
     <color name="report_content">#979797</color>
     <color name="report_username">#999999</color>
     <color name="thread_edit_line_color">#E6E6E6</color>
+    <color name="pin_message_head_bg">#F5F5F5</color>
+    <color name="pin_message_head_bg_back">#EbEbEb</color>
 
 
     <color name="url_preview_icon_bg">#EBF2FF</color>
diff --git a/app/src/main/res/values/ids.xml b/app/src/main/res/values/ids.xml
index 8bf1a06a..f376d544 100644
--- a/app/src/main/res/values/ids.xml
+++ b/app/src/main/res/values/ids.xml
@@ -15,4 +15,5 @@
     <!--translation-->
     <item name="action_chat_translation" type="id"/>
     <item name="action_chat_re_translation" type="id"/>
+    <item name="action_chat_pin" type="id"/>
 </resources>
\ No newline at end of file
diff --git a/app/src/main/res/values/strings.xml b/app/src/main/res/values/strings.xml
index 17ad949e..92d2a273 100644
--- a/app/src/main/res/values/strings.xml
+++ b/app/src/main/res/values/strings.xml
@@ -403,6 +403,8 @@
     <string name="report_input_count">%d/10</string>
     <string name="report_input_hint_count">0/10</string>
     <string name="ease_action_report">Report</string>
+    <string name="ease_action_pin">Pin</string>
+    <string name="ease_action_unpin">UnPin</string>
     <string name="chat_delete_multi_messages_title">Delete %1$d messages</string>
 
     <string name="demo_my_alias_in_group">My Alias in Group</string>
@@ -444,5 +446,8 @@
     <string name="translation_failed">Translation failed Retry</string>
     <string name="translation_original_text">Translated by Agora Chat View Original Text</string>
     <string name="translation_view_translation">Translated by Agora Chat View Translation</string>
+    <string name="pin_info_view_text">Pin Message</string>
+    <string name="unpin_confirm_message">Confirm to remove pinned message?</string>
+    <string name="pin_skip_not_exist">The quoted message does not exist</string>
 
 </resources>
\ No newline at end of file
diff --git a/build.gradle b/build.gradle
deleted file mode 100644
index 1437988a..00000000
--- a/build.gradle
+++ /dev/null
@@ -1,49 +0,0 @@
-// Top-level build file where you can add configuration options common to all sub-projects/modules.
-
-buildscript {
-    repositories {
-        google()
-        mavenCentral()
-    }
-    dependencies {
-        classpath 'com.android.tools.build:gradle:7.4.2'
-        // Crashlytics
-        // Firebase
-        classpath 'com.google.gms:google-services:4.3.10'
-        // Add the Crashlytics Gradle plugin (be sure to add version
-        // 2.0.0 or later if you built your app with Android Studio 4.1).
-        classpath 'com.google.firebase:firebase-crashlytics-gradle:2.3.0'
-        // NOTE: Do not place your application dependencies here; they belong
-        // in the individual module build.gradle files
-    }
-}
-
-allprojects {
-    repositories {
-        google()
-        maven { url 'https://jitpack.io' }
-        mavenCentral()
-    }
-}
-
-ext{
-    if(!project.hasProperty('isAarRelease')){
-        isAarRelease = false;
-    }
-    if(!project.hasProperty('isLite')){
-        isLite = false;
-    }
-    if(!project.hasProperty('sdkVersion')){
-        sdkVersion = '3.2.3'
-    }
-    if(!project.hasProperty('isTravis')) {
-        isTravis = false
-    }
-    if(!project.hasProperty('stagingRepositoryId')){
-        stagingRepositoryId = 'iohyphenate-1000'
-    }
-}
-
-task clean(type: Delete) {
-    delete rootProject.buildDir
-}
diff --git a/build.gradle.kts b/build.gradle.kts
new file mode 100644
index 00000000..42146c2a
--- /dev/null
+++ b/build.gradle.kts
@@ -0,0 +1,29 @@
+// 新增 buildscript
+buildscript {
+    dependencies {
+        // Note: If you use HuaWei or Honor push, you need to add the following dependencies
+        classpath("com.android.tools.build:gradle:8.1.0")
+    }
+}
+// Top-level build file where you can add configuration options common to all sub-projects/modules.
+plugins {
+    id("com.android.application") version "8.1.0" apply false
+    id("org.jetbrains.kotlin.android") version "1.8.0" apply false
+    // Add the dependency for the Google services Gradle plugin
+    id("com.google.gms.google-services") version "4.4.1" apply false
+    // Add to replace of kapt plugin when using Room. 1.8.0 is the version of Kotlin, 1.0.9 is the version of KSP
+    id("com.google.devtools.ksp") version "1.8.0-1.0.9" apply false
+}
+
+if(!project.hasProperty("isAarRelease")){
+    project.ext.set("isAarRelease", false)
+}
+if(!project.hasProperty("isLite")){
+    project.ext.set("isLite", false)
+}
+if(!project.hasProperty("sdkVersion")){
+    project.ext.set("sdkVersion", "4.6.1")
+}
+if(!project.hasProperty("isTravis")) {
+    project.ext.set("isTravis", false)
+}
\ No newline at end of file
diff --git a/gradle.properties b/gradle.properties
index 7d28a77f..f3a9eb40 100644
--- a/gradle.properties
+++ b/gradle.properties
@@ -22,4 +22,9 @@ android.injected.testOnly=false
 
 org.gradle.daemon=true
 org.gradle.parallel=true
-org.gradle.jvmargs=-Xmx5120m
\ No newline at end of file
+org.gradle.jvmargs=-Xmx5120m
+
+# Kotlin code style for this project: "official" or "obsolete":
+kotlin.code.style=official
+android.nonTransitiveRClass=true
+android.nonFinalResIds=false
diff --git a/gradle/wrapper/gradle-wrapper.properties b/gradle/wrapper/gradle-wrapper.properties
index c36662d8..5030c46c 100644
--- a/gradle/wrapper/gradle-wrapper.properties
+++ b/gradle/wrapper/gradle-wrapper.properties
@@ -1,6 +1,6 @@
-#Fri Mar 09 11:40:50 CST 2018
+#Wed Jul 03 14:26:42 CST 2024
 distributionBase=GRADLE_USER_HOME
 distributionPath=wrapper/dists
+distributionUrl=https\://services.gradle.org/distributions/gradle-8.2-bin.zip
 zipStoreBase=GRADLE_USER_HOME
 zipStorePath=wrapper/dists
-distributionUrl=https\://services.gradle.org/distributions/gradle-7.5-bin.zip
diff --git a/settings.gradle b/settings.gradle
deleted file mode 100644
index 3d4a09ce..00000000
--- a/settings.gradle
+++ /dev/null
@@ -1,7 +0,0 @@
-include ':app'
-//include ':chat-uikit'
-//project(':chat-uikit').projectDir = new File('../AgoraChat-UIKit-android/chat-uikit')
-//include ':chat-callkit'
-//project(':chat-callkit').projectDir = new File('../AgoraChat-CallKit-android/chat-callkit')
-//include ':hyphenatechatsdk'
-//project(':hyphenatechatsdk').projectDir = new File('../emclient-android/hyphenatechatsdk')
\ No newline at end of file
diff --git a/settings.gradle.kts b/settings.gradle.kts
new file mode 100644
index 00000000..3b2ae7f6
--- /dev/null
+++ b/settings.gradle.kts
@@ -0,0 +1,37 @@
+pluginManagement {
+    repositories {
+        google()
+        mavenCentral()
+        gradlePluginPortal()
+        maven { url = uri("https://maven.aliyun.com/repository/public/")}
+        maven { url = uri("https://jitpack.io")}
+    }
+}
+dependencyResolutionManagement {
+    repositoriesMode.set(RepositoriesMode.FAIL_ON_PROJECT_REPOS)
+    repositories {
+        google()
+        mavenCentral()
+        maven { url = uri("https://maven.aliyun.com/repository/public/")}
+        maven { url = uri("https://jitpack.io")}
+    }
+}
+
+rootProject.name = "AgoraChat-android"
+include(":app")
+//include(":chat-uikit")
+//project(":chat-uikit").projectDir = File("../AgoraChat-UIKit-android/chat-uikit")
+
+// app-kotlin
+//include(":app-kotlin")
+//include(":chat-uikit")
+//project(":chat-uikit").projectDir = File("../AgoraChat-UIKit-android/ease-im-kit")
+
+//include(":chat-callkit")
+//project(":chat-callkit").projectDir = File("../AgoraChat-CallKit-android/chat-callkit")
+
+//include(":hyphenatechatsdk")
+//project(":hyphenatechatsdk").projectDir = File("../emclient-android/hyphenatechatsdk")
+
+//include(":ease-linux")
+//project(":ease-linux").projectDir = File("../emclient-linux")