缩放图像保持其纵横比在背景中可绘制

时间:2012-03-27 13:59:34

标签: android scaling android-drawable android-bitmap android-background

当使用<bitmap />作为背景可绘制XML时,如何使背景图像适合视图但保持其纵横比? <bitmap>的{​​{1}}值均未达到预期的效果。

9 个答案:

答案 0 :(得分:57)

仅在xml文件中实现操作背景属性是不可能的。有两种选择:

  1. 使用编程方式剪切/缩放位图 Bitmap.createScaledBitmap(Bitmap src, int dstWidth, int dstHeight, boolean filter)并将其设置为View的某些背景。

  2. 您使用ImageView而非背景将其作为第一个布局元素并为其指定android:scaleType属性:

    <RelativeLayout
        android:layout_width="fill_parent"
        android:layout_height="fill_parent" >
    
        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
    
            android:src="@drawable/backgrnd"
            android:scaleType="centerCrop" />
    
        ...
    
        rest layout components here
    
        ...
    
    </RelativeLayout>
    

答案 1 :(得分:34)

有一种简单的方法可以从drawable中执行此操作:

<强> your_drawable.xml

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

    <item android:drawable="@color/bg_color"/>
    <item>
        <bitmap
            android:gravity="center|bottom|clip_vertical"
            android:src="@drawable/your_image" />
    </item>

</layer-list>

唯一的缺点是,如果没有足够的空间,你的图像将无法完全显示,但它会被剪裁,我找不到直接从drawable中做到这一点的方法。但是从我做过的测试来看,它的效果非常好,而且它并没有削减那么多的图像。您可以使用重力选项进行更多操作。

另一种方法是创建一个布局,您将使用 ImageView 并将 scaleType 设置为 { {1}}

希望这些信息可以帮助您实现自己想要的目标。

答案 2 :(得分:3)

另一种方法是创建常规图像的patch 9 images并使其按照您希望的方式伸展。

您可以通过在角落放置9个补丁点来使内容居中,这样可以明显地保留您的比例(假设图像的最外边缘是可重复/透明的)。

希望你明白这一点。

答案 3 :(得分:3)

我想在我的自定义Drawable类中做类似的事情。 以下是重要的部分:

public class CustomBackgroundDrawable extends Drawable
{
    private Rect mTempRect = new Rect();
    private Paint mBitmapPaint = new Paint(Paint.ANTI_ALIAS_FLAG);

    ...

public void draw(@NonNull Canvas canvas)
{
    Rect bounds = getBounds();
    if (mBitmap != null ) {
        if (mScaleType == ScaleType.SCALE_FILL) {
            //bitmap scales to fill the whole bounds area (bitmap can be cropped)
            if (bounds.height() > 0 && bounds.height() > 0) {
                float scale = Math.min(mBitmap.getWidth()/(float)bounds.width(), mBitmap.getHeight()/(float)bounds.height());

                float bitmapVisibleWidth = scale * bounds.width();
                float bitmapVisibleHeight = scale * bounds.height();

                mTempRect.set((int)(mBitmap.getWidth()-bitmapVisibleWidth)/2, 0, (int)(bitmapVisibleWidth+mBitmap.getWidth())/2, (int)bitmapVisibleHeight);
                canvas.drawBitmap(mBitmap, mTempRect, bounds, mBitmapPaint);
            }
        } else if (mScaleType == ScaleType.SCALE_FIT) {
            //bitmap scales to fit in bounds area
            if (bounds.height() > 0 && bounds.height() > 0) {
                float scale = Math.min((float)bounds.width()/mBitmap.getWidth(), (float)bounds.height()/mBitmap.getHeight());

                float bitmapScaledWidth = scale * mBitmap.getWidth();
                float bitmapScaledHeight = scale * mBitmap.getHeight();
                int centerPadding = (int)(bounds.width()-bitmapScaledWidth)/2;
                mTempRect.set(bounds.left + centerPadding, bounds.top, bounds.right - centerPadding, bounds.top+(int)bitmapScaledHeight);
                canvas.drawBitmap(mBitmap, null, mTempRect, mBitmapPaint);
            }
        }
    }
}

使用这种方法,您可以灵活地应用您需要的任何缩放逻辑

答案 4 :(得分:2)

使用a.ch描述的方法对我来说非常有用,除了我使用的这种比例类型更能满足我的需求:

android:scaleType="centerCrop"

以下是可用比例类型的完整列表: http://developer.android.com/reference/android/widget/ImageView.ScaleType.html

答案 5 :(得分:2)

尝试使用InsetDrawable(对我来说效果很好)。

只需将这四个方面中的任意一个给予你的可绘制和插入(或填充)。

InsetDrawable insetDrawable = new InsetDrawable(drawable, insetLeft, insetTop, insetRight, insetBottom);

它专门用于设置尺寸小于View的背景可绘制。

见这里: https://developer.android.com/reference/android/graphics/drawable/InsetDrawable.html

答案 6 :(得分:1)

老问题,但其他答案都没有对我有用。然而,这个xml代码做了:

<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

    <ImageView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_alignParentTop="true"
        android:scaleType="centerCrop"
        android:src="@drawable/background_image"/> 

</RelativeLayout>

答案 7 :(得分:1)

如果您的位图比高位宽,请使用android:gravity="fill_vertical"。否则,请使用android:gravity="fill_horizontal"。这与在android:scaleType="centerCrop"上使用ImageView的效果类似。

<bitmap xmlns:android="http://schemas.android.com/apk/res/android"
    android:gravity="fill_vertical"
    android:src="@drawable/image" />

如果您支持多个方向,则可以在drawable-port文件夹中创建一个位图XML文件,在drawable-land文件夹中创建另一个位图XML文件。

答案 8 :(得分:0)

为了适合图片到可用空间(或者如果你在dp中设置了宽度高度),我试过了如果图像不太宽,也可采用以下方法。

在这里,我为方形图像设置了相同的宽度高度 [或者你可以wrap_content两个]。

<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

    <ImageView
        android:layout_width="80dp"
        android:layout_height="80dp"
        android:layout_alignParentTop="true"
        android:adjustViewBounds="true"
        android:scaleType="fitCenter"
        android:src="@drawable/background_image"/> 

</RelativeLayout>

adjust view boundsscale type center fit可以解决问题。