Android气泡对话效果_android studio 聊天界面冒泡对话

需要的工具

1. 下载对话气泡的PNG图片
2. android studio
3. RecyclerView
4. 时间和耐心

创建项目、制作Nine-Patch图片

1. Nine-Patch图片：一种被特殊处理过的png图片，指定那些区域可以被拉伸，那些区域不可变
2. 为什么使用：在我们发送消息时，对话框的文本大小是不可定的，要气泡跟文本大小匹配，必然要将图片拉伸，直接拉伸会导致图片的失真，让界面不好看
3. 如何制作：在Android Studio 2.3版本开始，制作的功能直接集成在Android Studio中
   1. 将下载好的图片导入到项目中（注意！一定要是png图片）
   2. 在项目文件中找到该文件，选中该图片右键点击，在下拉菜单中找到“Create 9-patch file…”点击创建Nine-Patch图片
   3. 点击创建好的*.9.png图片，通过鼠标对边框进行拖动，黑色部分表示绘制的可拉伸部分（按住Shift键拖动可对绘制的部分进行擦除），右边是预览窗口，可对拉伸效果进行预览
   4. 完成处理后保存该图片。（对原图片进行替换）

设置布局界面

1. 制作好左边气泡和右边气泡的Nine-Patch图片
2. 由于要用到RecyclerView，在这里我们将添加依赖库：
   在项目文件夹app/gradle当中添加依赖库：compile ‘com.android.support:recyclerview-v7:26.1.0’
   如下所示

dependencies {
    implementation fileTree(dir: 'libs', include: ['*.jar'])
    implementation 'com.android.support:appcompat-v7:26.1.0'
    implementation 'com.android.support.constraint:constraint-layout:1.0.2'
    compile 'com.android.support:recyclerview-v7:26.1.0'
    testImplementation 'junit:junit:4.12'
    androidTestImplementation 'com.android.support.test:runner:1.0.1'
    androidTestImplementation 'com.android.support.test.espresso:espresso-core:3.0.1'
}
1
2
3
4
5
6
7
8
9

3.编写主界面，修改activity_main.xml中的代码，如下所示

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#d8e0e8">

    <android.support.v7.widget.RecyclerView  
        android:id="@+id/msg_recycler_view"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1" />

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height = "wrap_content">

<EditText
    android:id="@+id/input_text"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:layout_weight=
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22