카페 상세 정보(이미지) 연동 (#177)

* Grid RecyclerView 를 통해 구현한 리스트가 화면에 출력되지 않는 문제 해결 * 카페 사진 corner radius 및 동일 상하 좌우 동일 간격 적용 * CafeImageFragment 와 CafeImageDetailFragment 연결 * CafeImageDetail 화면 줌인 기능 구현 PhotoView 라이브러리 의존성 추가, TODO 추가 * CafeImageDetail 이미지 cornerRadius 적용 * 카페 상세 화면과 정보 수정 제안 화면 연결 * 사진 신고하기 팝업 메뉴 추가 * 카페 이미지 상세화면 systembar 색상 변경 분기 처리 * 카메 이미지 상세화면 사진 인덱스 추가 * 카페 이미지 신고하기 다이얼로그 구성 및 네비게이션 연동 * 카페 이미지 상세화면 무한 스크롤 로직 수정 및 인덱스 표기 오류 해결 * 카메 이미지 상세화면 줌 관련 문제 해결 사진을 확대하였을 때 사진 자체가 커지지 않는 문제 해결, corner radius 미적용 * 카페 이미지 리스트 load crossfade 적용 이미지가 점진적으로 나타나 사용자에게 더 나은 경험을 제공 * style check success * companion object 로 정의한 key 값을 네이밍 변경
Wedemy · Dec 21, 2023 · e6d938b · e6d938b
1 parent 5b4d803
commit e6d938b
Show file tree

Hide file tree

Showing 34 changed files with 791 additions and 54 deletions.
diff --git a/build.gradle.kts b/build.gradle.kts
@@ -28,6 +28,7 @@ buildscript {
   repositories {
     google()
     mavenCentral()
+    maven("https://www.jitpack.io")
   }
 
   dependencies {
@@ -40,6 +41,7 @@ allprojects {
     google()
     mavenCentral()
     maven("https://naver.jfrog.io/artifactory/maven/")
+    maven("https://www.jitpack.io")
   }
 
   apply {

diff --git a/common/src/main/kotlin/us/wedemy/eggeum/android/common/extension/Float.kt b/common/src/main/kotlin/us/wedemy/eggeum/android/common/extension/Float.kt
@@ -0,0 +1,13 @@
+/*
+ * Designed and developed by Wedemy 2023.
+ *
+ * Licensed under the MIT.
+ * Please see full license: https://github.com/Wedemy/eggeum-android/blob/main/LICENSE
+ */
+
+package us.wedemy.eggeum.android.common.extension
+
+import android.content.res.Resources
+
+fun Float.fromDpToPx(): Int =
+  (this * Resources.getSystem().displayMetrics.density).toInt()
diff --git a/common/src/main/kotlin/us/wedemy/eggeum/android/common/extension/Int.kt b/common/src/main/kotlin/us/wedemy/eggeum/android/common/extension/Int.kt
@@ -0,0 +1,14 @@
+/*
+ * Designed and developed by Wedemy 2023.
+ *
+ * Licensed under the MIT.
+ * Please see full license: https://github.com/Wedemy/eggeum-android/blob/main/LICENSE
+ */
+
+package us.wedemy.eggeum.android.common.extension
+
+import android.content.res.Resources
+import kotlin.math.roundToInt
+
+val Int.dp: Int
+  get() = (this * Resources.getSystem().displayMetrics.density).roundToInt()
diff --git a/common/src/main/kotlin/us/wedemy/eggeum/android/common/ui/BaseDialogFragment.kt b/common/src/main/kotlin/us/wedemy/eggeum/android/common/ui/BaseDialogFragment.kt
@@ -0,0 +1,78 @@
+/*
+ * Designed and developed by Wedemy 2023.
+ *
+ * Licensed under the MIT.
+ * Please see full license: https://github.com/Wedemy/eggeum-android/blob/main/LICENSE
+ */
+
+package us.wedemy.eggeum.android.common.ui
+
+import android.content.Context
+import android.graphics.Color
+import android.graphics.Point
+import android.graphics.drawable.ColorDrawable
+import android.os.Build
+import android.os.Bundle
+import android.view.Gravity
+import android.view.LayoutInflater
+import android.view.View
+import android.view.ViewGroup
+import android.view.WindowManager
+import androidx.fragment.app.DialogFragment
+import androidx.viewbinding.ViewBinding
+import us.wedemy.eggeum.android.common.extension.dp
+
+abstract class BaseDialogFragment<VB : ViewBinding> : DialogFragment() {
+  private var _binding: VB? = null
+  protected val binding
+    get() = _binding!!
+
+  abstract fun getViewBinding(): VB
+
+  override fun onCreateView(
+    inflater: LayoutInflater,
+    container: ViewGroup?,
+    savedInstanceState: Bundle?,
+  ): View = getViewBinding().also { _binding = it }.root
+
+  override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
+    super.onViewCreated(view, savedInstanceState)
+    setSizeDialog()
+  }
+
+  override fun getTheme(): Int = us.wedemy.eggeum.android.design.R.style.EggeumDialog
+
+  @Suppress("NestedBlockDepth")
+  private fun setSizeDialog() {
+    context?.let {
+      dialog?.let { dialog ->
+        dialog.window?.let { window ->
+          val windowManager: WindowManager =
+            activity?.getSystemService(Context.WINDOW_SERVICE) as WindowManager
+          val size = Point()
+
+          if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.R) {
+            val displayMetrics = windowManager.currentWindowMetrics
+            size.x = displayMetrics.bounds.width()
+            size.y = displayMetrics.bounds.height()
+          } else {
+            @Suppress("DEPRECATION")
+            val display = windowManager.defaultDisplay
+            display.getRealSize(size)
+          }
+
+          val params: ViewGroup.LayoutParams = window.attributes
+          params.width = size.x - 64.dp
+          params.height = ViewGroup.LayoutParams.WRAP_CONTENT
+          window.setGravity(Gravity.CENTER)
+          window.setBackgroundDrawable(ColorDrawable(Color.TRANSPARENT))
+        }
+      }
+    }
+  }
+
+  override fun onDestroyView() {
+    _binding = null
+    super.onDestroyView()
+  }
+}
diff --git a/common/src/main/kotlin/us/wedemy/eggeum/android/common/util/GridSpacingItemDecoration.kt b/common/src/main/kotlin/us/wedemy/eggeum/android/common/util/GridSpacingItemDecoration.kt
@@ -0,0 +1,46 @@
+/*
+ * Designed and developed by Wedemy 2023.
+ *
+ * Licensed under the MIT.
+ * Please see full license: https://github.com/Wedemy/eggeum-android/blob/main/LICENSE
+ */
+
+package us.wedemy.eggeum.android.common.util
+
+import android.graphics.Rect
+import android.view.View
+import androidx.recyclerview.widget.RecyclerView
+
+class GridSpacingItemDecoration(
+  private val spanCount: Int, // Grid의 column 수
+  private val spacing: Int, // 간격
+) : RecyclerView.ItemDecoration() {
+
+  override fun getItemOffsets(
+    outRect: Rect,
+    view: View,
+    parent: RecyclerView,
+    state: RecyclerView.State,
+  ) {
+    val position: Int = parent.getChildAdapterPosition(view)
+
+    if (position >= 0) {
+      val column = position % spanCount // item column
+      outRect.apply {
+        // spacing - column * ((1f / spanCount) * spacing)
+        left = spacing - column * spacing / spanCount
+        // (column + 1) * ((1f / spanCount) * spacing)
+        right = (column + 1) * spacing / spanCount
+        if (position < spanCount) top = spacing
+        bottom = spacing
+      }
+    } else {
+      outRect.apply {
+        left = 0
+        right = 0
+        top = 0
+        bottom = 0
+      }
+    }
+  }
+}
diff --git a/design-resource/src/main/res/drawable/bg_eggeum_dialog.xml b/design-resource/src/main/res/drawable/bg_eggeum_dialog.xml
@@ -0,0 +1,12 @@
+<?xml version="1.0" encoding="utf-8"?><!--
+  ~ Designed and developed by Wedemy 2023.
+  ~
+  ~ Licensed under the MIT.
+  ~ Please see full license: https://github.com/Wedemy/eggeum-android/blob/main/LICENSE
+  -->
+
+<shape xmlns:android="http://schemas.android.com/apk/res/android"
+  android:shape="rectangle">
+  <solid android:color="@color/white" />
+  <corners android:radius="16dp" />
+</shape>
diff --git a/design-resource/src/main/res/drawable/ic_circle_checkbox_filled_24.xml b/design-resource/src/main/res/drawable/ic_circle_checkbox_filled_24.xml
@@ -0,0 +1,18 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="24dp"
+    android:height="24dp"
+    android:viewportWidth="24"
+    android:viewportHeight="24">
+  <group>
+    <clip-path
+        android:pathData="M0,0h24v24h-24z"/>
+    <path
+        android:pathData="M12,12m-11,0a11,11 0,1 1,22 0a11,11 0,1 1,-22 0"
+        android:strokeWidth="2"
+        android:fillColor="#00000000"
+        android:strokeColor="#14B8A6"/>
+    <path
+        android:pathData="M12,12m-7,0a7,7 0,1 1,14 0a7,7 0,1 1,-14 0"
+        android:fillColor="#14B8A6"/>
+  </group>
+</vector>
diff --git a/design-resource/src/main/res/drawable/ic_circle_checkbox_outlined_24.xml b/design-resource/src/main/res/drawable/ic_circle_checkbox_outlined_24.xml
@@ -0,0 +1,15 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="24dp"
+    android:height="24dp"
+    android:viewportWidth="24"
+    android:viewportHeight="24">
+  <group>
+    <clip-path
+        android:pathData="M0,0h24v24h-24z"/>
+    <path
+        android:pathData="M12,12m-11,0a11,11 0,1 1,22 0a11,11 0,1 1,-22 0"
+        android:strokeWidth="2"
+        android:fillColor="#00000000"
+        android:strokeColor="#CDD0D6"/>
+  </group>
+</vector>
diff --git a/design-resource/src/main/res/drawable/ic_menu_white_24.xml b/design-resource/src/main/res/drawable/ic_menu_white_24.xml
@@ -0,0 +1,15 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="24dp"
+    android:height="24dp"
+    android:viewportWidth="24"
+    android:viewportHeight="24">
+  <path
+      android:pathData="M12,4m-0,-2a2,2 0,1 1,-0 4a2,2 0,1 1,-0 -4"
+      android:fillColor="#ffffff"/>
+  <path
+      android:pathData="M12,12m-0,-2a2,2 0,1 1,-0 4a2,2 0,1 1,-0 -4"
+      android:fillColor="#ffffff"/>
+  <path
+      android:pathData="M12,20m-0,-2a2,2 0,1 1,-0 4a2,2 0,1 1,-0 -4"
+      android:fillColor="#ffffff"/>
+</vector>
diff --git a/design-resource/src/main/res/drawable/selector_circle_checkbox_24.xml b/design-resource/src/main/res/drawable/selector_circle_checkbox_24.xml
@@ -0,0 +1,11 @@
+<?xml version="1.0" encoding="utf-8"?><!--
+  ~ Designed and developed by Wedemy 2023.
+  ~
+  ~ Licensed under the MIT.
+  ~ Please see full license: https://github.com/Wedemy/eggeum-android/blob/main/LICENSE
+  -->
+
+<selector xmlns:android="http://schemas.android.com/apk/res/android">
+  <item android:drawable="@drawable/ic_circle_checkbox_filled_24" android:state_checked="true" />
+  <item android:drawable="@drawable/ic_circle_checkbox_outlined_24" android:state_checked="false" />
+</selector>
diff --git a/design-resource/src/main/res/values/colors.xml b/design-resource/src/main/res/values/colors.xml
@@ -26,4 +26,6 @@
 
   <color name="error_500">#ef4444</color>
 
+  <color name="muted_900">#171717</color>
+
 </resources>
diff --git a/design-resource/src/main/res/values/fonts.xml b/design-resource/src/main/res/values/fonts.xml
@@ -44,12 +44,19 @@
   </style>
 
   <style name="H5">
-    <item name="android:fontFamily">@font/pretendard_semibold</item>
+    <item name="android:fontFamily">@font/pretendard_bold</item>
     <item name="android:textStyle">normal</item>
     <item name="android:textSize">24sp</item>
     <item name="android:lineSpacingExtra">12sp</item>
   </style>
 
+  <style name="H6">
+    <item name="android:fontFamily">@font/pretendard_bold</item>
+    <item name="android:textStyle">normal</item>
+    <item name="android:textSize">20sp</item>
+    <item name="android:lineSpacingExtra">10sp</item>
+  </style>
+
   <style name="Title">
     <item name="android:gravity">center_horizontal</item>
     <item name="android:fontFamily">@font/pretendard_semibold</item>

diff --git a/design-resource/src/main/res/values/styles.xml b/design-resource/src/main/res/values/styles.xml
@@ -95,6 +95,10 @@
     <item name="android:textSize">0sp</item>
   </style>
 
+  <style name="EggeumDialog" parent="@style/Theme.MaterialComponents.Dialog">
+    <item name="android:background">@drawable/bg_eggeum_dialog</item>
+  </style>
+
   <style name="EggeumBottomSheetDialog" parent="@style/ThemeOverlay.MaterialComponents.BottomSheetDialog">
     <item name="bottomSheetStyle">@style/EggeumBottomSheet</item>
   </style>

diff --git a/gradle/libs.versions.toml b/gradle/libs.versions.toml
@@ -49,6 +49,7 @@ insetter = "0.6.1"
 timber = "5.0.1"
 naver-map = "3.17.0"
 ksp = "1.9.21-1.0.16"
+photo-view = "2.0.0"
 
 javax-inject = "1"
 
@@ -138,6 +139,7 @@ lottie = { module = "com.airbnb.android:lottie", version.ref = "lottie" }
 insetter = { module = "dev.chrisbanes.insetter:insetter", version.ref = "insetter" }
 timber = { module = "com.jakewharton.timber:timber", version.ref = "timber" }
 naver-map = { module = "com.naver.maps:map-sdk", version.ref = "naver-map" }
+photo-view = { module = "com.github.chrisbanes:PhotoView", version.ref = "photo-view"}
 
 javax-inject = { module = "javax.inject:javax.inject", version.ref = "javax-inject" }
 

diff --git a/main/build.gradle.kts b/main/build.gradle.kts
@@ -42,6 +42,7 @@ dependencies {
     libs.coil,
     libs.timber,
     libs.naver.map,
+    libs.photo.view,
     projects.common,
     projects.designResource,
     projects.domain,