使 Android ImageButton 看起来像 Button

Question

documentation 代表 ImageButton 说：

默认情况下，ImageButton 看起来像普通的Button

这显然是错误的，因为当我将两者都放入布局时：

    <Button
        android:id="@+id/button2"
        android:layout_width="200dp"
        android:layout_height="50dp"
        android:layout_margin="20dp"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <ImageButton
        android:id="@+id/imageButton3"
        android:layout_width="200dp"
        android:layout_height="50dp"
        android:layout_margin="20dp"
        app:layout_constraintStart_toStartOf="@+id/button2"
        app:layout_constraintTop_toBottomOf="@+id/button2" />

并运行它，它看起来像这样：

Button 有颜色和阴影，而ImageButton 只是一个灰色矩形（我认为是圆角）。

很遗憾，我完全不了解样式的工作原理。不过，我的主要问题是如何将 ImageButton 的配置更改为 实际上 使其看起来像普通的 Button。

Answer 1

您在使用材料设计吗？您的 Button 看起来不像默认样式为 @style/Widget.AppCompat.Button 的 regular 按钮，而是像默认样式为 @style/Widget.MaterialComponents.Button 的 ma​​terial 按钮。如果您将 Button 的样式设置为 @style/Widget.AppCompat.Button，您会看到它看起来与默认样式为 @style/Widget.AppCompat.ImageButton 的 ImageButton 相同

这是@style/Widget.AppCompat.Button，可以看到是在@style/Widget.AppCompat.Button的基础上扩展的：

<style name="Widget.MaterialComponents.Button" parent="Widget.AppCompat.Button">
<item name="enforceMaterialTheme">true</item>
<item name="android:background">@empty</item>
<item name="enforceTextAppearance">true</item>
<item name="android:textAppearance">?attr/textAppearanceButton</item>
<item name="android:textColor">@color/mtrl_btn_text_color_selector</item>
<item name="android:paddingLeft">@dimen/mtrl_btn_padding_left</item>
<item name="android:paddingRight">@dimen/mtrl_btn_padding_right</item>
<item name="android:paddingTop">@dimen/mtrl_btn_padding_top</item>
<item name="android:paddingBottom">@dimen/mtrl_btn_padding_bottom</item>
<item name="android:insetLeft">0dp</item>
<item name="android:insetRight">0dp</item>
<item name="android:insetTop">@dimen/mtrl_btn_inset</item>
<item name="android:insetBottom">@dimen/mtrl_btn_inset</item>
<item name="android:stateListAnimator" ns2:ignore="NewApi">@animator/mtrl_btn_state_list_anim</item>
<item name="cornerRadius">@null</item>
<item name="elevation">@dimen/mtrl_btn_elevation</item>
<item name="iconPadding">@dimen/mtrl_btn_icon_padding</item>
<item name="iconTint">@color/mtrl_btn_text_color_selector</item>
<item name="rippleColor">@color/mtrl_btn_ripple_color</item>
<item name="backgroundTint">@color/mtrl_btn_bg_color_selector</item>
<item name="shapeAppearance">?attr/shapeAppearanceSmallComponent</item>
</style>

那么，你可以为ImageButton自定义一个新的样式，然后将这些新的材质按钮样式属性添加到自定义样式中（主要是cornerRadius、elevation和rippleColor）

或将按钮的样式设置为@style/Widget.AppCompat.Button，同时也会使ImageButton看起来像按钮：P