如何使 Android 布局中的图像与原始布局一样保持比例？

Question

我需要在 android 屏幕顶部放置一个图像（徽标），我需要它与整个屏幕一样宽，我需要它的高度与宽度成正比，与原始图像。到目前为止，我尝试过的所有操作都会导致图像比例不均或图像覆盖整个屏幕。我该如何解决这个问题？

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity"
    android:background="@color/blue">




    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        android:id="@+id/linearLayout"
        android:layout_centerVertical="true"
        >

        <EditText
            android:id="@+id/username"
            android:layout_width="fill_parent"
            android:layout_height="50dp"
            android:layout_marginLeft="@dimen/margin_main"
            android:layout_marginRight="@dimen/margin_main"
            android:hint="@string/username"
            android:textColorHint="#fff"
            android:gravity="center"
            android:background="@drawable/input_background"
            android:layout_marginBottom="@dimen/margin_main"
            android:textColor="#fff"
            />

        <EditText
            android:id="@+id/password"
            android:layout_width="fill_parent"
            android:layout_height="50dp"
            android:inputType="textPassword"
            android:layout_marginLeft="@dimen/margin_main"
            android:layout_marginRight="@dimen/margin_main"
            android:hint="@string/password"
            android:textColorHint="#fff"
            android:gravity="center"
            android:background="@drawable/input_background"
            android:layout_marginBottom="@dimen/margin_main"
            android:textColor="#fff"/>


        <Button
            android:id="@+id/login_button"
            android:layout_width="fill_parent"
            android:layout_height="50dp"
            android:text="@string/login"
            android:layout_marginLeft="@dimen/margin_main"
            android:layout_marginRight="@dimen/margin_main"
            android:background="@drawable/button_yellow_background"
            android:textStyle="bold"
            android:textSize="20sp"
            android:textColor="@color/blue"/>

    </LinearLayout>

    <ImageView
        android:id="@+id/logo"
        android:layout_width="315dp"
        android:layout_height="100dp"
        android:background="@drawable/logo"/>


</RelativeLayout>

有问题的图像是徽标。

Answer 1

你需要做的就是改变

<ImageView
        android:id="@+id/logo"
        android:layout_width="315dp"
        android:layout_height="100dp"
        android:background="@drawable/logo"/>

到

<ImageView
        android:id="@+id/logo"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:adjustViewBounds="true"
        android:src="@drawable/logo"/>

注意：如果您的图片小于屏幕宽度，这样做可能会导致图片拉伸。

Answer 2

尝试将 scaleType 设置为 fitXY：

<ImageView
    android:id="@+id/fullImg"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:src="@drawable/your_image_resource"
    android:scaleType="fitXY" />

Answer 3

如果你想在运行时这样做，你可以这样做：

// set the ratio (if it can change it's also possible get it from resource id)
double aspect_ratio = 16/9;
// getting a ref to your ImageView
ImageView yourImageView = (LinearLayout) findViewById(R.id.imageView);
// get DisplayMetrics to get screen sizes
DisplayMetrics met = new DisplayMetrics(); 
getWindowManager().getDefaultDisplay().getMetrics(met);
// if you have a "activity_horizontal_margin" in your style
int t = getResources().getDimensionPixelSize(R.dimen.activity_horizontal_margin);
int width = (int)((met.widthPixels-2*t)); 
// otherwise just
int width = (int)((met.widthPixels-2*t)); 
// go on calculate height
int height = width * aspect_ratio;
// ending with layour params setting
yourImageView.setLayoutParams(new LayoutParams(width, height);

如果你想在 xml 中做，你可以做类似的事情

<ImageView
    android:id="@+id/yourImageView"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:src="@drawable/logo"
    android:scaleType="centerInside" />

Answer 4

你应该在运行时这样做。

解决方案 1

Display display = getWindowManager().getDefaultDisplay();
ImageView imageView = (LinearLayout) findViewById(R.id.imageView);
int width = display.getWidth(); 
int height = (int) width * 0.75; // 0.75 if image aspect ration is 4:3, change accordingly 
imageView.setLayoutParams(new LayoutParams(LayoutParams.MATCH_PARENT, height);

这将使图像按照原始图像的纵横比填充屏幕宽度和高度。要使用此方法，您需要对纵横比进行硬编码。

解决方案2来自Scale Image to fill ImageView width and keep aspect ratio

创建自定义图像视图并执行此操作

@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
try {
    Drawable drawable = getDrawable();

    if (drawable == null) {
        setMeasuredDimension(0, 0);
    } else {
        float imageSideRatio = (float)drawable.getIntrinsicWidth() / (float)drawable.getIntrinsicHeight();
        float viewSideRatio = (float)MeasureSpec.getSize(widthMeasureSpec) / (float)MeasureSpec.getSize(heightMeasureSpec);
        if (imageSideRatio >= viewSideRatio) {
            int width = MeasureSpec.getSize(widthMeasureSpec);
            int height = (int)(width / imageSideRatio);
            setMeasuredDimension(width, height);
        } else {
            int height = MeasureSpec.getSize(heightMeasureSpec);
            int width = (int)(height * imageSideRatio);
            setMeasuredDimension(width, height);
        }
    }
} catch (Exception e) {
    e.printStackTrace();
    super.onMeasure(widthMeasureSpec, heightMeasureSpec);
}