How to customize Matetrial Icon Button Padding?

Question

My Scenario

I want to use material icon button with fixed icon ( vector drawable ) _ means no padding. And I used google material:

implementation 'com.google.android.material:material:1.0.0'

This is my layout

 <com.google.android.material.button.MaterialButton

        android:id="@+id/btnLinkin"
        style="@style/AppIconButton"

        app:icon="@drawable/ic_linkedin"
        app:iconTintMode="screen"

        android:layout_width="wrap_content"
        android:layout_height="wrap_content"

        android:layout_marginEnd="8dp"
        app:layout_constraintEnd_toStartOf="@+id/btnGoogle"
        android:layout_marginRight="8dp"
        app:layout_constraintStart_toEndOf="@+id/btnFacebook"
        android:layout_marginStart="8dp"
        android:layout_marginLeft="8dp"
        android:layout_marginBottom="16dp"
        app:layout_constraintBottom_toTopOf="@+id/tvHave"/>

This is my style

 <style name="AppIconButton" parent="Widget.MaterialComponents.Button.OutlinedButton.Icon">
    <item name="rippleColor">@color/colorSecondary</item>
    <item name="strokeColor">@android:color/transparent</item>
    <item name="iconTint">@android:color/transparent</item>
    <item name="android:gravity">center</item>

This is material components's style

<style name="Widget.MaterialComponents.Button.OutlinedButton.Icon">
    <item name="android:paddingLeft">@dimen/mtrl_btn_icon_btn_padding_left</item>
    <item name="android:paddingRight">@dimen/mtrl_btn_icon_btn_padding_left</item>
</style>

This is material components' dimension

<dimen name="mtrl_btn_icon_padding">0dp</dimen>
<dimen name="mtrl_btn_icon_btn_padding">0dp</dimen>
<dimen name="mtrl_btn_icon_btn_padding_left">0dp</dimen>

But these cant make me what I really want. The result is Material Icon Button with no left padding, but Right default padding (14dp) as following:

Please save my days or Guide to learn how can I really understand what the concepts are.

Answer 1

You can try to use app:iconPadding="0dp" like:

<com.google.android.material.button.MaterialButton
    android:id="@+id/button"
    style="@style/Widget.MaterialComponents.Button.Icon"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    app:icon="@drawable/your_icon"
    app:iconTint="@null"
    app:backgroundTintMode="src_over"
    app:cornerRadius="14dp"
    app:iconPadding="0dp"
    android:paddingStart="24dp"
    android:paddingTop="5dp"
    android:paddingEnd="24dp"
    android:paddingBottom="5dp"
    app:backgroundTint="@color/button_background_color"
    android:theme="@style/Theme.MaterialComponents.Light"/>

Result:

If you use a button with text:

<com.google.android.material.button.MaterialButton
    android:id="@+id/button"
    style="@style/Widget.MaterialComponents.Button.Icon"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="@string/button_text"
    android:textAppearance="@style/ButtonStyle"
    app:icon="@drawable/icon"
    app:iconTint="@null"
    app:iconGravity="textStart"
    android:textColor="@color/button_text_color"
    app:backgroundTintMode="src_over"
    app:cornerRadius="14dp"
    app:iconPadding="15dp"
    android:paddingStart="24dp"
    android:paddingTop="5dp"
    android:paddingEnd="24dp"
    android:paddingBottom="5dp"
    app:backgroundTint="@color/button_background_color"
    android:theme="@style/Theme.MaterialComponents.Light"/>

Result: