使用xml文件在android中聊天时自定义形状

Question

我可以使用Shape

将自定义背景绘制到xml文件中

但是如何在指定的地方添加弧形或曲线。

Answer 1

在我的图书馆Facebook Like Button中，我实施了custom Path以实现这一目标。

能够在任何地方指定标记的位置：

来自source的代码：

import android.graphics.Path;
import android.graphics.RectF;

public class CalloutPath extends Path {
    public static final int MARKER_NONE = 0x0;
    public static final int MARKER_LEFT = 0x1;
    public static final int MARKER_TOP = 0x2;
    public static final int MARKER_RIGHT = 0x4;
    public static final int MARKER_BOTTOM = 0x8;
    public static final int MARKER_ALL = 0xf;

    private final RectF oval = new RectF();

    /**
    * @param m marker
    * @param w width
    * @param h height
    * @param s stroke thickness
    * @param r corners radius
    */
    public void build(int m, float w, float h, float s, float r) {
        int fl = factor(m, MARKER_LEFT);
        int ft = factor(m, MARKER_TOP);
        int fr = factor(m, MARKER_RIGHT);
        int fb = factor(m, MARKER_BOTTOM);

        float x0 = s + 0f;
        float x1 = s + r * fl;
        float x2 = s + r + r * fl;
        float x3 = w / 2f - r;
        float x4 = w / 2f;
        float x5 = w / 2f + r;
        float x6 = w - 1f - s - r - r * fr;
        float x7 = w - 1f - s - r * fr;
        float x8 = w - 1f - s;
        float y0 = s + 0f;
        float y1 = s + r * ft;
        float y2 = s + r + r * ft;
        float y3 = h / 2f - r;
        float y4 = h / 2f;
        float y5 = h / 2f + r;
        float y6 = h - 1f - s - r - r * fb;
        float y7 = h - 1f - s - r * fb;
        float y8 = h - 1f - s;

        reset();

        moveTo(x1, y2);

        oval.set(x2 - r, y2 - r, x2 + r, y2 + r);
        arcTo(oval, 180f, 90f);

        if (ft != 0) {
            lineTo(x3, y1);
            lineTo(x4, y0);
            lineTo(x5, y1);
        }

        lineTo(x6, y1);

        oval.set(x6 - r, y2 - r, x6 + r, y2 + r);
        arcTo(oval, 270f, 90f);

        if (fr != 0) {
            lineTo(x7, y3);
            lineTo(x8, y4);
            lineTo(x7, y5);
        }

        lineTo(x7, y6);

        oval.set(x6 - r, y6 - r, x6 + r, y6 + r);
        arcTo(oval, 0f, 90f);

        if (fb != 0) {
            lineTo(x5, y7);
            lineTo(x4, y8);
            lineTo(x3, y7);
        }

        lineTo(x2, y7);

        oval.set(x2 - r, y6 - r, x2 + r, y6 + r);
        arcTo(oval, 90f, 90f);

        if (fl != 0) {
            lineTo(x1, y5);
            lineTo(x0, y4);
            lineTo(x1, y3);
        }

        close();
    }

    public static int factor(int marker, int mask) {
        return (marker & mask) != 0 ? 1 : 0;
    }
}

Answer 2

因为你有这个弧或曲线，你应该创建一个自定义jpg。

但您可以使用corners并使用以下内容：

Answer 3

您无需以编程方式执行此操作，只需使用nine patch图像资源即可为您创建完美图像。如果您想了解有关nine patch及其工作原理的更多信息，请查看this和this链接。
正如您所看到的，此图像为您提供了完美的聊天气泡。我已经对Whatsapp，Viber进行了反编译，并且他们都使用nine patched图片来制作聊天气泡。如您所见，Telegram应用程序还使用nine patched image来实现此目的。

我的示例聊天气泡图片：
 

我还应该提到你不需要任何自定义路径。这是一个典型的修补图像，没有任何自定义。

Answer 4

制作这样的9patch图像，这样如果在对话中有很多文本，那么它也可以自行调整，也不会从曲线拉伸或压缩。

希望它能帮到你