Android使椭圆形背景可绘制与聊天角落

Question

我知道如何创建椭圆形背景，我将此drawable添加到RelativeLayout背景中：

<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle" android:padding="10dp">
    <solid android:color="#FFFFFF"/>
    <corners
        android:bottomRightRadius="15dp"
        android:bottomLeftRadius="15dp"
        android:topLeftRadius="15dp"
        android:topRightRadius="15dp"/>
</shape>

但是我想创建这个drawable和聊天的角落：

如何在聊天的角落添加这个drawable？

Answer 1

像这样创建你的泡泡布局

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_gravity="center"
    android:layout_margin="16dp"
    android:orientation="vertical">

    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content" 
        android:text="Hello"
        android:padding="16dp"
        android:background="@drawable/rounded_rect"/>

    <ImageView
        android:layout_marginTop="-1.5dp"
        android:layout_width="8dp"
        android:layout_height="16dp"
        android:layout_gravity="start"
        android:background="@drawable/corner"
        />

</LinearLayout>

可绘制文件

<强> rounded_rect.xml

<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <solid android:color="#888" />
    <corners
        android:bottomRightRadius="8dp"
        android:topLeftRadius="8dp"
        android:topRightRadius="8dp"/>

</shape>

<强> corner.xml

<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <rotate
            android:fromDegrees="45"
            android:pivotX="135%"
            android:pivotY="15%"
            android:toDegrees="45"
            >
            <shape android:shape="rectangle">
                <solid android:color="#888"/>

            </shape>
        </rotate>
    </item>
</layer-list>

此布局将与您添加到TextView

的文字一起缩放

修改

我刚才注意到你的要求中的箭头应该指向左边。为此，您可以对气泡布局进行一些小改动

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

    <ImageView
        android:layout_width="12dp"
        android:layout_height="12dp"
        android:layout_gravity="bottom"
        android:background="@drawable/corner2"
        />

    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="Hello"
        android:padding="16dp"
        android:background="@drawable/rounded_rect"/>

</LinearLayout>

<强> corner2.xml

<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <rotate
            android:fromDegrees="-45"
            android:pivotX="135%"
            android:pivotY="15%"
            android:toDegrees="45"
            >
            <shape android:shape="rectangle">
                <solid android:color="#888"/>

            </shape>
        </rotate>
    </item>
</layer-list>

<强>输出

Answer 2

你必须制作一个完整的聊天泡泡，包括角落。然后将其设为9-patch，以便绘图将水平和垂直展开而不会变形。

Answer 3

对于任何想在聊天的另一个角落的人。

<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
    <rotate
            android:fromDegrees="-45"
            android:pivotX="120%"
            android:pivotY="90%"

    >
    <shape android:shape="rectangle">
        <solid android:color="@color/button_login"/>

    </shape>
</rotate>