在 Android 中的 ImageButton 中适合图像
Posted
技术标签:
【中文标题】在 Android 中的 ImageButton 中适合图像【英文标题】：Fit Image in ImageButton in Android 【发布时间】：2013-02-13 12:20:12 【问题描述】：我的活动中有 6 个 ImageButton，我通过其中的代码设置图像（不使用 xml）。
我希望它们覆盖 75% 的按钮区域。但是由于有些图像覆盖的区域较小，有些图像太大而无法放入 imageButton。如何以编程方式调整大小并显示它们？ 下面是截图
下面是xml文件
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_
android:layout_
android:orientation="vertical"
android:layout_marginBottom="5sp"
android:layout_marginLeft="2sp"
android:layout_marginRight="5sp"
android:layout_marginTop="0sp" >
<LinearLayout
android:layout_
android:layout_
android:layout_weight="1"
android:orientation="horizontal">
<ImageButton
android:layout_
android:layout_
android:layout_weight="1"
android:id="@+id/button_topleft"
android:layout_marginBottom="5sp"
android:layout_marginLeft="2sp"
android:layout_marginRight="5sp"
android:layout_marginTop="0sp"
/>
<ImageButton
android:layout_
android:layout_
android:layout_weight="1"
android:id="@+id/button_topright"
android:layout_marginBottom="5sp"
android:layout_marginLeft="2sp"
android:layout_marginRight="5sp"
android:layout_marginTop="0sp"
/>
</LinearLayout>
<LinearLayout
android:layout_
android:layout_
android:layout_weight="1"
android:orientation="horizontal">
<ImageButton
android:layout_
android:layout_
android:layout_weight="1"
android:id="@+id/button_repeat"
android:layout_marginBottom="5sp"
android:layout_marginLeft="2sp"
android:layout_marginRight="5sp"
android:layout_marginTop="0sp"
/>
<ImageButton
android:layout_
android:layout_
android:layout_weight="1"
android:id="@+id/button_next"
android:layout_marginBottom="5sp"
android:layout_marginLeft="2sp"
android:layout_marginRight="5sp"
android:layout_marginTop="0sp"
/>
</LinearLayout>
<LinearLayout
android:layout_
android:layout_
android:layout_weight="1"
android:orientation="horizontal">
<ImageButton
android:layout_
android:layout_
android:layout_weight="1"
android:id="@+id/button_bottomleft"
android:layout_marginBottom="5sp"
android:layout_marginLeft="2sp"
android:layout_marginRight="5sp"
android:layout_marginTop="0sp"
/>
<ImageButton
android:layout_
android:layout_
android:layout_weight="1"
android:id="@+id/button_bottomright"
android:layout_marginBottom="5sp"
android:layout_marginLeft="2sp"
android:layout_marginRight="5sp"
android:layout_marginTop="0sp"
/>
</LinearLayout>
</LinearLayout>
和一个sn-p 我的类.java：
public void addImageButtons()
iB_topleft = (ImageButton) findViewById(R.id.button_topleft);
iB_topright = (ImageButton) findViewById(R.id.button_topright);
iB_bottomleft = (ImageButton) findViewById(R.id.button_bottomleft);
iB_bottomright = (ImageButton) findViewById(R.id.button_bottomright);
iB_next = (ImageButton) findViewById(R.id.button_next);
iB_repeat = (ImageButton) findViewById(R.id.button_repeat);
public void setImageNextAndRepeat()
iB_topleft .setImageResource(R.drawable.aa);
iB_topright.setImageResource(R.drawable.bb);
iB_bottomleft.setImageResource(R.drawable.cc);
iB_bottomright.setImageResource(R.drawable.dd);
iB_next.setImageResource(R.drawable.next);
iB_repeat.setImageResource(R.drawable.repeat);
【问题讨论】：
你检查过android提供的缩放方法吗？ developer.android.com/reference/android/widget/… 【参考方案1】：您可以像我一样制作您的 ImageButton 小部件。就我而言，我需要一个具有固定图标大小的小部件。 让我们从自定义属性开始：
<?xml version="1.0" encoding="utf-8"?>
<resources>
<declare-styleable name="ImageButtonFixedIconSize">
<attr name="imageButton_icon" format="reference" />
<attr name="imageButton_iconWidth" format="dimension" />
<attr name="imageButton_iconHeight" format="dimension" />
</declare-styleable>
</resources>
Widget类很简单（重点是onLayout方法中的padding计算）：
class ImageButtonFixedIconSize
@JvmOverloads
constructor(
context: Context,
attrs: AttributeSet? = null,
defStyleAttr: Int = android.R.attr.imageButtonStyle
) : ImageButton(context, attrs, defStyleAttr)
private lateinit var icon: Drawable
@Px
private var iconWidth: Int = 0
@Px
private var iconHeight: Int = 0
init
scaleType = ScaleType.FIT_XY
attrs?.let retrieveAttributes(it)
/**
*
*/
override fun onLayout(changed: Boolean, left: Int, top: Int, right: Int, bottom: Int)
val width = right - left
val height = bottom - top
val horizontalPadding = if(width > iconWidth) (width - iconWidth) / 2 else 0
val verticalPadding = if(height > iconHeight) (height - iconHeight) / 2 else 0
setPadding(horizontalPadding, verticalPadding, horizontalPadding, verticalPadding)
setImageDrawable(icon)
super.onLayout(changed, left, top, right, bottom)
/**
*
*/
private fun retrieveAttributes(attrs: AttributeSet)
val typedArray = context.obtainStyledAttributes(attrs, R.styleable.ImageButtonFixedIconSize)
icon = typedArray.getDrawable(R.styleable.ImageButtonFixedIconSize_imageButton_icon)!!
iconWidth = typedArray.getDimension(R.styleable.ImageButtonFixedIconSize_imageButton_iconWidth, 0f).toInt()
iconHeight = typedArray.getDimension(R.styleable.ImageButtonFixedIconSize_imageButton_iconHeight, 0f).toInt()
typedArray.recycle()
最后你应该像这样使用你的小部件：
<com.syleiman.gingermoney.ui.common.controls.ImageButtonFixedIconSize
android:layout_
android:layout_
app:imageButton_icon="@drawable/ic_backspace"
app:imageButton_iconWidth="20dp"
app:imageButton_iconHeight="15dp"
android:id="@+id/backspaceButton"
tools:ignore="ContentDescription"
/>
【讨论】：
【参考方案2】：我希望它们覆盖 75% 的按钮区域。
使用android:padding="20dp"（根据需要调整填充）来控制图像在按钮上的占用量。
但有些图像覆盖的区域较小，有些图像太大而无法放入 imageButton。如何以编程方式调整大小并显示它们？
使用android:scaleType="fitCenter" 让Android 缩放图像，使用android:adjustViewBounds="true" 让它们因缩放而调整其边界。
所有这些属性都可以在运行时在每个ImageButton 的代码中设置。但是，在我看来，在 xml 中设置和预览要容易得多。
另外，不要将sp 用于文本大小以外的任何内容，它会根据用户设置的文本大小偏好进行缩放，因此您的sp 尺寸将大于您的预期如果用户有“大”文本设置。请改用dp，因为它不会根据用户的文本大小偏好进行缩放。
以下是每个按钮的外观：
<ImageButton
android:id="@+id/button_topleft"
android:layout_
android:layout_
android:layout_marginBottom="5dp"
android:layout_marginLeft="2dp"
android:layout_marginRight="5dp"
android:layout_marginTop="0dp"
android:layout_weight="1"
android:adjustViewBounds="true"
android:padding="20dp"
android:scaleType="fitCenter" />
【讨论】：
@Steven Byle 抱歉回复晚了，但是除了相对布局，我怎么能应用相同的？ 对于那些正在寻找的人，ImageButton 方法 setScaleType(ImageView.ScaleType.CENTER) setAdjustViewBounds(true) 以编程方式执行此操作。
也做 android:background="@null" 来试试默认背景【参考方案3】：
参考下面的链接，试着找到你真正想要的：
ImageView.ScaleType CENTER 使图像在视图中居中，但执行 没有缩放。
ImageView.ScaleType CENTER_CROP 均匀缩放图像（保持 图像的纵横比），以便两个尺寸（宽度和高度） 的图像将等于或大于相应的 视图的尺寸（减去填充）。
ImageView.ScaleType CENTER_INSIDE 均匀缩放图像（保持 图像的纵横比），以便两个尺寸（宽度和高度） 图像的尺寸将等于或小于相应的尺寸 视图（减去填充）。
ImageView.ScaleType FIT_CENTER 使用 CENTER 缩放图像。
ImageView.ScaleType FIT_END 使用 END 缩放图像。
ImageView.ScaleType FIT_START 使用 START 缩放图像。
ImageView.ScaleType FIT_XY 使用 FILL 缩放图像。
ImageView.ScaleType MATRIX 绘制时使用图像矩阵进行缩放。
https://developer.android.com/reference/android/widget/ImageView.ScaleType.html
【讨论】：
【参考方案4】：在我的情况下效果很好。首先，您下载一个图像并将其重命名为 iconimage，将其定位在 drawable 文件夹中。您可以通过设置android:layout_width 或android:layout_height 来更改大小。最后，我们有
<ImageButton
android:id="@+id/answercall"
android:layout_
android:layout_
android:src="@drawable/iconimage"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:scaleType="fitCenter" />
【讨论】：
【参考方案5】：我最近偶然发现，由于您对 ImageView 有更多控制权，因此您可以为图像设置 onclicklistener 这是一个动态创建的图像按钮示例
private int id;
private bitmap bmp;
LinearLayout.LayoutParams familyimagelayout = new LinearLayout.LayoutParams(
LinearLayout.LayoutParams.MATCH_PARENT,LinearLayout.LayoutParams.WRAP_CONTENT );
final ImageView familyimage = new ImageView(this);
familyimage.setBackground(null);
familyimage.setImageBitmap(bmp);
familyimage.setScaleType(ImageView.ScaleType.FIT_START);
familyimage.setAdjustViewBounds(true);
familyimage.setId(id);
familyimage.setOnClickListener(new View.OnClickListener()
@Override
public void onClick(View v)
//what you want to do put here
);
【讨论】：
这不是一个坏主意。我喜欢。【参考方案6】：我在xml中使用以下代码
android:adjustViewBounds="true"
android:scaleType="centerInside"
【讨论】：
我有一个相当“扁平”的矩形，这对我来说效果很好......不过有一个问题：确保使用“android:src”而不是“android:background”。 +1。 @johnny 感谢朋友的提示！【参考方案7】：我满意地使用android:scaleType="fitCenter"。
【讨论】：
【参考方案8】：尝试在 i-Imagebutton xml 中使用android:scaleType="fitXY"
【讨论】：
虽然这行得通并且可以缩放，但我希望它应该覆盖 75% 的区域以获得更好的可见性。 @PowerPC 尝试使用 framelayout 将高度和宽度设置为 75%，然后使用您的 imagebutton 并将比例类型设置为 xy 线性布局内每个图像按钮的框架布局？你能澄清一下吗 @PowerPC 我从不使用这个，但是这个链接可以帮助你***.com/questions/9946580/… @StevenByle 我考虑了这两种方法，但由于我想要 75% 的区域覆盖率，因此您的解决方案运行良好。谢谢。以上是关于在 Android 中的 ImageButton 中适合图像的主要内容，如果未能解决你的问题，请参考以下文章
Android中怎么指导ImageButton使用的是哪个resource id?
如果Android版本在“X”下如何隐藏ImageButton？
android imageButton 点击按钮前中后，按钮颜色的变化