how to set materialButton icon to the center

With the Material Components library just use the app:iconGravity="textStart" attribute:

 <com.google.android.material.button.MaterialButton
        style="@style/Widget.MaterialComponents.Button.Icon"
        app:icon="@drawable/..."
        app:iconGravity="textStart"
        ../>

If you want to cut the corners use the app:shapeAppearanceOverlay attribute:

 <com.google.android.material.button.MaterialButton
        style="@style/Widget.MaterialComponents.Button.Icon"
        app:icon="@drawable/..."
        app:iconGravity="textStart"
        app:shapeAppearanceOverlay="@style/Button.Cut"
        ../>

with:

  <style name="Button.Cut" parent="">
    <item name="cornerFamily">cut</item>
    <item name="cornerSize">4dp</item>
  </style>

The code snippet you have in your original question is correct. This has been identified as a bug and will be fixed in the upcoming release.