fix(content): 랭킹 카드 간격과 이미지를 보정한다

2026-06-25 18:30:55 +09:00
parent ab9d14598c
commit c030cbabd3
8 changed files with 238 additions and 29 deletions
--- a/app/src/main/java/kr/co/vividnext/sodalive/v2/main/content/ContentMainFragment.kt
+++ b/app/src/main/java/kr/co/vividnext/sodalive/v2/main/content/ContentMainFragment.kt
@@ -274,6 +274,7 @@ class ContentMainFragment : BaseFragment<FragmentV2MainContentBinding>(
        binding.rvContentRankings.apply {
            layoutManager = ContentRankingAdapter.createGridLayoutManager(requireContext())
            adapter = contentRankingAdapter
+            addItemDecoration(ContentRankingAdapter.createItemDecoration(requireContext()))
        }
        val contentAllGridLayoutManager = GridLayoutManager(requireContext(), CONTENT_ALL_GRID_SPAN_COUNT)
        binding.rvContentAllItems.apply {
--- a/app/src/main/java/kr/co/vividnext/sodalive/v2/widget/contentranking/ContentRankingAdapter.kt
+++ b/app/src/main/java/kr/co/vividnext/sodalive/v2/widget/contentranking/ContentRankingAdapter.kt
@@ -1,7 +1,9 @@
 package kr.co.vividnext.sodalive.v2.widget.contentranking

 import android.content.Context
+import android.graphics.Rect
 import android.view.LayoutInflater
+import android.view.View
 import android.view.ViewGroup
 import android.widget.ImageView
 import androidx.recyclerview.widget.GridLayoutManager
@@ -27,19 +29,35 @@ class ContentRankingAdapter(
        val inflater = LayoutInflater.from(parent.context)
        return when (viewType) {
            VIEW_TYPE_LARGE -> LargeViewHolder(
-                inflater.inflate(R.layout.view_content_ranking_large_card, parent, false) as ContentRankingLargeCardView,
+                inflater.inflate(
+                    R.layout.view_content_ranking_large_card,
+                    parent,
+                    false
+                ) as ContentRankingLargeCardView,
                parent
            )
            VIEW_TYPE_MEDIUM_GRID -> MediumGridViewHolder(
-                inflater.inflate(R.layout.view_content_ranking_medium_grid_card, parent, false) as ContentRankingMediumGridCardView,
+                inflater.inflate(
+                    R.layout.view_content_ranking_medium_grid_card,
+                    parent,
+                    false
+                ) as ContentRankingMediumGridCardView,
                parent
            )
            VIEW_TYPE_SMALL_GRID -> SmallGridViewHolder(
-                inflater.inflate(R.layout.view_content_ranking_small_grid_card, parent, false) as ContentRankingSmallGridCardView,
+                inflater.inflate(
+                    R.layout.view_content_ranking_small_grid_card,
+                    parent,
+                    false
+                ) as ContentRankingSmallGridCardView,
                parent
            )
            VIEW_TYPE_HORIZONTAL -> HorizontalViewHolder(
-                inflater.inflate(R.layout.view_content_ranking_horizontal_card, parent, false) as ContentRankingHorizontalCardView,
+                inflater.inflate(
+                    R.layout.view_content_ranking_horizontal_card,
+                    parent,
+                    false
+                ) as ContentRankingHorizontalCardView,
                parent
            )
            else -> error("Unknown viewType: $viewType")
@@ -71,8 +89,8 @@ class ContentRankingAdapter(
        fun bind(item: ContentRankingItem) {
            val size = calculateSize(item, parent)
            view.setCardSize(size)
-            view.imageView().loadContentImage(item)
-            view.backgroundImageView().loadContentImage(item)
+            view.backgroundImageView().loadContentImage(item, blurEnabled = true)
+            view.imageView().loadContentImage(item, blurEnabled = false)
            view.bind(item)
            view.setOnContentClick(onClickItem)
        }
@@ -121,9 +139,12 @@ class ContentRankingAdapter(
        view.setOnContentClick(onClickItem)
    }

-    private fun ImageView.loadContentImage(item: ContentRankingItem) {
+    private fun ImageView.loadContentImage(
+        item: ContentRankingItem,
+        blurEnabled: Boolean = item.isInaccessible
+    ) {
        loadUrl(item.imageUrl) {
-            val blurTransformations = ContentRankingBlur.transformations(context, item.isInaccessible)
+            val blurTransformations = ContentRankingBlur.transformations(context, blurEnabled)
            if (blurTransformations.isNotEmpty()) {
                transformations(blurTransformations)
            }
@@ -148,23 +169,47 @@ class ContentRankingAdapter(
    companion object {
        const val GRID_SPAN_COUNT = 6

-        fun createGridLayoutManager(context: Context): GridLayoutManager = GridLayoutManager(context, GRID_SPAN_COUNT).apply {
-            spanSizeLookup = createSpanSizeLookup()
-        }
+        fun createGridLayoutManager(context: Context): GridLayoutManager =
+            GridLayoutManager(context, GRID_SPAN_COUNT).apply {
+                spanSizeLookup = createSpanSizeLookup()
+            }

-        fun createSpanSizeLookup(): GridLayoutManager.SpanSizeLookup = object : GridLayoutManager.SpanSizeLookup() {
-            override fun getSpanSize(position: Int): Int = when (ContentRankingPlacement.fromRank(position + 1).itemsPerRow) {
-                1 -> GRID_SPAN_COUNT
-                2 -> GRID_SPAN_COUNT / 2
-                3 -> GRID_SPAN_COUNT / 3
-                else -> GRID_SPAN_COUNT
+        fun createItemDecoration(context: Context): RecyclerView.ItemDecoration {
+            val spacingPx = HORIZONTAL_GAP_DP.dpToPx(context)
+            return object : RecyclerView.ItemDecoration() {
+                override fun getItemOffsets(
+                    outRect: Rect,
+                    view: View,
+                    parent: RecyclerView,
+                    state: RecyclerView.State
+                ) {
+                    val position = parent.getChildAdapterPosition(view)
+                    val itemCount = parent.adapter?.itemCount ?: return
+                    if (position != RecyclerView.NO_POSITION && position < itemCount - 1) {
+                        outRect.bottom = spacingPx
+                    }
+                }
            }
        }

+        fun createSpanSizeLookup(): GridLayoutManager.SpanSizeLookup =
+            object : GridLayoutManager.SpanSizeLookup() {
+                override fun getSpanSize(position: Int): Int =
+                    when (ContentRankingPlacement.fromRank(position + 1).itemsPerRow) {
+                        1 -> GRID_SPAN_COUNT
+                        2 -> GRID_SPAN_COUNT / 2
+                        3 -> GRID_SPAN_COUNT / 3
+                        else -> GRID_SPAN_COUNT
+                    }
+            }
+
        private const val VIEW_TYPE_LARGE = 1
        private const val VIEW_TYPE_MEDIUM_GRID = 2
        private const val VIEW_TYPE_SMALL_GRID = 3
        private const val VIEW_TYPE_HORIZONTAL = 4
-        private const val HORIZONTAL_GAP_DP = 4
+        private fun Int.dpToPx(context: Context): Int =
+            (this * context.resources.displayMetrics.density).roundToInt()
+
+        private const val HORIZONTAL_GAP_DP = 8
    }
 }
--- a/app/src/main/java/kr/co/vividnext/sodalive/v2/widget/contentranking/ContentRankingLargeCardView.kt
+++ b/app/src/main/java/kr/co/vividnext/sodalive/v2/widget/contentranking/ContentRankingLargeCardView.kt
@@ -144,9 +144,10 @@ class ContentRankingLargeCardView @JvmOverloads constructor(

    private fun applyBlur(enabled: Boolean) {
        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.S) {
-            val effect = if (enabled) RenderEffect.createBlurEffect(16f, 16f, Shader.TileMode.CLAMP) else null
-            contentImageView().setRenderEffect(effect)
-            backgroundImageView().setRenderEffect(effect)
+            val contentEffect = if (enabled) RenderEffect.createBlurEffect(16f, 16f, Shader.TileMode.CLAMP) else null
+            val backgroundEffect = RenderEffect.createBlurEffect(16f, 16f, Shader.TileMode.CLAMP)
+            contentImageView().setRenderEffect(contentEffect)
+            backgroundImageView().setRenderEffect(backgroundEffect)
        }
    }