不同设备间图片视图不会按比例缩放

3

我的活动结构如下:

一个使用适配器和CardView布局填充的回收视图。

CardView由一个包含图像和两个文本框的约束布局组成。

图像设置为从URL异步加载的可绘制对象。

以下是一些代码:

图像加载:

  try {
        InputStream is = (InputStream) new URL(url).getContent();
        Drawable d = Drawable.createFromStream(is, "src name");
        Bitmap bitmap = ((BitmapDrawable) d).getBitmap();
        Drawable temp = new BitmapDrawable(Bitmap.createScaledBitmap(bitmap, 300, 300, true));
        return temp;
      }
 catch (Exception e) {
        e.printStackTrace();
        return null;
      }

 This is called later in a different function where vh is the ViewHolder:
   vh.imageView.setImageDrawable(d);

CardView XML:

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout 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="wrap_content">

    <androidx.cardview.widget.CardView
        android:id="@+id/card_view"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:cardCornerRadius="4dp"
        app:cardElevation="4dp"
        app:cardUseCompatPadding="true"
        app:contentPadding="16dp" >

        <androidx.constraintlayout.widget.ConstraintLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content">

            <ImageView
                android:id="@+id/playlist_image"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                app:layout_constraintBottom_toBottomOf="parent"
                app:layout_constraintEnd_toStartOf="@+id/playlist_name"
                app:layout_constraintHorizontal_bias="0.0"
                app:layout_constraintStart_toStartOf="parent"
                app:layout_constraintTop_toTopOf="parent"
                app:layout_constraintVertical_bias="0.0"
                app:srcCompat="@mipmap/ic_launcher" />
etc...

RecyclerView XML:


<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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=".PlaylistChoose">

    <androidx.recyclerview.widget.RecyclerView
        android:id="@+id/playlist_view"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:layout_marginStart="1dp"
        android:layout_marginEnd="1dp"
        android:clickable="true"
        android:focusable="auto"
        android:foreground="?attr/selectableItemBackground"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        tools:listitem="@layout/custom_playlist_view" >

    </androidx.recyclerview.widget.RecyclerView>

</androidx.constraintlayout.widget.ConstraintLayout>

目前,当我在虚拟设备上运行此代码时,图像显示正常。但是当我在Galaxy S7 Edge上运行应用程序时,图像显示非常小。然后,我尝试将Drawable temp = new BitmapDrawable(Bitmap.createScaledBitmap(bitmap, 300, 300, true));中的高度和宽度从300增加到约1400,然后该应用程序在S7上运行良好,但虚拟设备现在显示出荒谬的大图像。我有点困惑,因为图像位于设置为包裹内容的约束布局内,对于两个手机来说,内容大小是相同的,所以我不明白实际大小为什么会有差异...提前感谢!任何帮助都将不胜感激 :)

一些图片:

AVD 1400 : https://gyazo.com/1c4ab4ffb9266e191357dd3e0dcd2f5c

S7 1400: https://gyazo.com/fd87f094bf7f23933543369b206b794a

AVD 300: https://gyazo.com/d5c23c9372bc0c1838866452a24af06f

S7 300: https://gyazo.com/a9084b77d3efdd87cea9e53344c7b169


1
硬编码图像像素大小不是一个好主意.. 只需使用以 dp 为单位的固定大小 ImageView,并使用一些库来高效地为您下载图像 也许是这个 - ADM
@ADM 我正在使用这个库并且它可以加载图片,但是我不太明白您所说的在dp中使用固定大小的意思,因此它会以非常大的尺寸加载图片。您能否进一步解释一下您的意思? - barbecu
5个回答

1

由于图像位于约束布局内,该布局设置为包裹内容且内容大小对于两个手机相同,我有点困惑。

虽然不同的手机可能具有相同的内容,但是因为不同的手机具有不同的屏幕尺寸,在ImageView上使用wrap_content时,它在所有设备上看起来都不一样。

如何修复:

使用ConstraintLayout时,您需要这样做:

将此用作您的ImageView:

  <ImageView
    android:id="@+id/imageView2"
    android:layout_width="0dp"
    android:layout_height="0dp"
    app:layout_constraintWidth_percent="0.25"
    app:layout_constraintHeight_percent="0.25"
    android:scaleType="fitXY"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintHorizontal_bias="0.5"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent"
    app:srcCompat="@drawable/your_image" />

现在,这个元素的宽度和高度将完全等于其父元素的25%。

如果你想改变图片的大小,只需修改:

   app:layout_constraintWidth_percent="0.25"
   app:layout_constraintHeight_percent="0.25"

对我没起作用,图片仍然显示得很小,我不认为这是 ImageView 的问题,因为在 xml 中将默认图像设置为图像视图的源(在获取 url 图像之前),并且默认图像在 avd 和 s7 上都能正常加载。 - barbecu

0
尝试在你的ImageView内添加scaleType和视图边界的调整。
<ImageView
   android:id="@+id/playlist_image"
   android:layout_width="wrap_content"
   android:layout_height="wrap_content"
   android:scaleType="fitCenter"
   android:adjustViewBounds="true"
   app:layout_constraintBottom_toBottomOf="parent"
   app:layout_constraintEnd_toStartOf="@+id/playlist_name"
   app:layout_constraintHorizontal_bias="0.0"
   app:layout_constraintStart_toStartOf="parent"
   app:layout_constraintTop_toTopOf="parent"
   app:layout_constraintVertical_bias="0.0"
   app:srcCompat="@mipmap/ic_launcher" />

0
解决了!这是由于@ADM建议使用Glide库以及@Tamir Abutbul的比例和约束百分比建议的组合,使得我的图像现在正确加载 :)
XML:
<ImageView
                android:scaleType="fitXY"
                app:layout_constraintHeight_percent="1"
                app:layout_constraintWidth_percent="0.25"

                android:id="@+id/playlist_image"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                app:layout_constraintBottom_toBottomOf="parent"
                app:layout_constraintEnd_toStartOf="@+id/playlist_name"
                app:layout_constraintHorizontal_bias="0.0"
                app:layout_constraintStart_toStartOf="parent"
                app:layout_constraintTop_toTopOf="parent"
                app:layout_constraintVertical_bias="0.0"
                app:srcCompat="@mipmap/ic_launcher" />

Glide 代码:

 Glide.with(context).load(url).into(vh.imageView);

0

你可以使用

  android:scaleType="fitXY"

android:layout_width="match_parent" android:layout_height="match_parent" 安卓:布局宽度="匹配父级" 安卓:布局高度="匹配父级" - Shimaa Yasser

0
     <ImageView
            android:id="@+id/playlist_image"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toStartOf="@+id/playlist_name"
            android:scaleType="fitXY"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent"

            app:srcCompat="@mipmap/ic_launcher" />

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接