Android How to Remove the Inner Padding of a Vector Asset Drawable

Issue

My vector drawable from Vector Asset:

<vector
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:width="24dp"
    android:height="24dp"
    android:tint="@android:color/holo_purple"
    android:viewportWidth="24"
    android:viewportHeight="24">

    <path
        android:fillColor="@android:color/white"
        android:pathData="M7,14l5,-5 5,5z" />

</vector>

My layout:

<LinearLayout
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:orientation="vertical">

    <ImageView
        android:layout_width="80dp"
        android:layout_height="80dp"
        android:src="@drawable/ic_baseline_arrow_drop_up_24" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@drawable/background"
        android:text="Hi, my name is Sam"
        android:textColor="@android:color/white"
        android:textSize="30sp" />

</LinearLayout>

Current output:

How to remove the inner padding of this vector drawable? Any help will be appreciated.

Solution

Ok, here is the solution I come up with, not the perfect answer but meets my need.

Modify the Vector Drawable like this:

<vector
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:width="24dp"
    android:height="24dp"
    android:tint="@android:color/holo_purple"
    android:viewportWidth="24"
    android:viewportHeight="24">

    <group                       //key point
        android:pivotX="12"      //(12, 12) is the center accordig to the viewport, see link below
        android:pivotY="12"
        android:scaleX="2.0"     //twice bigger, adjust as needed
        android:scaleY="2.0"
        android:translateY="8">  //move downward, asjust as needed

        <path
            android:fillColor="@android:color/white"
            android:pathData="M7,14l5,-5 5,5z" />

    </group>

</vector>

Result:

---

The benefit of this solution is that no matter how you change the size of the ImageView, the target shape remains its position (at the bottom in my case), so no need to bother with RelativeLayout, just go with LinearLayout.

"pivot(12, 12)" explain: https://stackoverflow.com/a/51659233/3466808

Answered By - Sam Chen