Description: [MaterialButton] android:drawableStart doesn't work, both in preview nor in device. It ended up the same whether you're using xml drawable or bitmap.
Expected behavior:
Drawable expected to be drawn at the start of the MaterialButton.
Resulted behavior:

From top to bottom:
drawableEnd - drawableStart - drawableTop - drawableBottom
Source code:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:gravity="center"
tools:context=".MainActivity">
<com.google.android.material.button.MaterialButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="12dp"
android:drawableEnd="@drawable/ic_android_black_24dp"/>
<com.google.android.material.button.MaterialButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="12dp"
android:drawableStart="@drawable/ic_android_black_24dp"/>
<com.google.android.material.button.MaterialButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="12dp"
android:drawableTop="@drawable/ic_android_black_24dp"/>
<com.google.android.material.button.MaterialButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="12dp"
android:drawableBottom="@drawable/ic_android_black_24dp"/>
</LinearLayout>
Android API version: API 22 and above; might have also happened on earlier APIs.
Material Library version: 1.1.0
Device: Android Studio Emulator
Also, it is possible that this is related to #599 .
@Andrei-Stakov
You should try it with
implementation 'com.google.android.material:material:1.2.0-alpha05'
Hey there!
Instead of using drawableBottom|Top|Left|... use MaterialButton's attributes app:icon and app:iconGravity.
Like:
<Button
style="@style/Widget.MaterialComponents.Button.OutlinedButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:contentDescription="@string/cat_button_icon_btn_text"
app:icon="@drawable/ic_dialogs_24px"
app:iconGravity="textStart"
app:iconPadding="0dp"/>
The above is from our catalog demo app here:
https://github.com/material-components/material-components-android/blob/master/catalog/java/io/material/catalog/button/res/layout/cat_buttons_fragment.xml#L140-L141
I'm going to go ahead and close this but if this isn't what you were asking or doesn't solve the issue, feel free to reopen!
@Mika-89 @hunterstich
Oof, thanks guys! I got used to Material themes automatically inflate my buttons to MaterialButton, so I totally forgot about app:icon.
It works for my current needs, but on 1.1.0 (haven't tested it on alpha builds), app:icon doesn't really work well with drawableTop/Bottom/End/Right; it won't shown, except for the one designated in app:icon. Is this intended? Since on normal buttons, using drawableStart/Left added with others allows the button to have multiple drawable attached.
Isn't there a icon gravity xml field for that what you want?
@Mika-89
It's only limited to start, end, textStartand textEnd for now. It fits the Material design direction, but that really makes me wonder if top/bottom option could be a viable option addition in the future.
I just merged this PR which adds support for adding an icon above a button's text - https://github.com/material-components/material-components-android/pull/1129
That should be synced out soon if that helps
Great progress, thank you all!
Most helpful comment
Hey there!
Instead of using
drawableBottom|Top|Left|...useMaterialButton's attributesapp:iconandapp:iconGravity.Like:
The above is from our catalog demo app here:
https://github.com/material-components/material-components-android/blob/master/catalog/java/io/material/catalog/button/res/layout/cat_buttons_fragment.xml#L140-L141
I'm going to go ahead and close this but if this isn't what you were asking or doesn't solve the issue, feel free to reopen!