将 ImageView 缩放到设备宽度 [英] Scaling ImageView to device width

查看:15
本文介绍了将 ImageView 缩放到设备宽度的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

在我的 Android 应用程序中,我有一个 Activity,它显示具有以下尺寸 244 x 330 的图像.我想以完整的设备宽度显示这些图像.

In my Android App I have a Activity which show images which have following size 244 x 330. I want to show those images in full device width.

我的布局文件如下所示:

My layout file looks like this:

<?xml version="1.0" encoding="utf-8"?>
<ScrollView
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">

    <LinearLayout 
      android:layout_width="fill_parent"
      android:layout_height="fill_parent"
      android:orientation="vertical">

            <ImageView android:id="@+id/news_image" 
                android:layout_height="fill_parent" 
                android:layout_width="fill_parent"
                android:layout_marginLeft="18dip"
                android:layout_marginRight="18dip"
                android:background="#aaaaaa" />


    </LinearLayout>

</ScrollView>

我尝试设置 ImageView 的 ScaleType,但没有按比例缩放 ImageView 的 ScalingType.在横向模式和纵向模式下,如何按比例缩放图像以适合整个屏幕?

I tried to set the ScaleType of the ImageView but there is no ScalingType which scales the ImageView proportional. How can I scale the image proportionally to fit the whole screen in landscape mode AND portrait mode?

基本上我想要的是 ScaleType.CENTER_CORP 之类的东西,但它也设置了图像的比例高度,所以我可以看到它的全部,而不仅仅是图像的一部分.

Basically what I want is something like ScaleType.CENTER_CORP but which also sets the proportional height for the image so I can see all of it and not just a part of the image.

编辑因为我知道我的奇怪"任务让你感到困惑.

我想用图片展示给你看.这就是我目前的布局.我想通过根据需要缩放图像来填充整个灰色区域.我怎样才能做到这一点?

I want to show it to you with a image. This is what I get at the moment with my layout. I want to fill the whole grey area by scaling the image as big as needed. How can I accomplish that?

当我将 ScaleType 设置为 CENTER_CROP 时,我得到了这个

When I set the ScaleType to CENTER_CROP I get this

但这不是我想要的,因为你没有看到整个图像只是中心的一部分.

but this is not what I want cause you are not seeing the whole image just a part from the center.

这就是我想要的:

我希望这能帮助您理解我要完成的任务.有人知道怎么做吗?

I hope this helps you to understand what I'm trying to accomplish. Anyone knows how to do that?

编辑 2:

我试图显示高度大于屏幕尺寸的图像可能看起来很奇怪而且有点令人困惑,但是因为我在示例布局中使用了 ScrollView 这应该没问题,如果用户想查看未显示的区域,可以滚动.

It might look weird and little confusing that I'm trying to display a image which is bigger in the height than the screen size but since I'm using a ScrollView in my example layout this should be ok and the user could scroll if he want to see the not displayed area.

希望这有助于理解我正在尝试做什么.

Hope this helps to understand what I'm trying to do.

推荐答案

我用 fill_parentImageView 尝试了我的 ImageView 中的每一个 ScaleTypecode>wrap_content 但没有一个工作.我也尝试了我在 Google 上找到的所有内容,但也没有任何效果,所以我自己想出了一些东西.

I tried really every ScaleType in my ImageView with fill_parent and wrap_content but no of them worked. I also tried everything what I found on Google but nothing worked for me either so came up with something on my own.

很明显,ImageView 并没有像我想要缩放的那样缩放我的图像,所以我必须自己缩放它.缩放位图后,我会将新位图设置为 ImageView 的图像源.这很好用,在 G1 和摩托罗拉 Milestone 2 上看起来也很不错.

It was clear that the ImageView is not scaling my image like I wanted to be scaled so I had to scale it on my own. After scaling the bitmap I would set the new Bitmap as the image source to the ImageView. This works pretty good and looks very good on the G1 and on the Motorola Milestone 2.

这是我的所有代码

布局:

<ScrollView
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">

    <LinearLayout 
      android:layout_width="fill_parent"
      android:layout_height="fill_parent"
      android:id="@+id/news_wrapper">

            <ImageView android:id="@+id/news_image" 
                android:layout_height="fill_parent"
                android:layout_width="fill_parent"
                android:layout_marginLeft="18dip"
                android:layout_marginRight="18dip"
                android:background="#aaaaaa" />

    </LinearLayout>

</ScrollView>

活动

public class ScalingImages extends Activity {

    private ImageView imageView;

    /** Called when the activity is first created. */
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.test_margin);

        this.imageView = (ImageView)findViewById(R.id.news_image);

        // The image is coming from resource folder but it could also 
        // load from the internet or whatever
        Drawable drawable = getResources().getDrawable(R.drawable.img);
        Bitmap bitmap = ((BitmapDrawable)drawable).getBitmap();

        // Get scaling factor to fit the max possible width of the ImageView
        float scalingFactor = this.getBitmapScalingFactor(bitmap);

        // Create a new bitmap with the scaling factor
        Bitmap newBitmap = Util.ScaleBitmap(bitmap, scalingFactor);

        // Set the bitmap as the ImageView source
        this.imageView.setImageBitmap(newBitmap);
    }

    private float getBitmapScalingFactor(Bitmap bm) {
        // Get display width from device
        int displayWidth = getWindowManager().getDefaultDisplay().getWidth();

        // Get margin to use it for calculating to max width of the ImageView
        LinearLayout.LayoutParams layoutParams = 
            (LinearLayout.LayoutParams)this.imageView.getLayoutParams();
        int leftMargin = layoutParams.leftMargin;
        int rightMargin = layoutParams.rightMargin;

        // Calculate the max width of the imageView
        int imageViewWidth = displayWidth - (leftMargin + rightMargin);

        // Calculate scaling factor and return it
        return ( (float) imageViewWidth / (float) bm.getWidth() );
    }
}

实用类

public class Util {

    public static Bitmap ScaleBitmap(Bitmap bm, float scalingFactor) {
        int scaleHeight = (int) (bm.getHeight() * scalingFactor);
        int scaleWidth = (int) (bm.getWidth() * scalingFactor);

        return Bitmap.createScaledBitmap(bm, scaleWidth, scaleHeight, true);
    }

}

如果有更好或更准确的方法来完成相同的缩放请告诉我,因为我无法相信如此微不足道的事情会如此难以完成.

If there is an better or more accurate way to accomplish the same scaling please let me know because I can't believe that such a trivial thing is so hard to accomplish.

我真的希望看到一种更好的方法来做到这一点.

I'm really hoping to see a better way to do this.

感谢您的阅读.

这篇关于将 ImageView 缩放到设备宽度的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆