相同宽高设置下ImageButton与MaterialButton高度显示不一致如何解决

开发Android应用时，布局中同时放置ImageButton和MaterialButton两个控件，二者设置了完全相同的尺寸参数：layout_width="80dp"、layout_height="76dp"。实际渲染时ImageButton可以拉伸占满整个分配的布局区域，MaterialButton却无法完全填满对应高度区域，需要实现MaterialButton在高度方向完全填充给定布局空间的效果。

效果参考 #

ImageButton与Button显示效果对比

原始布局代码 #

<ImageButton
        android:id="@+id/backspaceImageBtn"
        android:layout_width="80dp"
        android:layout_height="76dp"
        android:layout_marginBottom="18dp"
        android:background="@drawable/custom_backspace_image_btn"
        app:backgroundTint="@color/light_btn"
        app:layout_constraintBottom_toTopOf="@+id/numbers_8Btn"
        app:layout_constraintEnd_toEndOf="@+id/numbers_8Btn"
        app:layout_constraintStart_toStartOf="@+id/numbers_8Btn"
        app:srcCompat="@drawable/ic_backspace" />

<com.google.android.material.button.MaterialButton
        android:id="@+id/symbol_divideBtn"
        android:layout_width="80dp"
        android:layout_height="76dp"
        android:layout_marginBottom="18dp"
        android:fontFamily="@font/roboto"
        android:stateListAnimator="@null"
        android:text="@string/symbol_divide"
        android:textColor="@color/light_text"
        android:textSize="36sp"
        app:backgroundTint="@color/light_btn"
        app:cornerRadius="18dp"
        app:layout_constraintBottom_toTopOf="@+id/numbers_9Btn"
        app:layout_constraintEnd_toEndOf="@+id/numbers_9Btn"
        app:layout_constraintStart_toStartOf="@+id/numbers_9Btn" />

MaterialButton作为Material Design组件，默认内置了符合设计规范的上下内边距（insetTop、insetBottom默认值为6dp），同时带有默认的最小高度限制，这两个默认属性会导致即使给控件设置了固定高度，实际可视的按钮背景也会被挤压，无法占满设定的整个布局空间。而原生ImageButton没有这类默认内置边距，所以可以直接填满分配的尺寸。

只需要给MaterialButton添加对应属性移除默认内置边距，再显式将最小高度设为0解除高度限制即可：

• 添加app:insetTop="0dp"、app:insetBottom="0dp"，移除控件默认的上下内置内边距
• 添加android:minHeight="0dp"，覆盖组件默认的最小高度限制，避免固定高度被默认规则干扰

修改后的MaterialButton代码如下：

<com.google.android.material.button.MaterialButton
        android:id="@+id/symbol_divideBtn"
        android:layout_width="80dp"
        android:layout_height="76dp"
        android:layout_marginBottom="18dp"
        android:fontFamily="@font/roboto"
        android:stateListAnimator="@null"
        android:text="@string/symbol_divide"
        android:textColor="@color/light_text"
        android:textSize="36sp"
        android:minHeight="0dp"
        app:backgroundTint="@color/light_btn"
        app:cornerRadius="18dp"
        app:insetTop="0dp"
        app:insetBottom="0dp"
        app:layout_constraintBottom_toTopOf="@+id/numbers_9Btn"
        app:layout_constraintEnd_toEndOf="@+id/numbers_9Btn"
        app:layout_constraintStart_toStartOf="@+id/numbers_9Btn" />

替换后重新预览布局，MaterialButton就会和ImageButton一样完全填满设定的76dp高度区域。

内容的提问来源于stack exchange，提问作者SizzlE