#6 fix/홈 화면 : 홈 화면의 변경된 디자인 변경

- 배너 클릭 로직 추가
hometerview · Aug 18, 2022 · 0b76767 · 0b76767
1 parent e86caf3
commit 0b76767
Show file tree

Hide file tree

Showing 8 changed files with 118 additions and 31 deletions.
diff --git a/app/src/main/java/com/ftw/hometerview/ui/main/home/HomeFragment.kt b/app/src/main/java/com/ftw/hometerview/ui/main/home/HomeFragment.kt
@@ -1,11 +1,15 @@
 package com.ftw.hometerview.ui.main.home
 
 import android.animation.ValueAnimator
+import android.app.Activity
+import android.content.Intent
 import android.os.Bundle
 import android.view.LayoutInflater
 import android.view.View
 import android.view.ViewGroup
 import android.view.animation.AlphaAnimation
+import androidx.activity.result.ActivityResultLauncher
+import androidx.activity.result.contract.ActivityResultContracts
 import androidx.core.animation.doOnEnd
 import androidx.core.content.ContextCompat
 import androidx.core.view.isVisible
@@ -18,11 +22,13 @@ import androidx.lifecycle.repeatOnLifecycle
 import com.ftw.hometerview.R
 import com.ftw.hometerview.databinding.FragmentHomeBinding
 import com.ftw.hometerview.ui.main.HomeTabItemView
+import com.ftw.hometerview.ui.model.ParcelableReview
+import com.ftw.hometerview.ui.review.CreateReviewActivity
 import com.google.android.material.tabs.TabLayoutMediator
 import dagger.hilt.android.AndroidEntryPoint
-import kotlinx.coroutines.launch
 import javax.inject.Inject
 import kotlin.math.abs
+import kotlinx.coroutines.launch
 
 @AndroidEntryPoint
 class HomeFragment : Fragment() {
@@ -41,6 +47,14 @@ class HomeFragment : Fragment() {
     private lateinit var adapter: HomeViewPagerAdapter
     private var toolbarLayoutState: ToolbarLayoutState = ToolbarLayoutState.EXPANDING
 
+    private val createReviewLauncher: ActivityResultLauncher<Intent> =
+        registerForActivityResult(ActivityResultContracts.StartActivityForResult()) { result ->
+            if (result.resultCode != Activity.RESULT_OK) return@registerForActivityResult
+            val review = result.data?.getParcelableExtra<ParcelableReview>(CreateReviewActivity.CREATE_REVIEW_RESULT_KEY)
+            if (review == null) return@registerForActivityResult
+            viewModel.showBanner.value = false
+        }
+
     override fun onCreateView(
         inflater: LayoutInflater,
         container: ViewGroup?,
@@ -60,15 +74,31 @@ class HomeFragment : Fragment() {
     override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
         setOnOffsetChangedListener()
         startInducementBanner()
-        observe()
+        observeState()
+        observeReviews()
+        observeShowBanner()
     }
 
     override fun onDestroyView() {
         super.onDestroyView()
         _binding = null
     }
 
-    private fun observe() {
+    private fun observeState() {
+        lifecycleScope.launch {
+            repeatOnLifecycle(Lifecycle.State.STARTED) {
+                viewModel.state.collect { state ->
+                    when (state) {
+                        is HomeViewModel.State.Error -> { }
+                        HomeViewModel.State.None -> { }
+                        HomeViewModel.State.OnClickBanner -> showCreateReviewActivity()
+                    }
+                }
+            }
+        }
+    }
+
+    private fun observeReviews() {
         lifecycleScope.launch {
             repeatOnLifecycle(Lifecycle.State.CREATED) {
                 viewModel.reviews.collect { reviews ->
@@ -88,6 +118,20 @@ class HomeFragment : Fragment() {
         }
     }
 
+    private fun observeShowBanner() {
+        lifecycleScope.launch {
+            repeatOnLifecycle(Lifecycle.State.STARTED) {
+                viewModel.showBanner.collect { showBanner ->
+                    binding.inducementLayout.isVisible = showBanner
+                }
+            }
+        }
+    }
+
+    private fun showCreateReviewActivity() {
+        createReviewLauncher.launch(CreateReviewActivity.newIntent(requireContext()))
+    }
+
     private fun setOnOffsetChangedListener() {
         binding.appBarLayout.addOnOffsetChangedListener { _, verticalOffset ->
             val totalScrollRange = binding.appBarLayout.totalScrollRange
@@ -145,6 +189,7 @@ class HomeFragment : Fragment() {
                         duration = 1000
                     }
                 )
+                binding.inducementEmptyLayout.isVisible = false
             }
             duration = 2000
         }.start()

diff --git a/app/src/main/java/com/ftw/hometerview/ui/main/home/HomeViewModel.kt b/app/src/main/java/com/ftw/hometerview/ui/main/home/HomeViewModel.kt
@@ -22,6 +22,7 @@ class HomeViewModel(
     sealed class State {
         object None : State()
         class Error(val message: String) : State()
+        object OnClickBanner : State()
     }
 
     private val _user: MutableStateFlow<User> = MutableStateFlow(User.NONE)
@@ -33,6 +34,8 @@ class HomeViewModel(
     private val _state: MutableStateFlow<State> = MutableStateFlow(State.None)
     val state: StateFlow<State> = _state.asStateFlow()
 
+    val showBanner: MutableStateFlow<Boolean> = MutableStateFlow(false)
+
     init {
         CoroutineScope(dispatcher.ui()).launch {
             flow {
@@ -52,4 +55,9 @@ class HomeViewModel(
                 }
         }
     }
+
+    fun onClickBanner() {
+        _state.value = State.OnClickBanner
+        _state.value = State.None
+    }
 }
diff --git a/app/src/main/res/drawable-xxxhdpi/image_review_inducement.png b/app/src/main/res/drawable-xxxhdpi/image_review_inducement.png
diff --git a/app/src/main/res/drawable/bg_gray_800_radius_8.xml b/app/src/main/res/drawable/bg_gray_800_radius_8.xml
@@ -0,0 +1,7 @@
+<?xml version="1.0" encoding="utf-8"?>
+<shape xmlns:android="http://schemas.android.com/apk/res/android"
+    android:shape="rectangle"
+    >
+    <solid android:color="@color/gray_800" />
+    <corners android:radius="@dimen/dp_size_8" />
+</shape>
diff --git a/app/src/main/res/drawable/selector_building_review_tab_background.xml b/app/src/main/res/drawable/selector_building_review_tab_background.xml
@@ -1,5 +1,5 @@
 <?xml version="1.0" encoding="utf-8"?>
 <selector xmlns:android="http://schemas.android.com/apk/res/android">
-    <item android:drawable="@drawable/bg_blue_300_radius_8" android:state_selected="true" />
+    <item android:drawable="@drawable/bg_gray_800_radius_8" android:state_selected="true" />
     <item android:drawable="@drawable/bg_blue_gray_200_radius_8" android:state_selected="false" />
 </selector>
diff --git a/app/src/main/res/layout/fragment_home.xml b/app/src/main/res/layout/fragment_home.xml
@@ -6,6 +6,7 @@
 
     <data>
 
+        <import type="android.view.View" />
         <variable
             name="viewModel"
             type="com.ftw.hometerview.ui.main.home.HomeViewModel"
@@ -42,15 +43,16 @@
                         android:id="@+id/company_layout"
                         android:layout_width="match_parent"
                         android:layout_height="wrap_content"
+                        android:layout_marginTop="@dimen/dp_size_24"
+                        android:layout_marginHorizontal="@dimen/dp_size_6"
+                        android:padding="@dimen/dp_size_8"
                         app:layout_constraintTop_toTopOf="parent"
                         >
 
                         <TextView
                             android:id="@+id/company_text_view"
                             android:layout_width="wrap_content"
                             android:layout_height="wrap_content"
-                            android:layout_marginTop="@dimen/dp_size_32"
-                            android:layout_marginStart="@dimen/dp_size_14"
                             android:text="@{viewModel.user.company.name}"
                             android:textColor="@color/blue_300"
                             android:textSize="@dimen/sp_size_24"
@@ -72,7 +74,6 @@
                             android:layout_width="@dimen/dp_size_20"
                             android:layout_height="@dimen/dp_size_20"
                             android:layout_marginStart="@dimen/dp_size_8"
-                            android:layout_marginEnd="@dimen/dp_size_14"
                             app:srcCompat="@drawable/icon_triangle"
                             app:tint="@color/blue_300"
                             app:layout_constraintTop_toTopOf="@id/company_text_view"
@@ -86,7 +87,7 @@
                         android:id="@+id/company_guide_text_view"
                         android:layout_width="match_parent"
                         android:layout_height="wrap_content"
-                        android:layout_marginTop="@dimen/dp_size_12"
+                        android:layout_marginTop="@dimen/dp_size_4"
                         android:layout_marginHorizontal="@dimen/dp_size_14"
                         android:text="@string/home_title"
                         android:textColor="@color/gray_900"
@@ -102,60 +103,79 @@
                         android:layout_height="wrap_content"
                         android:layout_marginTop="@dimen/dp_size_18"
                         android:layout_marginHorizontal="@dimen/dp_size_14"
+                        android:layout_marginBottom="@dimen/dp_size_48"
                         android:text="@{@string/home_description(viewModel.user.company.location)}"
                         android:fontFamily="@font/pretendard_regular"
                         android:textColor="@color/gray_700"
                         android:textSize="@dimen/sp_size_14"
                         android:includeFontPadding="false"
+                        app:layout_constraintVertical_bias="0"
                         app:layout_constraintTop_toBottomOf="@id/company_guide_text_view"
+                        app:layout_constraintBottom_toTopOf="@id/inducement_layout"
                         />
 
                     <androidx.constraintlayout.widget.ConstraintLayout
                         android:id="@+id/inducement_layout"
                         android:layout_width="match_parent"
-                        android:layout_height="wrap_content"
-                        android:layout_marginTop="@dimen/dp_size_40"
-                        android:layout_marginBottom="@dimen/dp_size_56"
+                        android:layout_height="@dimen/home_inducement_banner_height"
+                        android:layout_marginBottom="@dimen/dp_size_24"
                         android:layout_marginHorizontal="@dimen/dp_size_14"
                         android:background="@drawable/bg_blue_100_radius_8"
-                        app:layout_goneMarginBottom="@dimen/dp_size_56"
+                        android:onClick="@{() -> viewModel.onClickBanner()}"
+                        android:visibility="@{viewModel.showBanner ? View.VISIBLE : View.GONE}"
                         app:layout_constraintTop_toBottomOf="@id/description_text_view"
                         app:layout_constraintBottom_toBottomOf="parent"
+                        tools:visibility="visible"
                         >
 
                         <ImageView
                             android:id="@+id/inducement_image_view"
-                            android:layout_width="@dimen/dp_size_46"
-                            android:layout_height="@dimen/dp_size_46"
-                            android:layout_marginTop="@dimen/dp_size_40"
-                            app:srcCompat="@drawable/image_temp_location"
+                            android:layout_width="@dimen/dp_size_62"
+                            android:layout_height="@dimen/dp_size_84"
+                            android:layout_marginTop="@dimen/dp_size_24"
+                            app:srcCompat="@drawable/image_review_inducement"
                             app:layout_constraintTop_toTopOf="parent"
                             app:layout_constraintStart_toStartOf="parent"
                             app:layout_constraintEnd_toEndOf="parent"
                             />
 
                         <TextView
-                            android:id="@+id/inducement_message_text_view"
+                            android:id="@+id/inducement_message1_text_view"
                             android:layout_width="match_parent"
                             android:layout_height="wrap_content"
-                            android:layout_marginTop="@dimen/dp_size_20"
+                            android:layout_marginTop="@dimen/dp_size_16"
                             android:layout_marginHorizontal="@dimen/dp_size_16"
                             android:gravity="center"
-                            android:textSize="@dimen/sp_size_14"
-                            android:textColor="@color/blue_300"
-                            android:fontFamily="@font/pretendard_semibold"
+                            android:text="@string/home_review_inducement_message1"
+                            android:textSize="@dimen/sp_size_16"
+                            android:textColor="@color/gray_800"
+                            android:fontFamily="@font/pretendard_medium"
                             app:layout_constraintTop_toBottomOf="@id/inducement_image_view"
-                            tools:text="회사 정보를 기입하고 맞춤 정보를 추천 받으세요."
                             />
 
-                        <com.ftw.hometerview.design.Button
+                        <TextView
+                            android:id="@+id/inducement_message2_text_view"
+                            android:layout_width="match_parent"
+                            android:layout_height="wrap_content"
+                            android:layout_marginTop="@dimen/dp_size_8"
+                            android:layout_marginHorizontal="@dimen/dp_size_16"
+                            android:gravity="center"
+                            android:text="@string/home_review_inducement_message2"
+                            android:textSize="@dimen/sp_size_16"
+                            android:textColor="@color/gray_800"
+                            android:fontFamily="@font/pretendard_medium"
+                            app:layout_constraintTop_toBottomOf="@id/inducement_message1_text_view"
+                            />
+
+                        <com.ftw.hometerview.design.MainButton
                             android:id="@+id/inducement_button"
-                            android:layout_width="wrap_content"
+                            android:layout_width="match_parent"
                             android:layout_height="wrap_content"
-                            android:layout_marginTop="@dimen/dp_size_10"
-                            android:layout_marginBottom="@dimen/dp_size_30"
-                            android:text="@string/heart"
-                            app:layout_constraintTop_toBottomOf="@id/inducement_message_text_view"
+                            android:layout_marginTop="@dimen/dp_size_24"
+                            android:layout_marginBottom="@dimen/dp_size_24"
+                            android:layout_marginHorizontal="@dimen/dp_size_16"
+                            android:text="@string/home_review_inducement_button"
+                            app:layout_constraintTop_toBottomOf="@id/inducement_message2_text_view"
                             app:layout_constraintBottom_toBottomOf="parent"
                             app:layout_constraintStart_toStartOf="parent"
                             app:layout_constraintEnd_toEndOf="parent"

diff --git a/app/src/main/res/values/dimen.xml b/app/src/main/res/values/dimen.xml
@@ -50,6 +50,7 @@
     <dimen name="dp_size_56">56dp</dimen>
     <dimen name="dp_size_60">60dp</dimen>
     <dimen name="dp_size_80">80dp</dimen>
+    <dimen name="dp_size_84">84dp</dimen>
     <dimen name="dp_size_90">90dp</dimen>
     <dimen name="dp_size_62">62dp</dimen>
     <dimen name="dp_size_70">70dp</dimen>
@@ -66,9 +67,9 @@
 
     <dimen name="main_bottom_navigation_icon_size">26dp</dimen>
 
-    <dimen name="home_inducement_banner_height">274dp</dimen>
-    <dimen name="home_tab_layout_expanding_contents_height">68dp</dimen>
-    <dimen name="home_tab_layout_expanding_title_height">62dp</dimen>
+    <dimen name="home_inducement_banner_height">255dp</dimen>
+    <dimen name="home_tab_layout_expanding_contents_height">86dp</dimen>
+    <dimen name="home_tab_layout_expanding_title_height">80dp</dimen>
     <dimen name="home_tab_layout_expanding_corner_radius">8dp</dimen>
     <dimen name="home_tab_layout_collapsed_contents_height">46dp</dimen>
     <dimen name="home_tab_layout_collapsed_title_height">38dp</dimen>

diff --git a/app/src/main/res/values/strings.xml b/app/src/main/res/values/strings.xml
@@ -24,6 +24,12 @@
 
     <string name="home_title">통근러에게 추천하는 동네</string>
     <string name="home_description">%s 직장인들이 많이 사는 동네의 리뷰입니다</string>
+    <string name="home_review_inducement_message1">집터뷰를 작성하면</string>
+    <string name="home_review_inducement_message2">모든 집터뷰를 볼 수 있어요!</string>
+    <string name="home_review_inducement_button">집터뷰 진행하기</string>
+    <string name="home_company_inducement_message1">회사 주소만 있으면</string>
+    <string name="home_company_inducement_message2">맞춤 정보를 추천해드려요!</string>
+    <string name="home_company_inducement_button">입력하고 추천받기</string>
     <string name="home_location_review_summary">%s · %s · %s</string>
     <string name="favorite_review_summary">%s · %s</string>
     <string name="home_tab_item_winner">리뷰 1위</string>