如何在Android的TextView中添加气泡？

Question

在我的应用程序中，我想要将气泡设置为文本视图，在文本视图中，我添加了setBackgroundResource()代码，如您所见。

使用这段代码，我会得到像这样的图片： 我想要一个像这样的气泡形状的图片：

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle" >
    <solid android:color="#EDF5E4" />
    <corners android:bottomLeftRadius="@dimen/corner_radius"
    android:bottomRightRadius="@dimen/corner_radius"
    android:topLeftRadius="@dimen/corner_radius"
    id:topRightRadius="@dimen/corner_radius" />

请告诉我如何在我的setBackgroundResource() XML中进行设置。

- Anil M H

---

我会使用9-patch png。http://developer.android.com/reference/android/graphics/NinePatch.html - Ken Wolf

Answer 1

你需要使用的是基本上一个9-patch图像（正如在这个评论中已经被Ken Wolf指出的那样）。

为了帮助您入门，我将包括一组来自我的应用程序的9-patch图像以及有关如何在创建布局XMl时使用它的简短代码。 ;-)

9-patch图像集：

（这些分别命名为：bubble_white_normal_mdpi.9、bubble_white_normal_hdpi.9和bubble_white_normal_xhdpi.9。在将它们放置到各自的drawable文件夹中后，请从文件名中删除_mdpi、_hdpi和_xhdpi。）

XML:

<LinearLayout
    android:id="@+id/linlaUserOther"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_marginLeft="8dp"
    android:layout_marginRight="8dp"
    android:baselineAligned="false"
    android:orientation="horizontal"
    android:padding="2dp" >

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="fill_parent"
        android:gravity="top|center" >

        <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:gravity="center"
            android:orientation="vertical" >

            <ImageView
                android:id="@+id/imgvwProfileOther"
                android:layout_width="42dp"
                android:layout_height="42dp"
                android:adjustViewBounds="true"
                android:contentDescription="@string/content_desc_user_profile"
                android:scaleType="centerCrop"
                android:src="@drawable/ic_contact_picture" >
            </ImageView>
        </LinearLayout>
    </LinearLayout>

    <LinearLayout
        android:layout_width="0dip"
        android:layout_height="fill_parent"
        android:layout_weight="1"
        android:background="@drawable/bubble_white_normal"
        android:gravity="top|center"
        android:orientation="vertical" >

        .... // OTHER STUFF HERE THAT IS NOT NECESSARY IN THIS CODE SNIPPET ON SO

    </LinearLayout>
</LinearLayout>

注意1：

尽管我提供了一组工作图片（如果你愿意的话，几乎是“像喂奶一样”），但我强烈建议您创建适合自己方案的图片。此外，这也将使您能够在未来构建自己的资源。我之所以要“加把劲”，仅仅因为我个人失去了3天时间让气泡看起来和工作正常 :-(

注意2：

我将图像设置为LinearLayout的背景。但是，你需要将其设置为你需要看起来像气泡的TextView。

其他网站（教程）:

1. http://blog.booleanbites.com/2012/12/android-listview-with-speech-bubble.html
2. https://github.com/AdilSoomro/Android-Speech-Bubble
3. http://developer.android.com/reference/android/graphics/NinePatch.html
4. http://developer.android.com/tools/help/draw9patch.html

- Siddharth Lele

Answer 2

我认为仅使用形状可绘制对象将很难实现这一点。 我会使用9-patch png。

http://developer.android.com/reference/android/graphics/NinePatch.html

基本上您可以找到/购买一张图片或在您喜欢的绘图程序中创建一张图片。然后使用draw9patch工具定义可拉伸区域，这样它就可以在您的View中正确缩放。

这是一个教程，甚至专门讲解了对话框！

http://adilsoomro.blogspot.co.uk/2012/11/android-how-to-use-9-patch-png.html

这需要一些时间，但它是制作更设计化的视觉界面的关键技术。

- Ken Wolf