2011-02-02 215 views
14

在我的Android应用程序中,我有一个活动,它显示具有以下尺寸244 x 330的图像。 我想以完整的设备宽度显示这些图像。将ImageView缩放到设备宽度

我的布局文件看起来是这样的:

<?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但没有ScalingType其缩放比例ImageView的。 如何在横向模式和纵向模式下按比例缩放图像以适合整个屏幕?

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

编辑原因我知道我很困惑你和我的“怪异”任务。

我想用图像展示给你。 这是我现在用我的布局得到的。我想通过根据需要缩放图像来填充整个灰色区域。我怎么能做到这一点?

当我设置ScaleTypeCENTER_CROP我得到这个

,但这不是我想要引起你是不是看到整个图像刚刚从中心开始的一部分内容。

而这正是我希望它是:

我希望这有助于你了解我试图完成。 任何人都知道该怎么做?

编辑2:

它看起来怪异,有点混乱,我试图来显示图像,其在高度上比屏幕尺寸更大,但因为我在我的例子使用ScrollView布局这应该是好的,用户可以滚动,如果他想看到未显示的区域。

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

回答

29

我在ImageView试过真的每ScaleTypefill_parentwrap_content,但没有一次成功。我也尝试了我在谷歌上找到的一切,但没有为我工作,所以我自己想出了一些东西。

很明显,ImageView没有缩放我的图像,因为我想缩放,所以我不得不自己缩放它。缩放位图后,我会将新的位图设置为ImageView的图像源。这工作不错,看起来很不错的G1和摩托罗拉里程碑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); 
    } 

} 

如果有更好或更准确的方法来完成相同的缩放请让我知道因为我不能相信这样一个小事情是很难完成。

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

谢谢您的阅读。

2

您是否试图通过ImageView.setScaleType()以编程方式设置它?

setAdjustViewBounds(false)也可能有帮助。

编辑:对不起,我错读了这个问题。无论如何,setAdjustViewBounds()仍然可能会有所帮助。从来没有使用它。

+0

我刚刚尝试过`setAdjustViewBounds`,但它没有帮助。还有其他建议吗?也许我的编辑让我的目标更好理解。 – OemerA 2011-02-02 22:44:51

2

我想要显示那些图像完整的 设备宽度。

这很简单。你只是有错误的边距设置。删除这些行,您的图像将显示在完整的设备宽度:

android:layout_marginLeft="18dip" 
android:layout_marginRight="18dip" 
+0

这似乎很奇怪,但实际上我希望有这些边缘,否则它会像“粘”到屏幕上。除非那些18左右倾斜,我想使用整个屏幕大小。 – OemerA 2011-02-02 22:08:20

3

对您要查找的内容有些困惑。如果您要缩放以适应屏幕,则有三种选择,其中两种可以保持比例。你可以使用ScaleType fitCenter,它可以使图像按比例适合边界,或者你可以使用centerCrop(你说你尝试过),它将拉伸图像的最短边以适应容器(意味着某些将被裁剪掉在较长的维度上)。无法裁剪或不成比例地拉伸,以至于不能适应宽度和高度。

编辑:好的,我想我现在明白你的观点。首先,我将你的LinearLayout设置为wrap_content的高度。其次,在代码中,这是我可以想到的一种方式。可能还有另一种方法,可以通过首先获取屏幕尺寸,然后使用新尺寸执行createScaledBitmap,然后设置背景资源。

final ImageView newsImage = (ImageView)findViewById(R.id.news_image); 

//get details on resolution from the display 
DisplayMetrics metrics = new DisplayMetrics(); 
getWindowManager().getDefaultDisplay().getMetrics(metrics); 

//going to set what happens as the layout happens 
newsImage.getViewTreeObserver().addOnGlobalLayoutListener(
    new ViewTreeObserver.OnGlobalLayoutListener() { 

     public void onGlobalLayout() { 
      int oldHeight, oldWidth, newHeight, newWidth; 

      //we want the new width to be as wide as the screen 
      newWidth = metrics.widthPixels; 

      oldHeight = newsImage.getDrawable().getIntrinsicHeight(); 
      oldWidth = newsImage.getDrawable().getIntrinsicWidth(); 

      //keeping the aspect ratio, the new height should be w1/h1 = w2/h2 
      newHeight = Math.floor((oldHeight * newWidth)/oldWidth); 
      LinearLayout.LayoutParams params = 
       (LinearLayout.LayoutParams)newsImage.getLayoutParams(); 
      params.height = newHeight; 
      params.width = newWidth; 
      newsImage.setLayoutParams(params); 
      newsImage.setScaleType(ScaleType.CENTER); 
      newsImage.invalidate(); 
      newsImage.getViewTreeObserver().removeGlobalOnLayoutListener(this); 
     } 
    } 
} 
+0

我试过,但`ScaleType.CENTER_CROP`did切高度。你能提供样品吗?我会再试一次(也许我犯了一个错误)并发布我的结果。 – OemerA 2011-02-02 22:06:43

+0

您的示例显示了在物理设备外部延伸的图像... – kcoppock 2011-02-02 22:58:22

+0

如果要使其适合宽度,则必须切割高度。要做你想做的事,你会使用fitXY缩放类型,但它会不成比例地缩放。没有其他办法可以做到这一点。 – kcoppock 2011-02-02 23:03:01

1

我再也看不到这些图像了,问题在老化,但以防万一别人发现这个问题并且有同样的问题。如果获得float screenWidth = getResources().getDisplayMetrics().widthPixels并以编程方式设置ImageView LayoutParamters以将图像缩放为screenWidth,会不会更好?只是一个主意!

1

管理为达到我想要的东西,这希望是一样的,你的目标

@Override 
public void onCreate(Bundle savedInstanceState) { 
    super.onCreate(savedInstanceState); 
    setContentView(R.layout.pgviewer); 

    ImageView PgContainer = (ImageView)findViewById(R.id.imageView1); 

    String Page = String.valueOf(getIntent().getExtras().getInt("Page")); 
    try { 
     PgContainer.setImageBitmap(getBitmapFromAsset(Page)); 
    } catch (IOException e) { 
     // TODO Auto-generated catch block 
     e.printStackTrace(); 
    } 

    PgContainer.setScaleType(ScaleType.FIT_CENTER); 
    PgContainer.scrollTo(0, 0); 
    PgContainer.setScrollBarStyle(0); 
} 

然后缩放位图:

private Bitmap getBitmapFromAsset(String strName) throws IOException 
{ 
    AssetManager assetManager = getAssets(); 
    InputStream istr = assetManager.open(strName+".png"); 
    Bitmap bitmap = BitmapFactory.decodeStream(istr); 

    float screenWidth = getResources().getDisplayMetrics().widthPixels; 
    int ih=bitmap.getHeight(); 
    int iw=bitmap.getWidth(); 
    float scalefactor = screenWidth/iw; 
    //w = 480, h=~ 
    //int newh = bitmap.getHeight()/bitmap.getWidth(); 
    return android.graphics.Bitmap.createScaledBitmap(bitmap, (int)(iw*scalefactor), (int)(ih*scalefactor), true); 
    //return bitmap; 
} 
3

我用Google搜索无处不在,但没有找到一个解决方案。 这就是我所做的,这对我和滚动视图的工作。

XML文件:

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

    <ImageView 
     android:id="@+id/manga_page_image" 
     android:layout_width="match_parent" 
     android:layout_height="0dp" 
     android:adjustViewBounds="true" 
     android:scaleType="fitCenter" /> 
</ScrollView> 
19

最简单的方法是添加机器人:adjustViewBounds = “true” 添加到的ImageView,并设置规模类型为 “fitCenter”

0

我用来缩放的ImageView与设备分辨率是针对父级设置的属性。所以随着父母大​​小的变化,元素的大小也会随之变大。 这里是我的activity_main.xml中的一个例子

<?xml version="1.0" encoding="utf-8"?> 
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:app="http://schemas.android.com/apk/res-auto" 
    xmlns:tools="http://schemas.android.com/tools" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    tools:context="com.example.csci567.singleimagerequest.MainActivity"> 

    <ImageView 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     android:id="@+id/image_display" 
     android:layout_marginBottom="100dp" 
     android:layout_marginLeft="15dp" 
     android:layout_marginRight="15dp" 
     android:layout_centerHorizontal="true" 
     /> 

    <Button 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:text="Upload Image" 
     android:id="@+id/upload_button" 
     android:layout_alignParentBottom="true" 
     android:layout_centerHorizontal="true" 
     android:layout_marginBottom="22dp" /> 

</RelativeLayout 

你可以把通过调节利润更多的元素。

相关问题