0

I need to create a speech bubble pointing up, but I'm not familiar with android shapes, so looking for examples come across with one as expected, but pointing down, and as I don't know the meaning of pivotX and pivotY, all my attempts to invert the pointing triangle were not at all successfull.

Apart from that, this example creates the bubble effect with two xml files, but it could be also great if it could be possible to do it with only one xml (this wouldn't be so important though).

As a last point maybe I would like to make the pointing triangle a little bit higher, or also a little bit bigger, so apart from the given example, it wouldn't be bad if you could give one or two examples more according this.

Thanks.

Given the next Drawable files

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>

And the next code:

<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>

You get the following result:

enter image description here

But I expect the opposite:

enter image description here

Diego Perez
  • 2,188
  • 2
  • 30
  • 58
  • Does this help or is this what you are looking for - [link](https://stackoverflow.com/questions/67214466/android-drawable-tooltip-arrow-box) – Nitish Sep 16 '21 at 10:19
  • Thank you very much @Nitish, that is exactly what I was looking for so, if you write it as an answer I'll mark it as correct. – Diego Perez Sep 17 '21 at 11:10
  • Just mark the original answer , I didn't write the original answer so I can't take credit for other people work. – Nitish Sep 17 '21 at 11:19

0 Answers0