RecyclerView에 GridLayoutManager를 적용하여 그리드를 만든 후 이미지 크기가 일정하게 보이지 않는 문제를 해결했습니다.
1. RelativeLayout를 상속한 SquareLayout 클래스를 추가합니다.
package com.tistory.webnautes.imagesaveinsqlite;
import android.annotation.TargetApi;
import android.content.Context;
import android.os.Build;
import android.util.AttributeSet;
import android.widget.RelativeLayout;
/**
* Created by Lincoln on 05/04/16.
*/
class SquareLayout extends RelativeLayout {
public SquareLayout(Context context) {
super(context);
}
public SquareLayout(Context context, AttributeSet attrs) {
super(context, attrs);
}
public SquareLayout(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
}
@TargetApi(Build.VERSION_CODES.LOLLIPOP)
public SquareLayout(Context context, AttributeSet attrs, int defStyleAttr, int defStyleRes) {
super(context, attrs, defStyleAttr, defStyleRes);
}
@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
// Set a square layout.
super.onMeasure(widthMeasureSpec, widthMeasureSpec);
}
} |
2. 앞에서 정의한 SquareLayout 클래스를 사용하도록 레이아웃을 수정합니다. 앞부분에 패키지 이름을 적어줘야 합니다.
com.tistory.webnautes.imagesaveinsqlite.SquareLayout
적용하면 같은 크기의 정사각형 영역에 이미지가 보여집니다.
이미지 뷰에 이미지가 꽉차는게 좋지 않을까 싶어서 수정해봅니다.
ImageView에 다음 속성을 추가해주면 이미지 중앙에서 일정 범위로 이미지를 잘라서 보여줍니다.
android:scaleType="centerCrop"
3. 두가지를 모두 적용한 레이아웃 파일입니다. 그리드상의 이미지뷰 아래에 텍스트뷰를 하나씩 보여주기 위해 사용합니다.
<?xml version="1.0" encoding="utf-8"?>
<com.tistory.webnautes.imagesaveinsqlite.SquareLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:layout_weight="1"
android:layout_margin="1dp"
android:orientation="vertical" >
<ImageView
android:id="@+id/imageview_recyclerview_image"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="@+id/textview_recyclerview_title"
android:layout_centerHorizontal="true"
android:scaleType="centerCrop"
android:layout_margin="5dp"
android:adjustViewBounds="true"/>
<TextView
android:id="@+id/textview_recyclerview_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:layout_alignStart="@+id/imageview_recyclerview_image"
android:layout_alignParentBottom="true"
android:layout_alignEnd="@+id/imageview_recyclerview_image"
android:text="Text"
android:textSize="5sp" />
</com.tistory.webnautes.imagesaveinsqlite.SquareLayout> |
설명이 부족시 같이 보면 좋을 포스팅입니다.
Android RecyclerView 간단한 예제
https://webnautes.tistory.com/1214
Android RecyclerView를 사용하여 GridView 구현하기
https://webnautes.tistory.com/1298
이미지뷰에서 이미지 위아래에 공백이 생기는 문제 해결
https://webnautes.tistory.com/1297
