RecyclerView의 ItemDecoration은 ConstraintLayout으로 빌드 된 아이템 레이아웃을 깨뜨린 것입니다.

Question

이 레이아웃을 빌드하려고합니다. 이미지 아래에 이미지와 텍스트가있는 두 개의 열 그리드 만 있습니다.

나는 항목 사이의 간격에 대한 RecyclerView, GridLayoutManager 및 ItemDecoration를 사용하여이를 구축하고자합니다. 결과적으로 얻은 결과는 오른쪽 이미지 아래의 텍스트가 맨 아래로 이동하는 것을 볼 수 있습니다.

MainActivity

public class MainActivity extends AppCompatActivity { 

    @Override 
    protected void onCreate(Bundle savedInstanceState) { 
     super.onCreate(savedInstanceState); 
     setContentView(R.layout.activity_main); 

     RecyclerView recyclerView = findViewById(R.id.recycler_view); 
     recyclerView.setHasFixedSize(true); 

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

     recyclerView.addItemDecoration(new SpacesItemDecoration()); 

     Adapter adapter = new Adapter(); 
     recyclerView.setAdapter(adapter); 
    } 
} 

SpacesItemDecoration

public class SpacesItemDecoration extends RecyclerView.ItemDecoration { 

    @Override 
    public void getItemOffsets(Rect outRect, View view, 
           RecyclerView parent, RecyclerView.State state) { 
     outRect.bottom = 20; 

     if (parent.getChildLayoutPosition(view) % 2 == 0) { 
      outRect.right = 20; 
     } else { 
      outRect.right = 0; 
     } 
    } 
} 

item.xml

012,351 6,

<android.support.constraint.ConstraintLayout 
    xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:app="http://schemas.android.com/apk/res-auto" 
    android:background="#DDDDDD" 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content"> 

    <ImageView 
     android:id="@+id/image_view" 
     android:layout_width="0dp" 
     android:layout_height="0dp" 
     android:scaleType="centerCrop" 
     app:layout_constraintDimensionRatio="h,4:5" 
     app:layout_constraintTop_toTopOf="parent" 
     app:layout_constraintLeft_toLeftOf="parent" 
     app:layout_constraintRight_toRightOf="parent" 
     app:layout_constraintBottom_toTopOf="@+id/text_view" 
     app:layout_constraintVertical_chainStyle="packed" /> 

    <TextView 
     android:id="@+id/text_view" 
     android:layout_width="0dp" 
     android:layout_height="wrap_content" 
     android:layout_marginTop="8dp" 
     android:layout_marginLeft="8dp" 
     android:layout_marginRight="8dp" 
     android:layout_marginBottom="8dp" 
     android:textStyle="bold" 
     android:gravity="center" 
     app:layout_constraintTop_toBottomOf="@+id/image_view" 
     app:layout_constraintLeft_toLeftOf="parent" 
     app:layout_constraintRight_toRightOf="parent" 
     app:layout_constraintBottom_toBottomOf="parent" /> 

</android.support.constraint.ConstraintLayout> 

당신은 왼쪽의 이미지보다 더 큰 당신이 게시 된 스크린 샷에서 GitHub

Answer 1

에서 또한 복제 프로젝트, 그것은 오른쪽의 이미지처럼 보인다 수 있으며, 그 오른쪽에있는 텍스트를 아래로 밀어 것입니다 . 이는 SpacesItemDecoration이 인세 트를 정의하는 방법으로 인해 발생할 수 있습니다. 뷰의 균형을 맞추기 위해 좌우 인 세트를 변경해보십시오.

SpacesItemDecoration

public class SpacesItemDecoration extends RecyclerView.ItemDecoration { 

    @Override 
    public void getItemOffsets(Rect outRect, View view, 
           RecyclerView parent, RecyclerView.State state) { 
     outRect.bottom = 20; 

     if (parent.getChildLayoutPosition(view) % 2 == 0) { 
      outRect.right = 10; // Pad on the right for left-hand side 
     } else { 
      outRect.left = 10; // Pad on the left for right-hand side 
     } 
    } 
}