微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

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

如何解决如何使用可绘制和填充的位图创建圆形Button或ImageButton或ImageView

我不知道如何创建 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,则会在图标的位置出现一个黑框

图标是这样的:

enter image description here

解决方法

首先,尝试使用androidx.appcompat.widget.AppCompatImageButtonandroidx.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" />
,

您可以使用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>

enter image description here

,

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

<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

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。