51

我需要在屏幕顶部并排（无间隙）显示三个相同尺寸的图像（200 X 100）。它们应该占据屏幕的整个宽度并保持纵横比。是否可以仅使用布局 xml 文件来完成，或者我需要使用 java 代码？
解决方案应该独立于解决方案......任何人都可以为这个（或类似的）问题发布解决方案或链接吗？谢谢！

4

4 回答 4

145

得到它的工作！但正如我上面所说，您需要创建自己的类。但它很小。我在这篇博文中的 Bob Lee 的回答的帮助下创建了它：Android：如何在保持纵横比的同时将图像拉伸到屏幕宽度？

package com.yourpackage.widgets;

import android.content.Context;
import android.util.AttributeSet;
import android.widget.ImageView;

public class AspectRatioImageView extends ImageView {

    public AspectRatioImageView(Context context) {
        super(context);
    }

    public AspectRatioImageView(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    public AspectRatioImageView(Context context, AttributeSet attrs, int defStyle) {
        super(context, attrs, defStyle);
    }

    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        int width = MeasureSpec.getSize(widthMeasureSpec);
        int height = width * getDrawable().getIntrinsicHeight() / getDrawable().getIntrinsicWidth();
        setMeasuredDimension(width, height);
    }
}

现在在 XML 中使用它：

<com.yourpackage.widgets.AspectRatioImageView 
    android:id="@+id/image"
    android:src="@drawable/yourdrawable" 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content"
    android:layout_alignParentTop="true" 
    android:layout_centerHorizontal="true" 
    android:adjustViewBounds="true" />

玩得开心！

======================================

通过使用 android:adjustViewBounds="true" 找到了另一种仅在 XML 中执行相同操作的方法。这里有一个例子：

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content" >

    <ImageView
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:adjustViewBounds="true"
        android:src="@drawable/image1" />

    <ImageView
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:adjustViewBounds="true"
        android:src="@drawable/image2" />


    <ImageView
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:adjustViewBounds="true"
        android:src="@drawable/image2" />

</LinearLayout>
于 2011-01-14T05:52:02.897 回答
30

考虑到可能出现的问题，只需进行小幅升级：null Drawable 或 0 宽度。

package com.yourpackage.yourapp;

import android.content.Context;
import android.graphics.drawable.Drawable;
import android.util.AttributeSet;
import android.widget.ImageView;

public class AspectRatioImageView extends ImageView {

public AspectRatioImageView(Context context)
{
    super(context);
}

public AspectRatioImageView(Context context, AttributeSet attrs)
{
    super(context, attrs);
}

public AspectRatioImageView(Context context, AttributeSet attrs,
        int defStyle)
{
    super(context, attrs, defStyle);
}

@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec)
{
    Drawable drawable = getDrawable();
    if (drawable != null)
    {
        int width =  MeasureSpec.getSize(widthMeasureSpec);
        int diw = drawable.getIntrinsicWidth();
        if (diw > 0)
        {
            int height = width * drawable.getIntrinsicHeight() / diw;
            setMeasuredDimension(width, height);
        }
        else
            super.onMeasure(widthMeasureSpec, heightMeasureSpec);
    }
    else
        super.onMeasure(widthMeasureSpec, heightMeasureSpec);
}
}
于 2012-06-24T06:13:18.520 回答
6

Jake Wharton 改进了 AspectRatioImageView 类，您可以通过 xml 设置dominantMeasurement 和 aspectRatio。您可以在下面的链接中找到它。

https://gist.github.com/JakeWharton/2856179

于 2013-07-11T07:38:10.350 回答
1

我不知道 XML 布局和 android API，但数学很简单；找到屏幕的宽度并除以三。这是每个图像的宽度。现在将宽度乘以原始图像的高宽比。这是每个图像的高度。

int imageWidth = screenWidth / 3;
float ratio = originalImage.Height / (float)originalImage.Width;
int imageHeight = (int)(imageWidth * ratio);
于 2011-01-13T06:07:35.093 回答