在 android 的聊天应用程序中创建文本气泡的更好选择？答案

【问题标题】：Better option to create text bubble in chat app in android?在 android 的聊天应用程序中创建文本气泡的更好选择？
【发布时间】：2020-05-31 12:11:39
【问题描述】：

当用户发送消息时，我想在我的聊天应用中实现这种风格：

我应该使用9 patch 还是使用XML？如果XML 是更好的选择，我该如何实现？

【问题讨论】：

理论上，矢量图可以处理。如果您使用的是 Android Studio，您可以在一些外部图形编辑器（例如 Inkscape）中创建一个表示此形状的 SVG，然后尝试通过 Vector Asset Wizard 导入它，看看您是否得到了您想要的结果。
这样会不会很尴尬地拉伸角落？
拉伸图片时，边角会作为整个图片的一部分进行拉伸。如果这是不可接受的，那么我不确定如何使用其他形式的 XML 创建它。九个补丁可以处理它，尽管创建它们很痛苦。另一种可能性是直接在 Java/Kotlin 代码中呈现它，而不是尝试仅通过资源来实现您想要的外观。来自一个答案的layer-list 解决方案可能作为基础，但左下角不是shape AFAIK 可以创建的。
看看这个库，如果你想自己实现它，它的实现。 github.com/Devlight/…

标签： java android xml android-drawable

【解决方案1】：

您可以为此制作一个 XML，并且应该为传入和传出的消息制作一个气泡。

这是传入聊天气泡source 的一个示例。

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">

<!--Shadow Layers-->

<item>
    <rotate
        android:fromDegrees="-35"
        android:pivotX="0%"
        android:pivotY="0%"
        android:toDegrees="0">
        <shape android:shape="rectangle">
            <corners android:radius="4dp"/>
            <padding
                android:bottom="1px"
                android:left="1px"
                android:right="1px"/>
            <solid android:color="#01000000" />
        </shape>
    </rotate>
</item>
<item android:left="8dp">
    <shape android:shape="rectangle">
        <padding
            android:bottom="1px"
            android:left="1px"
            android:right="1px"/>
        <solid android:color="#01000000" />
        <corners android:radius="8dp" />
    </shape>
</item>

<!--===============-->
<item>
    <rotate
        android:fromDegrees="-35"
        android:pivotX="0%"
        android:pivotY="0%"
        android:toDegrees="0">
        <shape android:shape="rectangle">
            <corners android:radius="4dp"/>
            <padding
                android:bottom="1px" />
            <solid android:color="#09000000" />
        </shape>
    </rotate>
</item>
<item android:left="8dp">
    <shape android:shape="rectangle">
        <padding
            android:bottom="1px" />
        <solid android:color="#09000000" />
        <corners android:radius="8dp" />
    </shape>
</item>

<!--===============-->

<item>
    <rotate
        android:fromDegrees="-35"
        android:pivotX="0%"
        android:pivotY="0%"
        android:toDegrees="0">
        <shape android:shape="rectangle">
            <corners android:radius="4dp"/>
            <padding
                android:bottom="1px"
                android:left="1px"
                android:right="1px"/>
            <solid android:color="#10000000" />
        </shape>
    </rotate>
</item>
<item android:left="8dp">
    <shape android:shape="rectangle">
        <padding
            android:bottom="1px"
            android:left="1px"
            android:right="1px"/>
        <solid android:color="#10000000" />
        <corners android:radius="8dp" />
    </shape>
</item>

<!--ForeGround-->

<item>
    <rotate
        android:fromDegrees="-35"
        android:pivotX="0%"
        android:pivotY="0%"
        android:toDegrees="0">
        <shape android:shape="rectangle">
            <corners android:radius="4dp"/>
            <solid android:color="@color/colorWhite" />
        </shape>
    </rotate>
</item>
<item android:left="8dp">
    <shape android:shape="rectangle">
        <solid android:color="@color/colorWhite" />
        <corners android:radius="8dp" />
    </shape>
</item>

</layer-list>

【讨论】：

你好，谢谢你，我已经看到这个帖子了，但我想把它弄圆！
您可以修改这些值，例如 android:radius for corners
如果您有完整的示例，请提供，谢谢