具有网格布局延伸的回收站视图中的图像

Images in recycler view with grid layout stretches

我已经开始编写图片库应用程序。我希望我的图像以方形显示,周围没有白色 space。我尝试了不同的方式,但图像在各个方面都被拉伸或在它们周围变白 space。图片加载毕加索。

MainActivity.java

...
recyclerView.setLayoutManager(new GridLayoutManager(this, 2));
...

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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=".MainActivity">

    <androidx.recyclerview.widget.RecyclerView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:id="@+id/recyclerView">
    </androidx.recyclerview.widget.RecyclerView>


</LinearLayout>

images_item.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="#ffffff">
    <ImageView
        android:layout_width="match_parent"
        android:layout_height="200dp"
        android:id="@+id/imageView"
        android:layout_centerInParent="true"
        android:scaleType="centerCrop"
        android:src="@drawable/avatar" />
    <ProgressBar
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:id="@+id/progressBar"/>
</RelativeLayout>

Adapter.java

...
        Picasso.get()
                .load(imageGalleryDataModel.getImageUrl())
                .fit()
                .centerCrop()
                .into(holder.imageView, new Callback() {
                    @Override
                    public void onSuccess() {
                        holder.progressBar.setVisibility(View.GONE);
                    }

                    @Override
                    public void onError(Exception e) {

                    }
                });

    }
...

您只需更新 image_item.xml 布局并使用 ConstraintLayout 而不是 RelativeLayout

如果您的项目中没有 ConstraintLayout 依赖项,只需在 app/build.gradle 的依赖项中添加以下行:

implementation 'com.android.support.constraint:constraint-layout:1.1.2'

下一步是将 image_item.xml 布局更改为以下结构:

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <ImageView
        android:id="@+id/imageView"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:scaleType="centerCrop"
        app:layout_constraintDimensionRatio="1:1"
        android:src="@drawable/avatar"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <ProgressBar
        android:id="@+id/progressBar"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:layout_constraintBottom_toBottomOf="@+id/imageView"
        app:layout_constraintEnd_toEndOf="@+id/imageView"
        app:layout_constraintStart_toStartOf="@+id/imageView"
        app:layout_constraintTop_toTopOf="@+id/imageView" />

</android.support.constraint.ConstraintLayout>

希望对您有所帮助。