Feat/#33 emotion activity 구현

app/src/main/java/com/owori/android/presenter/main/home/EmotionActivity.kt

@@ -2,21 +2,34 @@ package com.owori.android.presenter.main.home
 
 import android.content.Context
 import android.content.Intent
+import android.widget.Toast.LENGTH_SHORT
+import android.widget.Toast.makeText
 import androidx.activity.viewModels
 import androidx.core.content.ContextCompat
 import com.owori.android.R
 import com.owori.android.core.BaseActivity
 import com.owori.android.databinding.ActivityEmotionBinding
+import com.owori.android.presenter.main.home.adapter.EmotionAdapter
+import com.owori.android.presenter.model.EmotionItem
 import dagger.hilt.android.AndroidEntryPoint
 
 @AndroidEntryPoint
-class EmotionActivity : BaseActivity<ActivityEmotionBinding, EmotionViewModel>(R.layout.activity_emotion) {
-    override val viewModel : EmotionViewModel by viewModels()
+class EmotionActivity :
+    BaseActivity<ActivityEmotionBinding, EmotionViewModel>(R.layout.activity_emotion) {
+    override val viewModel: EmotionViewModel by viewModels()
+    private val emotionListAdapter: EmotionAdapter by lazy {
+        EmotionAdapter { _emotionItem -> viewModel.onClickEmotionItem(_emotionItem) }
+    }
+
     override fun setBindingVariables(binding: ActivityEmotionBinding) {
         binding.vm = viewModel
     }
 
-    override fun initView() {}
+    override fun initView() {
+        initEmotionList()
+        initEmotionRecyclerView()
+    }
+
     override fun onResume() {
         super.onResume()
         window.statusBarColor = ContextCompat.getColor(this, R.color.yellow_ffeeb2)
@@ -27,10 +40,55 @@ class EmotionActivity : BaseActivity<ActivityEmotionBinding, EmotionViewModel>(R
             closeButtonClicked.observe(this@EmotionActivity) {
                 finish()
             }
+            emotionList.observe(this@EmotionActivity) {
+                emotionListAdapter.submitList(it)
+            }
+            callClickSubmitButton.observe(this@EmotionActivity) {
+                makeText(this@EmotionActivity, "감정이 등록되었어요! 🤓", LENGTH_SHORT).show()
+                finish()
+            }
         }
     }
 
+    private fun initEmotionRecyclerView() {
+        with(binding) {
+            emotionRecyclerView.apply {
+                isNestedScrollingEnabled = false
+                isScrollContainer = false
+                adapter = emotionListAdapter
+            }
+        }
+    }
+
+    private fun initEmotionList() {
+        viewModel.setEmotionList(EMOTION_DRAWABLE_LIST.mapIndexed { _id, _drawable ->
+            EmotionItem(
+                _id,
+                _drawable,
+                false
+            )
+        })
+    }
+
     companion object {
+        private val EMOTION_DRAWABLE_LIST = listOf(
+            R.drawable.emoji_excited,
+            R.drawable.emoji_happy,
+            R.drawable.emoji_love,
+            R.drawable.emoji_kiss,
+            R.drawable.emoji_surprised,
+            R.drawable.emoji_cool,
+            R.drawable.emoji_soso,
+            R.drawable.emoji_sleepy,
+            R.drawable.emoji_tired,
+            R.drawable.emoji_confused,
+            R.drawable.emoji_sad,
+            R.drawable.emoji_very_sad,
+            R.drawable.emoji_shocked,
+            R.drawable.emoji_angry,
+            R.drawable.emoji_very_angry,
+        )
+
         fun startActivity(context: Context) {
             Intent(context, EmotionActivity::class.java).apply {
                 context.startActivity(this)

app/src/main/java/com/owori/android/presenter/main/home/EmotionViewModel.kt

@@ -1,7 +1,9 @@
 package com.owori.android.presenter.main.home
 
 import androidx.lifecycle.LiveData
+import androidx.lifecycle.MutableLiveData
 import com.owori.android.core.BaseViewModel
+import com.owori.android.presenter.model.EmotionItem
 import com.owori.android.presenter.util.SingleLiveEvent
 import dagger.hilt.android.lifecycle.HiltViewModel
 import javax.inject.Inject
@@ -10,9 +12,37 @@ import javax.inject.Inject
 class EmotionViewModel @Inject constructor() : BaseViewModel() {
     private val _closeButtonClicked: SingleLiveEvent<Unit> = SingleLiveEvent()
     val closeButtonClicked: LiveData<Unit> = _closeButtonClicked
+    private val _emotionList: MutableLiveData<List<EmotionItem>> = MutableLiveData()
+    val emotionList: LiveData<List<EmotionItem>> = _emotionList
+    private val _currentEmotion: MutableLiveData<EmotionItem> = MutableLiveData()
+    val currentEmotion: LiveData<EmotionItem> = _currentEmotion
+    private val _callClickSubmitButton: SingleLiveEvent<Unit> = SingleLiveEvent()
+    val callClickSubmitButton: LiveData<Unit> = _callClickSubmitButton
 
     fun onClickCloseButton() {
         _closeButtonClicked.call()
     }
 
+    fun onClickEmotionItem(selectedEmotionItem: EmotionItem) {
+        _emotionList.value = _emotionList.value?.map { _emotionItem ->
+            if (_emotionItem.id == selectedEmotionItem.id){
+                _currentEmotion.value = _emotionItem.copy(isChecked = !_emotionItem.isChecked)
+                _emotionItem.copy(isChecked = !_emotionItem.isChecked)
+            }
+            else _emotionItem.copy(isChecked = false)
+        }
+    }
+
+    fun onClickSubmitButton() {
+        _currentEmotion.value?.let { setEmotion(it) }
+        _callClickSubmitButton.call()
+    }
+
+    fun setEmotionList(emotions: List<EmotionItem>) {
+        _emotionList.value = emotions
+    }
+
+    private fun setEmotion(selectedEmotionItem: EmotionItem) {
+        // TODO : 서버로 감정 PUT
+    }
 }

app/src/main/java/com/owori/android/presenter/main/home/adapter/EmotionAdapter.kt

@@ -0,0 +1,42 @@
+package com.owori.android.presenter.main.home.adapter
+
+import android.view.LayoutInflater
+import android.view.ViewGroup
+import androidx.recyclerview.widget.DiffUtil
+import androidx.recyclerview.widget.ListAdapter
+import androidx.recyclerview.widget.RecyclerView
+import com.owori.android.databinding.ItemEmotionBinding
+import com.owori.android.presenter.model.EmotionItem
+
+class EmotionAdapter(private val clickEvent: (emotionItem: EmotionItem) -> Unit = {}) : ListAdapter<EmotionItem, EmotionAdapter.ViewHolder>(EmotionItemDiffUtil()) {
+
+    inner class ViewHolder(private val binding: ItemEmotionBinding) : RecyclerView.ViewHolder(binding.root) {
+        fun bind(emotionItem: EmotionItem) {
+            with(binding) {
+                data = emotionItem
+                emotionItemLayout.setOnClickListener { clickEvent(emotionItem) }
+            }
+        }
+    }
+    override fun onCreateViewHolder(
+        parent: ViewGroup,
+        viewType: Int
+    ): ViewHolder {
+        val binding = ItemEmotionBinding.inflate(LayoutInflater.from(parent.context),parent,false)
+        return ViewHolder(binding)
+    }
+
+    override fun onBindViewHolder(holder: ViewHolder, position: Int) {
+        holder.bind(getItem(position))
+    }
+}
+
+class EmotionItemDiffUtil : DiffUtil.ItemCallback<EmotionItem>(){
+    override fun areItemsTheSame(oldItem: EmotionItem, newItem: EmotionItem): Boolean {
+        return oldItem.id == newItem.id
+    }
+
+    override fun areContentsTheSame(oldItem: EmotionItem, newItem: EmotionItem): Boolean {
+        return oldItem.hashCode() == newItem.hashCode()
+    }
+}

app/src/main/java/com/owori/android/presenter/model/EmotionItem.kt

@@ -3,4 +3,5 @@ package com.owori.android.presenter.model
 data class EmotionItem (
     val id: Int,
     val emotionDrawableId: Int?,
+    val isChecked: Boolean,
 )

app/src/main/res/drawable/emoji_check.xml

@@ -0,0 +1,5 @@
+<vector android:autoMirrored="true" android:height="40dp"
+    android:viewportHeight="40" android:viewportWidth="40"
+    android:width="40dp" xmlns:android="http://schemas.android.com/apk/res/android">
+    <path android:fillColor="#FA7B53" android:pathData="M16.668,26.951L32.477,11.143C33.127,10.492 34.183,10.492 34.834,11.143C35.485,11.794 35.485,12.849 34.834,13.5L17.846,30.487C17.195,31.138 16.14,31.138 15.489,30.487L5.573,20.571C4.922,19.92 4.922,18.865 5.573,18.214C6.224,17.563 7.279,17.563 7.93,18.214L16.668,26.951Z"/>
+</vector>

app/src/main/res/layout/activity_emotion.xml

@@ -68,11 +68,16 @@
             app:layout_constraintTop_toBottomOf="@+id/emotinQusetionTextView" />
 
         <androidx.recyclerview.widget.RecyclerView
+            android:id="@+id/emotionRecyclerView"
             android:layout_width="0dp"
-            android:layout_height="wrap_content"
+            android:layout_height="0dp"
+            android:overScrollMode="never"
             android:layout_marginHorizontal="40dp"
-            android:layout_marginTop="17dp"
+            android:layout_marginTop="12dp"
+            android:layout_marginBottom="12dp"
+            app:spanCount="3"
             app:layoutManager="androidx.recyclerview.widget.GridLayoutManager"
+            app:layout_constraintBottom_toTopOf="@+id/submitButton"
             app:layout_constraintEnd_toEndOf="parent"
             app:layout_constraintStart_toStartOf="parent"
             app:layout_constraintTop_toBottomOf="@+id/emotionRegistrationTextView"
@@ -87,6 +92,7 @@
             android:textColor="@color/white"
             style="@style/TextTitle.02"
             android:includeFontPadding="false"
+            android:onClick="@{() -> vm.onClickSubmitButton()}"
             app:layout_constraintBottom_toBottomOf="parent"
             app:layout_constraintEnd_toEndOf="parent"
             android:layout_marginHorizontal="52dp"
@@ -95,7 +101,6 @@
             android:background="@drawable/shp_fa7b53_r12"
             app:layout_constraintStart_toStartOf="parent" />
 
-
     </androidx.constraintlayout.widget.ConstraintLayout>
 
 </layout>

app/src/main/res/layout/item_emotion.xml

@@ -12,15 +12,19 @@
     </data>
 
     <androidx.constraintlayout.widget.ConstraintLayout
+        android:id="@+id/emotionItemLayout"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content">
 
         <androidx.cardview.widget.CardView
             android:layout_width="80dp"
             android:layout_height="80dp"
             android:src="@color/black"
+            app:cardElevation="3dp"
             app:cardCornerRadius="56dp"
-
+            android:layout_marginHorizontal="4dp"
+            android:layout_marginTop="12dp"
+            android:layout_marginBottom="4dp"
             app:layout_constraintBottom_toBottomOf="parent"
             app:layout_constraintEnd_toEndOf="parent"
             app:layout_constraintStart_toStartOf="parent"
@@ -31,6 +35,32 @@
                 setImageView="@{data.emotionDrawableId}"
                 android:layout_width="60dp"
                 android:layout_height="60dp"
+                android:layout_gravity="center"
+                tools:src="@drawable/emoji_cool" />
+
+        </androidx.cardview.widget.CardView>
+
+        <androidx.cardview.widget.CardView
+            android:layout_width="80dp"
+            android:layout_height="80dp"
+            app:cardElevation="3dp"
+            android:layout_marginHorizontal="4dp"
+            android:layout_marginTop="12dp"
+            android:layout_marginBottom="4dp"
+            app:cardBackgroundColor="@color/grey_66000000"
+            app:cardCornerRadius="56dp"
+            android:visibility="@{data.isChecked == true ? View.VISIBLE : View.GONE}"
+            app:layout_constraintBottom_toBottomOf="parent"
+            app:layout_constraintEnd_toEndOf="parent"
+            app:layout_constraintStart_toStartOf="parent"
+            app:layout_constraintTop_toTopOf="parent">
+
+            <ImageView
+                android:id="@+id/check"
+                tools:src="@drawable/emoji_check"
+                android:src="@drawable/emoji_check"
+                android:layout_width="40dp"
+                android:layout_height="40dp"
                 android:layout_gravity="center" />
 
         </androidx.cardview.widget.CardView>

app/src/main/res/values/colors.xml

@@ -14,6 +14,7 @@
     <color name="grey_787878">#787878</color>
     <color name="grey_626262">#626262</color>
     <color name="grey_464646">#464646</color>
+    <color name="grey_66000000">#66000000</color>
 
     <color name="yellow_fee500">#FEE500</color>