Feature/#777 행사 목록 화면에서 맨 위로 이동하는 기능 (#834)

* feat: 컨퍼런스 화면에서 맨 위로 스크롤하는 기능 구현 * feat: 스크랩 화면에서 맨 위로 스크롤하는 기능 구현 * feat: 대회 화면에서 맨 위로 스크롤하는 기능 구현 * refactor: ScrollTopListener의 클릭리스너를 내부에서 설정하도록 변경 * refactor(ScrollTopListener): getScrollUpStandardPosition() 메서드를 expression 형식으로 변경 * refactor(ScrollTopListener): 메서드 배치 순서 변경
woowacourse-teams · Nov 8, 2023 · d3060d7 · d3060d7
1 parent 7e9f85d
commit d3060d7
Show file tree

Hide file tree

Showing 8 changed files with 123 additions and 3 deletions.
diff --git a/android/2023-emmsale/app/src/main/java/com/emmsale/presentation/common/ScrollTopListener.kt b/android/2023-emmsale/app/src/main/java/com/emmsale/presentation/common/ScrollTopListener.kt
@@ -0,0 +1,53 @@
+package com.emmsale.presentation.common
+
+import android.view.View
+import androidx.core.view.isVisible
+import androidx.recyclerview.widget.GridLayoutManager
+import androidx.recyclerview.widget.RecyclerView
+import com.emmsale.R
+
+class ScrollTopListener(
+    private val targetView: View,
+) : RecyclerView.OnScrollListener() {
+    private val isLandScape = getIsLandscape()
+    private val scrollUpStandardPosition = getScrollUpStandardPosition(isLandScape)
+
+    private fun getIsLandscape(): Boolean {
+        return targetView.context.resources.getBoolean(R.bool.is_landscape)
+    }
+
+    private fun getScrollUpStandardPosition(isLandScape: Boolean): Int = if (isLandScape) {
+        LANDSCAPE_SCROLL_UP_STANDARD_POSITION
+    } else {
+        PORTRAIT_SCROLL_UP_STANDARD_POSITION
+    }
+
+    override fun onScrollStateChanged(recyclerView: RecyclerView, newState: Int) {
+        super.onScrollStateChanged(recyclerView, newState)
+        val layoutManager = recyclerView.layoutManager as GridLayoutManager
+        val lastVisibleItemPosition = layoutManager.findLastVisibleItemPosition()
+
+        setupTargetView(recyclerView, lastVisibleItemPosition)
+    }
+
+    private fun setupTargetView(recyclerView: RecyclerView, lastVisibleItemPosition: Int) {
+        setupTargetViewClickListener(recyclerView)
+        targetView.isVisible = isVisibleTargetView(lastVisibleItemPosition)
+    }
+
+    private fun setupTargetViewClickListener(recyclerView: RecyclerView) {
+        if (targetView.hasOnClickListeners()) return
+
+        targetView.setOnClickListener {
+            recyclerView.smoothScrollToPosition(0)
+        }
+    }
+
+    private fun isVisibleTargetView(lastVisibleItemPosition: Int) =
+        lastVisibleItemPosition >= scrollUpStandardPosition
+
+    companion object {
+        private const val PORTRAIT_SCROLL_UP_STANDARD_POSITION = 3
+        private const val LANDSCAPE_SCROLL_UP_STANDARD_POSITION = 6
+    }
+}
diff --git a/...sale/app/src/main/java/com/emmsale/presentation/ui/competitionList/CompetitionFragment.kt b/...sale/app/src/main/java/com/emmsale/presentation/ui/competitionList/CompetitionFragment.kt
@@ -9,6 +9,7 @@ import com.emmsale.R
 import com.emmsale.data.model.Event
 import com.emmsale.databinding.FragmentCompetitionBinding
 import com.emmsale.presentation.base.BaseFragment
+import com.emmsale.presentation.common.ScrollTopListener
 import com.emmsale.presentation.common.extension.getSerializableExtraCompat
 import com.emmsale.presentation.common.views.FilterTag
 import com.emmsale.presentation.common.views.filterChipOf
@@ -69,6 +70,9 @@ class CompetitionFragment : BaseFragment<FragmentCompetitionBinding>() {
 
     private fun initEventRecyclerView() {
         binding.rvEvents.adapter = eventAdapter
+        binding.rvEvents.addOnScrollListener(
+            ScrollTopListener(targetView = binding.fabScrollTop),
+        )
     }
 
     private fun setupEventsObserver() {

diff --git a/...mmsale/app/src/main/java/com/emmsale/presentation/ui/conferenceList/ConferenceFragment.kt b/...mmsale/app/src/main/java/com/emmsale/presentation/ui/conferenceList/ConferenceFragment.kt
@@ -9,6 +9,7 @@ import com.emmsale.R
 import com.emmsale.data.model.Event
 import com.emmsale.databinding.FragmentConferenceBinding
 import com.emmsale.presentation.base.BaseFragment
+import com.emmsale.presentation.common.ScrollTopListener
 import com.emmsale.presentation.common.extension.getSerializableExtraCompat
 import com.emmsale.presentation.common.views.FilterTag
 import com.emmsale.presentation.common.views.filterChipOf
@@ -67,6 +68,9 @@ class ConferenceFragment : BaseFragment<FragmentConferenceBinding>() {
 
     private fun initEventRecyclerView() {
         binding.rvEvents.adapter = eventAdapter
+        binding.rvEvents.addOnScrollListener(
+            ScrollTopListener(targetView = binding.fabScrollTop),
+        )
     }
 
     private fun setupEventsObserver() {

diff --git a/.../app/src/main/java/com/emmsale/presentation/ui/scrappedEventList/ScrappedEventFragment.kt b/.../app/src/main/java/com/emmsale/presentation/ui/scrappedEventList/ScrappedEventFragment.kt
@@ -6,6 +6,7 @@ import androidx.fragment.app.viewModels
 import com.emmsale.R
 import com.emmsale.databinding.FragmentScrappedEventBinding
 import com.emmsale.presentation.base.BaseFragment
+import com.emmsale.presentation.common.ScrollTopListener
 import com.emmsale.presentation.ui.eventDetail.EventDetailActivity
 import com.emmsale.presentation.ui.scrappedEventList.recyclerView.ScrappedEventAdapter
 import com.emmsale.presentation.ui.scrappedEventList.uiState.ScrappedEventUiState
@@ -34,6 +35,9 @@ class ScrappedEventFragment : BaseFragment<FragmentScrappedEventBinding>() {
     private fun initBinding() {
         binding.vm = viewModel
         binding.rvScrappedEvents.adapter = scrappedEventsAdapter
+        binding.rvScrappedEvents.addOnScrollListener(
+            ScrollTopListener(targetView = binding.fabScrollTop),
+        )
     }
 
     private fun setUpScrappedEvents() {

diff --git a/android/2023-emmsale/app/src/main/res/drawable/ic_all_arrow_up.xml b/android/2023-emmsale/app/src/main/res/drawable/ic_all_arrow_up.xml
@@ -0,0 +1,9 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="24dp"
+    android:height="14dp"
+    android:viewportWidth="24"
+    android:viewportHeight="14">
+    <path
+        android:fillColor="#000000"
+        android:pathData="M22,14C21.471,13.998 20.963,13.786 20.59,13.41L12,4.83L3.41,13.41C3.027,13.738 2.535,13.909 2.032,13.889C1.529,13.87 1.051,13.661 0.695,13.305C0.339,12.949 0.13,12.472 0.111,11.968C0.091,11.465 0.262,10.973 0.59,10.59L10.59,0.59C10.965,0.218 11.472,0.008 12,0.008C12.528,0.008 13.035,0.218 13.41,0.59L23.41,10.59C23.688,10.87 23.877,11.225 23.954,11.612C24.03,11.999 23.991,12.4 23.84,12.764C23.689,13.129 23.434,13.44 23.107,13.66C22.779,13.88 22.394,13.998 22,14Z" />
+</vector>
diff --git a/android/2023-emmsale/app/src/main/res/layout/fragment_competition.xml b/android/2023-emmsale/app/src/main/res/layout/fragment_competition.xml
@@ -21,8 +21,7 @@
 
         <androidx.constraintlayout.widget.ConstraintLayout
             android:layout_width="match_parent"
-            android:layout_height="match_parent"
-            tools:context=".presentation.ui.competitionFilter.CompetitionFilterActivity">
+            android:layout_height="match_parent">
 
             <TextView
                 android:id="@+id/tv_events_prefix"
@@ -106,7 +105,6 @@
 
             </HorizontalScrollView>
 
-
             <androidx.recyclerview.widget.RecyclerView
                 android:id="@+id/rv_events"
                 android:layout_width="0dp"
@@ -121,6 +119,22 @@
                 tools:itemCount="5"
                 tools:listitem="@layout/item_competition" />
 
+            <com.google.android.material.floatingactionbutton.FloatingActionButton
+                android:id="@+id/fab_scroll_top"
+                android:layout_width="wrap_content"
+                android:layout_height="wrap_content"
+                android:layout_margin="12dp"
+                android:src="@drawable/ic_all_arrow_up"
+                android:visibility="gone"
+                app:backgroundTint="@color/primary_color"
+                app:borderWidth="3dp"
+                app:fabCustomSize="48dp"
+                app:layout_constraintBottom_toBottomOf="parent"
+                app:layout_constraintEnd_toEndOf="parent"
+                app:maxImageSize="16dp"
+                app:tint="@color/white"
+                tools:visibility="visible" />
+
             <ProgressBar
                 android:id="@+id/progressbar_loading"
                 android:layout_width="wrap_content"

diff --git a/android/2023-emmsale/app/src/main/res/layout/fragment_conference.xml b/android/2023-emmsale/app/src/main/res/layout/fragment_conference.xml
@@ -120,6 +120,22 @@
                 tools:itemCount="5"
                 tools:listitem="@layout/item_conference" />
 
+            <com.google.android.material.floatingactionbutton.FloatingActionButton
+                android:id="@+id/fab_scroll_top"
+                android:layout_width="wrap_content"
+                android:layout_height="wrap_content"
+                android:layout_margin="12dp"
+                android:src="@drawable/ic_all_arrow_up"
+                android:visibility="gone"
+                app:backgroundTint="@color/primary_color"
+                app:borderWidth="3dp"
+                app:fabCustomSize="48dp"
+                app:layout_constraintBottom_toBottomOf="parent"
+                app:layout_constraintEnd_toEndOf="parent"
+                app:maxImageSize="16dp"
+                app:tint="@color/white"
+                tools:visibility="visible" />
+
             <ProgressBar
                 android:id="@+id/progressbar_loading"
                 android:layout_width="wrap_content"

diff --git a/android/2023-emmsale/app/src/main/res/layout/fragment_scrapped_event.xml b/android/2023-emmsale/app/src/main/res/layout/fragment_scrapped_event.xml
@@ -71,6 +71,22 @@
             bind:viewModel="@{vm}"
             tools:visibility="gone" />
 
+        <com.google.android.material.floatingactionbutton.FloatingActionButton
+            android:id="@+id/fab_scroll_top"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:layout_margin="12dp"
+            android:src="@drawable/ic_all_arrow_up"
+            android:visibility="gone"
+            app:backgroundTint="@color/primary_color"
+            app:borderWidth="3dp"
+            app:fabCustomSize="48dp"
+            app:layout_constraintBottom_toBottomOf="parent"
+            app:layout_constraintEnd_toEndOf="parent"
+            app:maxImageSize="16dp"
+            app:tint="@color/white"
+            tools:visibility="visible" />
+
         <com.emmsale.presentation.common.views.NoContentView
             android:layout_width="0dp"
             android:layout_height="0dp"