如何使用可绘制位图和填充创建圆形按钮或 ImageButton 或 ImageView

Question

我不知道如何创建 Button 或 ImageButton 或 ImageView或任何具有：

可使用图标绘制的位图
一个填充

我现在尝试的是：

<ImageButton
            android:id="@+id/ShowInstructionsImageButton"
            android:contentDescription="@string/Common_InformationIconContentDescription"
            android:layout_alignParentRight="true"
            android:layout_width="20dp"
            android:layout_height="20dp"
            android:layout_margin="14dp"
            android:backgroundTint="@color/normalTextColorPrimaryDark"
            android:background="@drawable/ic_info_bitmap"
            android:layout_centerVertical="true" />

哪个有效，但是 ImageButton 的可点击区域是 20dp，我怎样才能使可点击区域为 48dp？

我已经检查了这里的讨论 Padding not working on ImageButton 但是如果我使用 android:src 而不是 android:background 我会在图标的位置得到一个黑框

图标是这样的：

Answer 1

首先，尝试使用 androidx.appcompat.widget.AppCompatImageButton 或 androidx.appcompat.widget.AppCompatImageView 而不是 ImageButton 以获得向后兼容性的优势。

之后，要使用它显示可绘制对象，您应该使用 app:srcCompat，而不是 android:background。现在，如果您向视图添加一些填充，它将应用于显示的可绘制对象。

<androidx.appcompat.widget.AppCompatImageButton
    android:id="@+id/ShowInstructionsImageButton"
    android:contentDescription="@string/Common_InformationIconContentDescription"
    android:layout_alignParentRight="true"
    android:layout_width="48dp"
    android:layout_height="48dp"
    android:padding="14dp"
    android:layout_centerVertical="true"
    app:tint="@color/normalTextColorPrimaryDark"
    app:srcCompat="@drawable/ic_info_bitmap" />

Answer 2

您可以使用 MaterialButton:

    <com.google.android.material.button.MaterialButton
        android:layout_width="48dp"
        android:layout_height="48dp"
        style="@style/Widget.App.Button.IconOnly"
        app:icon="@drawable/ic_add_24px"
        app:shapeAppearanceOverlay="@style/ShapeAppearanceOverlay.MyApp.Button.Circle"
        />

与：

<style name="Widget.App.Button.IconOnly" parent="Widget.MaterialComponents.Button.OutlinedButton" >
    <item name="iconPadding">0dp</item>
    <item name="android:insetTop">0dp</item>
    <item name="android:insetBottom">0dp</item>
    <item name="android:paddingLeft">12dp</item>
    <item name="android:paddingRight">12dp</item>
    <item name="android:minWidth">12dp</item>
    <item name="android:minHeight">12dp</item>
    <item name="iconGravity">textStart</item>
    <item name="strokeWidth">3dp</item>
    <item name="strokeColor">@color/...</item>
</style>

和圆形：

<style name="ShapeAppearanceOverlay.MyApp.Button.Circle" parent="">
    <item name="cornerFamily">rounded</item>
    <item name="cornerSize">50%</item>
</style>

Answer 3

我找到了适合我的解决方案：

<ImageButton
            android:id="@+id/ShowInstructionsImageButton"
            android:contentDescription="@string/Common_InformationIconContentDescription"
            android:layout_alignParentRight="true"
            android:layout_width="48dp"
            android:layout_height="48dp"
            android:layout_margin="14dp"
            android:backgroundTint="@color/normalTextColorPrimaryDark"
            android:background="@drawable/ic_info_layer"
            android:layout_centerVertical="true" />

与ic_info_layer.xml:

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >

  <item
      android:drawable="@drawable/ic_info_bitmap"
      android:width="@dimen/IconSize"
      android:height="@dimen/IconSize"
      android:right="@dimen/ButtonIconPadding"
      android:left="@dimen/ButtonIconPadding"
      android:top="@dimen/ButtonIconPadding"
      android:bottom="@dimen/ButtonIconPadding"
      />

</layer-list >

在 API < 23 上，ImageButton 具有固定的宽度和高度很重要，因为图层宽度和高度将被忽略。

如何使用可绘制位图和填充创建圆形按钮或 ImageButton 或 ImageView

How to create a circular Button or ImageButton or ImageView with a bitmap drawable and padding

layout

android

imagebutton

android-layout

xamarin.android