Build a "login with google" button with drawable xml

Question

I'm trying to get some confidence with the Android sistem UI by building some component all by myself, but I'm struggling a lot.

I decided to build a "login with Google" button using the drawable xml.

Here's my code.

The button inside my layout:

<androidx.appcompat.widget.AppCompatButton
        android:id="@+id/button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@drawable/sign_in_with_google"
        android:text="@string/login_google"
        android:paddingStart="45dp"
        android:textSize="14sp"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/linearLayout" />

Drawable: sign_in_with_google.xml

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

    <item>
        <shape android:shape="rectangle">

            <solid android:color="@color/light_background"/>
            <padding
                android:bottom="2dp"
                android:top="2dp"
                android:left="8dp"
                android:right="8dp"/>
            <stroke
                android:width="1dp"
                android:color="@color/dark_background_01" />
            <corners
                android:radius="22dp"/>
        </shape>
    </item>

    <item android:gravity="start">
        <bitmap android:src="@drawable/google_button_icon"
            android:gravity="center"
            />
    </item>

    <item android:gravity="start">
        <rotate android:fromDegrees="90">
            <shape android:shape="line">
                <padding
                    android:top="20dp"/>
                <stroke
                    android:width="1dp"
                    android:color="@color/dark_background_01" />
            </shape>
        </rotate>
    </item>



</layer-list>

With this code i was able to obtain an acceptable result but I can't figure out how to place the vertical divider beetwenn the google icon and the text. Another problem was the text overlapping the icon, which I solved by adding some padding from the button inside the layout, and I'm not sure that is the best way to solve it.

Beside those 2 problems, my question is, how can I build this button (by writing best xml) in a way that will display good on different devices, without parts overlapping?

Here's my current result: