[Feat] 채팅 목록 ui 개발 #345

domain/src/main/java/com/project200/domain/model/ChattingModel.kt

@@ -0,0 +1,11 @@
+package com.project200.domain.model
+
+data class ChattingRoom(
+    val id: Long,
+    val nickname: String,
+    val profileImageUrl: String,
+    val thumbnailImageUrl: String,
+    val lastMessage: String,
+    val lastChattedAt: String,
+    val unreadCount: Long
+)

feature/chatting/build.gradle.kts

@@ -32,4 +32,7 @@ dependencies {
     testImplementation(libs.androidx.arch.core.testing)
     testImplementation(libs.turbine)
     androidTestImplementation(libs.androidx.navigation.testing)
+
+    // CircleImageView
+    implementation(libs.circleimageview)
 }

feature/chatting/src/main/java/com/project200/feature/chatting/ChattingListFragment.kt

@@ -0,0 +1,38 @@
+package com.project200.feature.chatting
+
+import android.view.View
+import androidx.fragment.app.viewModels
+import androidx.lifecycle.Lifecycle
+import androidx.lifecycle.lifecycleScope
+import androidx.lifecycle.repeatOnLifecycle
+import com.project200.presentation.base.BindingFragment
+import com.project200.undabang.feature.chatting.R
+import com.project200.undabang.feature.chatting.databinding.FragmentChattingListBinding
+import dagger.hilt.android.AndroidEntryPoint
+import kotlinx.coroutines.launch
+
+@AndroidEntryPoint
+class ChattingListFragment: BindingFragment<FragmentChattingListBinding>(R.layout.fragment_chatting_list) {
+    private val viewModel: ChattingListViewModel by viewModels()
+    private lateinit var chattingListAdapter: ChattingListRVAdapter
+
+    override fun getViewBinding(view: View): FragmentChattingListBinding {
+        return FragmentChattingListBinding.bind(view)
+    }
+
+    override fun setupViews() {
+        chattingListAdapter = ChattingListRVAdapter()
+        binding.chattingRoomRv.adapter = chattingListAdapter
+    }
+
+    override fun setupObservers() {
+        viewLifecycleOwner.lifecycleScope.launch {
+            viewLifecycleOwner.repeatOnLifecycle(Lifecycle.State.STARTED) {
+                viewModel.chattingRooms.collect { chatRooms ->
+                    // ListAdapter의 submitList를 통해 리스트를 업데이트
+                    chattingListAdapter.submitList(chatRooms)
+                }
+            }
+        }
+    }
+}

feature/chatting/src/main/java/com/project200/feature/chatting/ChattingListRVAdapter.kt

@@ -0,0 +1,54 @@
+package com.project200.feature.chatting
+
+import android.view.LayoutInflater
+import android.view.View
+import android.view.ViewGroup
+import androidx.recyclerview.widget.DiffUtil
+import androidx.recyclerview.widget.ListAdapter
+import androidx.recyclerview.widget.RecyclerView
+import com.project200.domain.model.ChattingRoom
+import com.project200.undabang.feature.chatting.databinding.ItemChattingRoomBinding
+
+class ChattingListRVAdapter :
+    ListAdapter<ChattingRoom, ChattingListRVAdapter.ChattingRoomViewHolder>(ChattingRoomDiffCallback()) {
+
+    override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): ChattingRoomViewHolder {
+        val binding =
+            ItemChattingRoomBinding.inflate(LayoutInflater.from(parent.context), parent, false)
+        return ChattingRoomViewHolder(binding)
+    }
+
+    override fun onBindViewHolder(holder: ChattingRoomViewHolder, position: Int) {
+        holder.bind(getItem(position))
+    }
+
+    class ChattingRoomViewHolder(private val binding: ItemChattingRoomBinding) :
+        RecyclerView.ViewHolder(binding.root) {
+        fun bind(chattingRoom: ChattingRoom) {
+            binding.nicknameTv.text = chattingRoom.nickname
+            binding.lastMessageTv.text = chattingRoom.lastMessage
+            binding.lastTimeTv.text = chattingRoom.lastChattedAt
+
+            if (chattingRoom.unreadCount > 0) {
+                binding.badgeTv.visibility = View.VISIBLE
+            } else {
+                binding.badgeTv.visibility = View.GONE
+            }
+
+            binding.badgeTv.text = chattingRoom.unreadCount.toString()
+
+        }
+    }
+
+    class ChattingRoomDiffCallback : DiffUtil.ItemCallback<ChattingRoom>() {
+        // 아이템의 고유 ID를 비교하여 같은 아이템인지 확인합니다.
+        override fun areItemsTheSame(oldItem: ChattingRoom, newItem: ChattingRoom): Boolean {
+            return oldItem.id == newItem.id
+        }
+
+        // 아이템의 내용이 같은지 비교합니다. areItemsTheSame이 true일 때만 호출됩니다.
+        override fun areContentsTheSame(oldItem: ChattingRoom, newItem: ChattingRoom): Boolean {
+            return oldItem == newItem
+        }
+    }
+}

feature/chatting/src/main/java/com/project200/feature/chatting/ChattingListViewModel.kt

@@ -0,0 +1,77 @@
+package com.project200.feature.chatting
+
+import androidx.lifecycle.ViewModel
+import androidx.lifecycle.viewModelScope
+import com.project200.domain.model.ChattingRoom
+import dagger.hilt.android.lifecycle.HiltViewModel
+import kotlinx.coroutines.flow.MutableStateFlow
+import kotlinx.coroutines.flow.StateFlow
+import kotlinx.coroutines.launch
+import javax.inject.Inject
+
+@HiltViewModel
+class ChattingListViewModel @Inject constructor(
+
+) : ViewModel() {
+    private val _chattingRooms = MutableStateFlow<List<ChattingRoom>>(emptyList())
+    val chattingRooms: StateFlow<List<ChattingRoom>> = _chattingRooms
+
+    init {
+        fetchChattingRooms()
+    }
+
+    // 채팅방 리스트를 가져오는 함수 (지금은 임시 데이터 생성)
+    private fun fetchChattingRooms() {
+        viewModelScope.launch {
+            // TODO: API를 호출하여 데이터를 가져옵니다.
+            val mockData = listOf(
+                ChattingRoom(
+                    id = 1,
+                    nickname = "강남 공인중개사",
+                    profileImageUrl = "url_to_profile_image_1", // 실제 이미지를 사용하려면 여기에 URL을 넣으세요.
+                    thumbnailImageUrl = "url_to_thumbnail_image_1",
+                    lastMessage = "네, 그 집 아직 계약 가능합니다. 언제 보러 오시겠어요?",
+                    lastChattedAt = "2024-10-28T15:30:00Z",
+                    unreadCount = 2
+                ),
+                ChattingRoom(
+                    id = 2,
+                    nickname = "집주인",
+                    profileImageUrl = "url_to_profile_image_2",
+                    thumbnailImageUrl = "url_to_thumbnail_image_2",
+                    lastMessage = "월세 입금 확인했습니다. 감사합니다.",
+                    lastChattedAt = "2024-10-28T11:15:00Z",
+                    unreadCount = 0
+                ),
+                ChattingRoom(
+                    id = 3,
+                    nickname = "홍대 원룸 문의",
+                    profileImageUrl = "url_to_profile_image_3",
+                    thumbnailImageUrl = "url_to_thumbnail_image_3",
+                    lastMessage = "사진을 보냈습니다.",
+                    lastChattedAt = "2024-10-27T18:45:00Z",
+                    unreadCount = 1
+                ),
+                ChattingRoom(
+                    id = 4,
+                    nickname = "이사 센터",
+                    profileImageUrl = "url_to_profile_image_4",
+                    thumbnailImageUrl = "url_to_thumbnail_image_4",
+                    lastMessage = "견적 보내드렸습니다. 확인 후 연락주세요.",
+                    lastChattedAt = "2024-10-26T09:00:00Z",
+                    unreadCount = 0
+                ),
+                ChattingRoom(
+                    id = 5,
+                    nickname = "성수동 오피스텔",
+                    profileImageUrl = "url_to_profile_image_5",
+                    thumbnailImageUrl = "url_to_thumbnail_image_5",
+                    lastMessage = "네, 내일 오후 2시에 뵙겠습니다.",
+                    lastChattedAt = "2024-10-25T14:22:00Z",
+                    unreadCount = 5
+                )
+            )
+            _chattingRooms.value = mockData
+        }
+    }
+}

feature/chatting/src/main/res/drawable/bg_badge.xml

@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="utf-8"?>
+<shape xmlns:android="http://schemas.android.com/apk/res/android"
+    android:shape="rectangle">
+    <solid android:color="@color/error_red" />
+    <corners android:radius="50dp" />
+</shape>

feature/chatting/src/main/res/drawable/bg_chatting_room_list.xml

@@ -0,0 +1,14 @@
+<?xml version="1.0" encoding="utf-8"?>
+<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
+    <item>
+        <shape android:shape="rectangle">
+            <solid android:color="@color/white300"/>
+        </shape>
+    </item>
+    <item android:gravity="bottom">
+        <shape android:shape="rectangle">
+            <solid android:color="@color/gray300"/>
+            <size android:height="1dp"/>
+        </shape>
+    </item>
+</layer-list>

feature/chatting/src/main/res/drawable/ic_profile_default.xml

@@ -0,0 +1,13 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="130dp"
+    android:height="130dp"
+    android:viewportWidth="130"
+    android:viewportHeight="130">
+  <path
+      android:pathData="M65,65m-65,0a65,65 0,1 1,130 0a65,65 0,1 1,-130 0"
+      android:fillColor="#9DB297"/>
+  <path
+      android:pathData="M50,46.25C50,42.27 51.58,38.46 54.39,35.64C57.21,32.83 61.02,31.25 65,31.25C68.98,31.25 72.79,32.83 75.61,35.64C78.42,38.46 80,42.27 80,46.25C80,50.23 78.42,54.04 75.61,56.86C72.79,59.67 68.98,61.25 65,61.25C61.02,61.25 57.21,59.67 54.39,56.86C51.58,54.04 50,50.23 50,46.25ZM50,68.75C45.03,68.75 40.26,70.73 36.74,74.24C33.23,77.76 31.25,82.53 31.25,87.5C31.25,90.48 32.44,93.35 34.54,95.46C36.65,97.56 39.52,98.75 42.5,98.75H87.5C90.48,98.75 93.35,97.56 95.46,95.46C97.56,93.35 98.75,90.48 98.75,87.5C98.75,82.53 96.77,77.76 93.26,74.24C89.74,70.73 84.97,68.75 80,68.75H50Z"
+      android:fillColor="#EBF1E5"
+      android:fillType="evenOdd"/>
+</vector>

feature/chatting/src/main/res/layout/fragment_chatting_list.xml

@@ -0,0 +1,18 @@
+<?xml version="1.0" encoding="utf-8"?>
+<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
+    android:layout_width="match_parent"
+    android:layout_height="match_parent"
+    xmlns:app="http://schemas.android.com/apk/res-auto"
+    android:orientation="vertical">
+    <ImageView
+        android:layout_margin="@dimen/base_horizontal_margin"
+        android:src="@drawable/ic_logo_appname"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"/>
+    <androidx.recyclerview.widget.RecyclerView
+        android:id="@+id/chatting_room_rv"
+        android:layout_width="match_parent"
+        android:layout_height="0dp"
+        android:layout_weight="1"
+        app:layoutManager="androidx.recyclerview.widget.LinearLayoutManager"/>
+</LinearLayout>

feature/chatting/src/main/res/layout/item_chatting_room.xml

@@ -0,0 +1,67 @@
+<?xml version="1.0" encoding="utf-8"?>
+<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:app="http://schemas.android.com/apk/res-auto"
+    android:layout_width="match_parent"
+    android:layout_height="wrap_content">
+
+    <de.hdodenhof.circleimageview.CircleImageView
+        android:id="@+id/profile_img_iv"
+        android:layout_width="54dp"
+        android:layout_height="54dp"
+        android:layout_margin="@dimen/base_horizontal_margin"
+        android:src="@drawable/ic_profile_default"
+        app:layout_constraintBottom_toBottomOf="parent"
+        app:layout_constraintStart_toStartOf="parent"
+        app:layout_constraintTop_toTopOf="parent" />
+
+    <TextView
+        android:id="@+id/nickname_tv"
+        style="@style/content_bold"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        android:layout_marginStart="15dp"
+        android:layout_marginBottom="10dp"
+        app:layout_constraintBottom_toTopOf="@id/last_message_tv"
+        app:layout_constraintStart_toEndOf="@id/profile_img_iv"
+        app:layout_constraintTop_toTopOf="parent"
+        app:layout_constraintVertical_chainStyle="packed" />
+
+    <TextView
+        android:id="@+id/last_message_tv"
+        style="@style/subtext_14"
+        android:layout_width="0dp"
+        android:layout_height="wrap_content"
+        android:layout_marginEnd="@dimen/base_horizontal_margin"
+        android:ellipsize="end"
+        android:maxLines="1"
+        android:textColor="@color/gray200"
+        app:layout_constraintBottom_toBottomOf="parent"
+        app:layout_constraintEnd_toStartOf="@+id/badge_tv"
+        app:layout_constraintStart_toStartOf="@id/nickname_tv"
+        app:layout_constraintTop_toBottomOf="@id/nickname_tv" />
+
+    <TextView
+        android:id="@+id/last_time_tv"
+        style="@style/subtext_12"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        android:layout_marginEnd="@dimen/base_horizontal_margin"
+        android:textColor="@color/gray200"
+        app:layout_constraintBottom_toBottomOf="@id/nickname_tv"
+        app:layout_constraintEnd_toEndOf="parent"
+        app:layout_constraintTop_toTopOf="@id/nickname_tv" />
+
+    <TextView
+        android:id="@+id/badge_tv"
+        style="@style/subtext_12"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        android:layout_marginEnd="@dimen/base_horizontal_margin"
+        android:background="@drawable/bg_badge"
+        android:paddingHorizontal="7dp"
+        android:paddingVertical="1.5dp"
+        android:textColor="@color/white300"
+        app:layout_constraintBottom_toBottomOf="@id/last_message_tv"
+        app:layout_constraintEnd_toEndOf="parent"
+        app:layout_constraintTop_toTopOf="@id/last_message_tv" />
+</androidx.constraintlayout.widget.ConstraintLayout>

feature/chatting/src/main/res/navigation/chatting_nav_graph.xml

@@ -7,8 +7,8 @@
 
     <fragment
         android:id="@+id/chattingFragment"
-        android:name="com.project200.feature.chatting.ChattingFragment"
+        android:name="com.project200.feature.chatting.ChattingListFragment"
         android:label="chatting"
-        tools:layout="@layout/fragment_chatting" >
+        tools:layout="@layout/fragment_chatting_list" >
     </fragment>
 </navigation>

feature/exercise/src/main/res/drawable/ic_trash.xml

@@ -8,6 +8,6 @@
       android:strokeLineJoin="round"
       android:strokeWidth="2"
       android:fillColor="#00000000"
-      android:strokeColor="@color/error_led"
+      android:strokeColor="@color/error_red"
       android:strokeLineCap="round"/>
 </vector>

feature/matching/src/main/java/com/project200/feature/matching/place/ExercisePlaceFragment.kt

@@ -95,7 +95,7 @@ class ExercisePlaceFragment : BindingFragment<FragmentExercisePlaceBinding> (R.l
                 MenuStyler.applyTextColor(requireContext(), it, android.R.color.black)
             }
             menu.findItem(R.id.action_delete)?.let {
-                MenuStyler.applyTextColor(requireContext(), it, com.project200.undabang.presentation.R.color.error_led)
+                MenuStyler.applyTextColor(requireContext(), it, com.project200.undabang.presentation.R.color.error_red)
             }
 
             setOnMenuItemClickListener { menuItem ->

feature/profile/src/main/java/com/project200/undabang/profile/mypage/ProfileEditFragment.kt

@@ -143,7 +143,7 @@ class ProfileEditFragment :
                     binding.duplicateMessageTv.setTextColor(
                         getColor(
                             requireContext(),
-                            com.project200.undabang.presentation.R.color.error_led,
+                            com.project200.undabang.presentation.R.color.error_red,
                         ),
                     )
                 }
@@ -153,7 +153,7 @@ class ProfileEditFragment :
                     binding.duplicateMessageTv.setTextColor(
                         getColor(
                             requireContext(),
-                            com.project200.undabang.presentation.R.color.error_led,
+                            com.project200.undabang.presentation.R.color.error_red,
                         ),
                     )
                 }