feat: 메인 라이브

- 개편된 지금 라이브 중 UI 적용

app/src/main/java/kr/co/vividnext/sodalive/live/LiveFragment.kt

@@ -463,18 +463,18 @@ class LiveFragment : BaseFragment<FragmentLiveBinding>(FragmentLiveBinding::infl
 
                 when (parent.getChildAdapterPosition(view)) {
                     0 -> {
-                        outRect.left = 13.3f.dpToPx().toInt()
-                        outRect.right = 5.dpToPx().toInt()
+                        outRect.left = 0
+                        outRect.right = 8.dpToPx().toInt()
                     }
 
                     liveNowAdapter.itemCount - 1 -> {
-                        outRect.left = 5.dpToPx().toInt()
-                        outRect.right = 13.3f.dpToPx().toInt()
+                        outRect.left = 8.dpToPx().toInt()
+                        outRect.right = 0
                     }
 
                     else -> {
-                        outRect.left = 5.dpToPx().toInt()
-                        outRect.right = 5.dpToPx().toInt()
+                        outRect.left = 8.dpToPx().toInt()
+                        outRect.right = 8.dpToPx().toInt()
                     }
                 }
             }

app/src/main/java/kr/co/vividnext/sodalive/live/now/LiveNowAdapter.kt

@@ -5,17 +5,12 @@ import android.content.Context
 import android.view.LayoutInflater
 import android.view.View
 import android.view.ViewGroup
-import androidx.constraintlayout.widget.ConstraintLayout
 import androidx.recyclerview.widget.RecyclerView
-import coil.transform.CircleCropTransformation
 import com.bumptech.glide.Glide
-import com.bumptech.glide.load.resource.bitmap.CenterCrop
-import com.bumptech.glide.load.resource.bitmap.RoundedCorners
+import com.bumptech.glide.load.resource.bitmap.CircleCrop
 import com.bumptech.glide.request.RequestOptions
-import kr.co.vividnext.sodalive.R
 import kr.co.vividnext.sodalive.databinding.ItemLiveNowBinding
-import kr.co.vividnext.sodalive.extensions.dpToPx
-import kr.co.vividnext.sodalive.extensions.loadUrl
+import kr.co.vividnext.sodalive.extensions.moneyFormat
 import kr.co.vividnext.sodalive.live.GetRoomListResponse
 
 class LiveNowAdapter(
@@ -33,54 +28,24 @@ class LiveNowAdapter(
         fun bind(item: GetRoomListResponse) {
             Glide
                 .with(context)
-                .load(item.coverImageUrl)
+                .load(item.creatorProfileImage)
                 .apply(
                     RequestOptions().transform(
-                        CenterCrop(),
-                        RoundedCorners(8)
+                        CircleCrop()
                     )
                 )
-                .into(binding.ivCover)
-
-            val layoutParams = binding.ivCover.layoutParams as ConstraintLayout.LayoutParams
-            layoutParams.width = 128f.dpToPx().toInt()
-            layoutParams.height = 179f.dpToPx().toInt()
-            binding.ivCover.layoutParams = layoutParams
-
-            binding.ivLock.visibility = if (item.isPrivateRoom) {
-                View.VISIBLE
-            } else {
-                View.GONE
-            }
-
-            if (item.price > 0) {
-                binding.tvPrice.text = "${item.price}"
-                binding.tvPrice.setCompoundDrawablesWithIntrinsicBounds(
-                    R.drawable.ic_can_white,
-                    0,
-                    0,
-                    0
-                )
-                binding.tvPrice.setBackgroundResource(R.drawable.bg_round_corner_13_3_dd4500)
-            } else {
-                binding.tvPrice.text = "무료"
-                binding.tvPrice.setCompoundDrawables(null, null, null, null)
-                binding.tvPrice.setBackgroundResource(R.drawable.bg_round_corner_13_3_111111)
-            }
-
-            if (item.tags.isNotEmpty()) {
-                binding.tvTags.visibility = View.VISIBLE
-                binding.tvTags.text = item.tags.joinToString(" ") { "#$it" }
-            } else {
-                binding.tvTags.visibility = View.GONE
-            }
+                .into(binding.ivProfile)
 
             binding.tvTitle.text = item.title
             binding.tvNickname.text = item.creatorNickname
-            binding.ivProfile.loadUrl(item.creatorProfileImage) {
-                crossfade(true)
-                placeholder(R.drawable.ic_place_holder)
-                transformations(CircleCropTransformation())
+
+            if (item.price > 0) {
+                binding.llCan.visibility = View.VISIBLE
+                binding.tvCan.text = item.price.moneyFormat()
+                binding.tvFree.visibility = View.GONE
+            } else {
+                binding.llCan.visibility = View.GONE
+                binding.tvFree.visibility = View.VISIBLE
             }
 
             binding.root.setOnClickListener { onClick(item) }

app/src/main/res/drawable/bg_round_corner_999_3b5ff1.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="#3B5FF1" />
+    <corners android:radius="999dp" />
+</shape>

app/src/main/res/drawable/bg_round_corner_999_white.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="#FFFFFF" />
+    <corners android:radius="999dp" />
+</shape>

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

@@ -2,121 +2,118 @@
 <androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
     xmlns:app="http://schemas.android.com/apk/res-auto"
     xmlns:tools="http://schemas.android.com/tools"
-    android:layout_width="wrap_content"
-    android:layout_height="wrap_content">
+    android:layout_width="168dp"
+    android:layout_height="238dp"
+    android:background="@drawable/bg_home_creator"
+    android:orientation="vertical"
+    android:padding="16dp">
 
-    <ImageView
-        android:id="@+id/iv_cover"
-        android:layout_width="117dp"
-        android:layout_height="165dp"
-        android:contentDescription="@null"
-        android:scaleType="centerCrop"
-        app:layout_constraintStart_toStartOf="parent"
-        app:layout_constraintTop_toTopOf="parent"
-        tools:src="@drawable/ic_launcher_background" />
-
-    <View
-        android:layout_width="0dp"
-        android:layout_height="0dp"
-        android:background="@drawable/gradient_live_room_item"
-        app:layout_constraintBottom_toBottomOf="parent"
+    <!-- 프로필 이미지 컨테이너 -->
+    <FrameLayout
+        android:id="@+id/fl_profile"
+        android:layout_width="76dp"
+        android:layout_height="76dp"
+        android:background="@drawable/circle_background"
         app:layout_constraintEnd_toEndOf="parent"
         app:layout_constraintStart_toStartOf="parent"
-        app:layout_constraintTop_toTopOf="parent" />
+        app:layout_constraintTop_toTopOf="parent">
+
+        <!-- 프로필 이미지 -->
+        <ImageView
+            android:id="@+id/iv_profile"
+            android:layout_width="62dp"
+            android:layout_height="62dp"
+            android:layout_gravity="center"
+            android:contentDescription="@null"
+            android:scaleType="centerCrop" />
+
+        <!-- LIVE 배지 -->
+        <ImageView
+            android:layout_width="50dp"
+            android:layout_height="18dp"
+            android:layout_gravity="bottom|center_horizontal"
+            android:contentDescription="@null"
+            android:src="@drawable/img_live" />
+    </FrameLayout>
 
     <TextView
-        android:id="@+id/tv_price"
-        android:layout_width="wrap_content"
+        android:id="@+id/tv_nickname"
+        android:layout_width="0dp"
         android:layout_height="wrap_content"
-        android:layout_marginStart="3.3dp"
-        android:layout_marginTop="3.3dp"
-        android:drawablePadding="1dp"
-        android:fontFamily="@font/gmarket_sans_medium"
-        android:paddingHorizontal="7.3dp"
-        android:paddingVertical="4dp"
+        android:layout_marginTop="12dp"
+        android:fontFamily="@font/pretendard_regular"
+        android:gravity="center"
         android:textColor="@color/white"
-        android:textSize="12sp"
-        app:layout_constraintStart_toStartOf="parent"
-        app:layout_constraintTop_toTopOf="parent"
-        tools:background="@drawable/bg_round_corner_13_3_111111"
-        tools:ignore="SmallSp"
-        tools:text="유료" />
-
-    <ImageView
-        android:id="@+id/iv_lock"
-        android:layout_width="wrap_content"
-        android:layout_height="wrap_content"
-        android:layout_marginTop="3.3dp"
-        android:layout_marginEnd="3.3dp"
-        android:background="@drawable/bg_circle_b3333333"
-        android:contentDescription="@null"
-        android:padding="2.7dp"
-        android:src="@drawable/ic_lock"
-        android:visibility="gone"
+        android:textSize="18sp"
         app:layout_constraintEnd_toEndOf="parent"
-        app:layout_constraintTop_toTopOf="parent" />
+        app:layout_constraintStart_toStartOf="parent"
+        app:layout_constraintTop_toBottomOf="@+id/fl_profile"
+        tools:text="도화" />
 
     <TextView
         android:id="@+id/tv_title"
         android:layout_width="0dp"
-        android:layout_height="wrap_content"
+        android:layout_height="0dp"
         android:layout_marginTop="8dp"
         android:ellipsize="end"
-        android:fontFamily="@font/gmarket_sans_medium"
+        android:fontFamily="@font/pretendard_regular"
+        android:gravity="center"
         android:maxLines="2"
-        android:textColor="@color/color_eeeeee"
-        android:textSize="12sp"
-        app:layout_constraintEnd_toEndOf="@+id/iv_cover"
-        app:layout_constraintStart_toStartOf="@+id/iv_cover"
-        app:layout_constraintTop_toBottomOf="@+id/iv_cover"
-        tools:text="test" />
+        android:textColor="#B0BEC5"
+        android:textSize="14sp"
+        app:layout_constraintBottom_toTopOf="@+id/fl_can"
+        app:layout_constraintEnd_toEndOf="parent"
+        app:layout_constraintStart_toStartOf="parent"
+        app:layout_constraintTop_toBottomOf="@+id/tv_nickname"
+        tools:text="제목제목제목제목제목제목" />
 
-    <LinearLayout
+    <FrameLayout
+        android:id="@+id/fl_can"
         android:layout_width="0dp"
         android:layout_height="wrap_content"
-        android:orientation="vertical"
-        app:layout_constraintEnd_toEndOf="@+id/tv_title"
-        app:layout_constraintStart_toStartOf="@+id/tv_title"
-        app:layout_constraintTop_toBottomOf="@+id/tv_title">
+        android:gravity="center"
+        app:layout_constraintBottom_toBottomOf="parent"
+        app:layout_constraintEnd_toEndOf="parent"
+        app:layout_constraintStart_toStartOf="parent">
 
         <TextView
-            android:id="@+id/tv_tags"
+            android:id="@+id/tv_free"
             android:layout_width="match_parent"
             android:layout_height="wrap_content"
-            android:layout_marginTop="5.3dp"
-            android:fontFamily="@font/gmarket_sans_medium"
-            android:textColor="@color/color_3bb9f1"
-            android:textSize="11sp"
-            app:layout_constraintEnd_toEndOf="@+id/tv_title"
-            app:layout_constraintStart_toStartOf="@+id/tv_title"
-            app:layout_constraintTop_toBottomOf="@+id/tv_title"
-            tools:text="#팬미팅 #힐링" />
+            android:background="@drawable/bg_round_corner_999_white"
+            android:fontFamily="@font/pretendard_regular"
+            android:gravity="center"
+            android:paddingVertical="8dp"
+            android:text="무료"
+            android:textColor="#263238"
+            android:textSize="14sp"
+            android:visibility="gone" />
 
         <LinearLayout
+            android:id="@+id/ll_can"
             android:layout_width="match_parent"
             android:layout_height="wrap_content"
-            android:layout_marginTop="5.3dp"
-            android:gravity="center_vertical"
+            android:background="@drawable/bg_round_corner_999_3b5ff1"
+            android:gravity="center"
             android:orientation="horizontal"
-            tools:ignore="UseCompoundDrawables">
+            android:paddingVertical="8dp"
+            android:visibility="gone">
 
             <ImageView
-                android:id="@+id/iv_profile"
-                android:layout_width="21.3dp"
-                android:layout_height="21.3dp"
-                android:contentDescription="@null" />
+                android:layout_width="16dp"
+                android:layout_height="16dp"
+                android:layout_marginEnd="2dp"
+                android:contentDescription="@null"
+                android:src="@drawable/ic_can_circle" />
 
             <TextView
-                android:id="@+id/tv_nickname"
-                android:layout_width="match_parent"
+                android:id="@+id/tv_can"
+                android:layout_width="wrap_content"
                 android:layout_height="wrap_content"
-                android:layout_marginStart="5.3dp"
-                android:fontFamily="@font/gmarket_sans_medium"
-                android:gravity="center_vertical"
-                android:textColor="@color/color_777777"
-                android:textSize="10sp"
-                tools:ignore="SmallSp"
-                tools:text="user8" />
+                android:fontFamily="@font/pretendard_regular"
+                android:textColor="#FFFFFF"
+                android:textSize="14sp"
+                tools:text="300" />
         </LinearLayout>
-    </LinearLayout>
+    </FrameLayout>
 </androidx.constraintlayout.widget.ConstraintLayout>

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

@@ -49,6 +49,8 @@
         android:layout_width="match_parent"
         android:layout_height="wrap_content"
         android:layout_marginTop="14dp"
+        android:clipToPadding="false"
+        android:paddingHorizontal="24dp"
         android:visibility="gone" />
 
     <LinearLayout