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

use*_*041 4 android android-layout android-drawable

我知道如何创建椭圆形背景,我将此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>
Run Code Online (Sandbox Code Playgroud)

但我想创建这个drawable和聊天的角落,如下所示:

椭圆形图像

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

Aji*_* O. 9

像这样创建你的泡泡布局

<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>
Run Code Online (Sandbox Code Playgroud)

可绘制文件

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>
Run Code Online (Sandbox Code Playgroud)

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>
Run Code Online (Sandbox Code Playgroud)

此布局将与您添加到的文本一起缩放 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>
Run Code Online (Sandbox Code Playgroud)

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>
Run Code Online (Sandbox Code Playgroud)

OUTPUT

在此输入图像描述