Android drawable内部旋转按钮

Question

I need to have a button series with inside text and icon. The icon inside the 4 buttons must rotate to cover every poly.

Follow an example with two buttons where the top is create with the original (vector drawable) icon and the "left" button rotating the vector.

        <Button
            style="@style/Buttons.Small"
            android:drawableLeft="@drawable/ic_vertical_align_top_white_12dp"
            android:text="@string/optional" />

        <Button
            style="@style/Buttons.Small"
            android:drawableLeft="@drawable/arrow_left"
            android:text="@string/optional" />

The vector drawable: ic_vertical_align_top_white_12dp

 <?xml version="1.0" encoding="UTF-8" standalone="no"?>
 <vector xmlns:android="http://schemas.android.com/apk/res/android"
     android:width="12dp"
     android:height="12dp"
     android:viewportHeight="24.0"
     android:viewportWidth="24.0">
     <path
         android:fillColor="#FFFFFF"
         android:pathData="M8,11h3v10h2V11h3l-4,-4 -4,4zM4,3v2h16V3H4z" />    
 </vector>

The rotate drawable: arrow_left.xml

<?xml version="1.0" encoding="utf-8"?>
<rotate xmlns:android="http://schemas.android.com/apk/res/android"
    android:fromDegrees="-90"
    android:toDegrees="-90"
    android:pivotX="50%"
    android:pivotY="50%"
    android:drawable="@drawable/ic_vertical_align_top_white_12dp">
</rotate>

The style

<style name="Buttons.Small">
    <item name="android:layout_width">wrap_content</item>
    <item name="android:layout_height">wrap_content</item>
    <item name="android:background">@color/buttonSmallBackground</item>
    <item name="android:layout_margin">2dp</item>
    <item name="android:minHeight">0dp</item>
    <item name="android:minWidth">0dp</item>
    <item name="android:textSize">12sp</item>
    <item name="android:drawablePadding">4dp</item>
    <item name="android:paddingLeft">4dp</item>
    <item name="android:paddingRight">4dp</item>
</style>

And following the result

Nougat (PERFECT)

Marshmallow (WRONG)

I already tried to play with the vector viewport without success.

Thanks

Answer 1

I solved with a trick. Appling directly the rotation inside the vector.

Now arrow_left.xml become

<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<vector xmlns:android="http://schemas.android.com/apk/res/android"
    android:width="12dp"
    android:height="12dp"
    android:viewportHeight="24.0"
    android:viewportWidth="24.0">
    <group android:rotation="-90"
        android:pivotX="12"
        android:pivotY="12">
        <path
            android:fillColor="#FFFFFF"
            android:pathData="M8,11h3v10h2V11h3l-4,-4 -4,4zM4,3v2h16V3H4z" />
    </group>
</vector>

I don't know why in Marshmallow the rotation not work properly but this solve my case.

Thanks