라이브 방 룰렛 설정 - 미리보기 다이얼로그 추가

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

@@ -0,0 +1,11 @@
+package kr.co.vividnext.sodalive.live.roulette
+
+data class RoulettePreview(
+    val can: Int,
+    val items: List<RoulettePreviewItem>
+)
+
+data class RoulettePreviewItem(
+    val title: String,
+    val percent: String
+)

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

@@ -0,0 +1,88 @@
+package kr.co.vividnext.sodalive.live.roulette
+
+import android.annotation.SuppressLint
+import android.graphics.Color
+import android.graphics.drawable.ColorDrawable
+import android.view.LayoutInflater
+import android.view.View
+import android.view.Window
+import android.view.WindowManager
+import android.widget.TextView
+import androidx.appcompat.app.AlertDialog
+import androidx.fragment.app.FragmentActivity
+import kr.co.vividnext.sodalive.R
+import kr.co.vividnext.sodalive.databinding.DialogRoulettePreviewBinding
+import kr.co.vividnext.sodalive.extensions.dpToPx
+
+class RoulettePreviewDialog(
+    private val activity: FragmentActivity,
+    private val preview: RoulettePreview,
+    private val title: String = "",
+    private val onClickSpin: (() -> Unit)? = null,
+    layoutInflater: LayoutInflater
+) {
+    private val alertDialog: AlertDialog
+    private val dialogView = DialogRoulettePreviewBinding.inflate(layoutInflater)
+
+    init {
+        val dialogBuilder = AlertDialog.Builder(activity)
+        dialogBuilder.setView(dialogView.root)
+
+        alertDialog = dialogBuilder.create()
+        alertDialog.setCancelable(false)
+        alertDialog.requestWindowFeature(Window.FEATURE_NO_TITLE)
+        alertDialog.window?.setBackgroundDrawable(ColorDrawable(Color.TRANSPARENT))
+
+        setupView()
+    }
+
+    fun show() {
+        alertDialog.show()
+
+        val lp = WindowManager.LayoutParams()
+        lp.copyFrom(alertDialog.window?.attributes)
+        lp.width = activity.resources.displayMetrics.widthPixels - (26.7f.dpToPx()).toInt()
+        lp.height = WindowManager.LayoutParams.WRAP_CONTENT
+
+        alertDialog.window?.attributes = lp
+    }
+
+    @SuppressLint("SetTextI18n")
+    private fun setupView() {
+        dialogView.tvCancel.setOnClickListener { alertDialog.dismiss() }
+
+        dialogView.tvSpinRoulette.text = "${preview.can}캔으로 룰렛 돌리기"
+        dialogView.tvSpinRoulette.setOnClickListener {
+            if (onClickSpin != null) {
+                onClickSpin!!()
+            }
+
+            alertDialog.dismiss()
+        }
+
+        dialogView.tvTitle.text = title.ifBlank { "룰렛" }
+
+        preview.items.forEachIndexed { index, item ->
+            dialogView.llRouletteOptionContainer.addView(createOptionView(index, item))
+        }
+    }
+
+    @SuppressLint("SetTextI18n")
+    private fun createOptionView(index: Int, item: RoulettePreviewItem): View {
+        val itemView = LayoutInflater
+            .from(activity)
+            .inflate(
+                R.layout.layout_roulette_preview_item,
+                dialogView.llRouletteOptionContainer,
+                false
+            )
+
+        val tvItemTitle = itemView.findViewById<TextView>(R.id.tv_roulette_item_title)
+        val tvOrder = itemView.findViewById<TextView>(R.id.tv_order)
+
+        tvItemTitle.text = "${item.title} (${item.percent})"
+        tvOrder.text = "${index + 1}"
+
+        return itemView
+    }
+}

app/src/main/java/kr/co/vividnext/sodalive/live/roulette/config/RouletteSettingsFragment.kt

@@ -5,6 +5,8 @@ import android.app.Activity
 import android.app.Service
 import android.content.Intent
 import android.os.Bundle
+import android.os.Handler
+import android.os.Looper
 import android.text.InputFilter
 import android.view.LayoutInflater
 import android.view.View
@@ -20,6 +22,7 @@ import kr.co.vividnext.sodalive.base.BaseFragment
 import kr.co.vividnext.sodalive.common.Constants
 import kr.co.vividnext.sodalive.common.LoadingDialog
 import kr.co.vividnext.sodalive.databinding.FragmentRouletteSettingsBinding
+import kr.co.vividnext.sodalive.live.roulette.RoulettePreviewDialog
 import org.koin.android.ext.android.inject
 import java.util.concurrent.TimeUnit
 
@@ -31,6 +34,8 @@ class RouletteSettingsFragment : BaseFragment<FragmentRouletteSettingsBinding>(
     private lateinit var imm: InputMethodManager
     private lateinit var loadingDialog: LoadingDialog
 
+    private val handler = Handler(Looper.getMainLooper())
+
     override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
         super.onViewCreated(view, savedInstanceState)
 
@@ -59,11 +64,16 @@ class RouletteSettingsFragment : BaseFragment<FragmentRouletteSettingsBinding>(
         binding.ivAddOption.setOnClickListener { addOption() }
 
         binding.tvPreview.setOnClickListener {
-
+            handler.postDelayed({
+                imm.hideSoftInputFromWindow(view?.windowToken, 0)
+            }, 100)
+            viewModel.onClickPreview()
         }
 
         binding.tvSave.setOnClickListener { _ ->
+            handler.postDelayed({
                 imm.hideSoftInputFromWindow(view?.windowToken, 0)
+            }, 100)
             viewModel.createOrUpdateRoulette {
                 val resultIntent = Intent().apply { putExtra(Constants.EXTRA_RESULT_ROULETTE, it) }
                 requireActivity().setResult(Activity.RESULT_OK, resultIntent)
@@ -93,6 +103,15 @@ class RouletteSettingsFragment : BaseFragment<FragmentRouletteSettingsBinding>(
             }
         }
 
+        viewModel.roulettePreviewLiveData.observe(viewLifecycleOwner) {
+            RoulettePreviewDialog(
+                activity = requireActivity(),
+                preview = it,
+                title = "룰렛 미리보기",
+                layoutInflater = layoutInflater
+            ).show()
+        }
+
         compositeDisposable.add(
             binding.etSetPrice.textChanges().skip(1)
                 .debounce(100, TimeUnit.MILLISECONDS)

app/src/main/java/kr/co/vividnext/sodalive/live/roulette/config/RouletteSettingsViewModel.kt

@@ -8,6 +8,8 @@ import io.reactivex.rxjava3.schedulers.Schedulers
 import kr.co.vividnext.sodalive.base.BaseViewModel
 import kr.co.vividnext.sodalive.common.SharedPreferenceManager
 import kr.co.vividnext.sodalive.live.roulette.RouletteItem
+import kr.co.vividnext.sodalive.live.roulette.RoulettePreview
+import kr.co.vividnext.sodalive.live.roulette.RoulettePreviewItem
 import kr.co.vividnext.sodalive.live.roulette.RouletteRepository
 
 class RouletteSettingsViewModel(private val repository: RouletteRepository) : BaseViewModel() {
@@ -32,6 +34,10 @@ class RouletteSettingsViewModel(private val repository: RouletteRepository) : Ba
     val canLiveData: LiveData<Int>
         get() = _canLiveData
 
+    private val _roulettePreviewLiveData = MutableLiveData<RoulettePreview>()
+    val roulettePreviewLiveData: LiveData<RoulettePreview>
+        get() = _roulettePreviewLiveData
+
     private val options = mutableListOf<RouletteOption>()
     var can = 5
     var isActive = false
@@ -73,6 +79,8 @@ class RouletteSettingsViewModel(private val repository: RouletteRepository) : Ba
         val updatedOptions = options.asSequence().map { option ->
             option.copy(percentage = (option.weight.toDouble() / totalWeight * 100).toInt())
         }.toList()
+
+        removeAllAndAddOptions(updatedOptions)
         _optionsLiveData.value = updatedOptions
     }
 
@@ -81,6 +89,24 @@ class RouletteSettingsViewModel(private val repository: RouletteRepository) : Ba
         _isActiveLiveData.postValue(isActive)
     }
 
+    fun onClickPreview() {
+        _isLoading.value = true
+
+        val items = mutableListOf<RoulettePreviewItem>()
+        for (option in options) {
+            if (option.title.trim().isEmpty()) {
+                _toastLiveData.value = "옵션은 빈칸을 할 수 없습니다."
+                _isLoading.value = false
+                return
+            }
+
+            items.add(RoulettePreviewItem(option.title, "${option.percentage}%"))
+        }
+
+        _roulettePreviewLiveData.postValue(RoulettePreview(can, items))
+        _isLoading.value = false
+    }
+
     fun createOrUpdateRoulette(onSuccess: (Boolean) -> Unit) {
         if (!_isLoading.value!!) {
             _isLoading.value = true

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

@@ -0,0 +1,83 @@
+<?xml version="1.0" encoding="utf-8"?>
+<LinearLayout 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="match_parent"
+    android:layout_height="wrap_content"
+    android:layout_gravity="center"
+    android:background="@drawable/bg_round_corner_16_7_222222"
+    android:orientation="vertical"
+    android:padding="13.3dp">
+
+    <RelativeLayout
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        android:layout_marginTop="16.7dp"
+        android:paddingHorizontal="13.3dp">
+
+        <TextView
+            android:id="@+id/tv_title"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:fontFamily="@font/gmarket_sans_bold"
+            android:textColor="@color/white"
+            android:textSize="18.3sp" />
+
+        <TextView
+            android:id="@+id/tv_can"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:layout_alignParentEnd="true"
+            android:drawablePadding="6.7dp"
+            android:fontFamily="@font/gmarket_sans_bold"
+            android:gravity="center"
+            android:textColor="@color/color_eeeeee"
+            android:textSize="16sp"
+            android:visibility="gone"
+            app:drawableEndCompat="@drawable/ic_forward"
+            app:drawableStartCompat="@drawable/ic_can"
+            tools:ignore="RelativeOverlap"
+            tools:text="0" />
+    </RelativeLayout>
+
+    <LinearLayout
+        android:id="@+id/ll_roulette_option_container"
+        android:layout_width="match_parent"
+        android:layout_height="wrap_content"
+        android:orientation="vertical"
+        android:padding="13.3dp" />
+
+    <LinearLayout
+        android:layout_width="match_parent"
+        android:layout_height="wrap_content"
+        android:layout_marginTop="26.7dp"
+        android:orientation="horizontal">
+
+        <TextView
+            android:id="@+id/tv_cancel"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:background="@drawable/bg_round_corner_10_transparent_3bb9f1"
+            android:fontFamily="@font/gmarket_sans_bold"
+            android:gravity="center"
+            android:paddingHorizontal="18dp"
+            android:paddingVertical="16dp"
+            android:text="취소"
+            android:textColor="@color/color_3bb9f1"
+            android:textSize="18.3sp" />
+
+        <TextView
+            android:id="@+id/tv_spin_roulette"
+            android:layout_width="0dp"
+            android:layout_height="wrap_content"
+            android:layout_marginStart="13.3dp"
+            android:layout_weight="1"
+            android:background="@drawable/bg_round_corner_10_3bb9f1"
+            android:fontFamily="@font/gmarket_sans_bold"
+            android:gravity="center"
+            android:paddingVertical="16dp"
+            android:textColor="@color/white"
+            android:textSize="18.3sp"
+            tools:text="100캔으로 룰렛 돌리기" />
+    </LinearLayout>
+</LinearLayout>

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

@@ -0,0 +1,27 @@
+<?xml version="1.0" encoding="utf-8"?>
+<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:tools="http://schemas.android.com/tools"
+    android:layout_width="match_parent"
+    android:layout_height="wrap_content"
+    android:layout_marginTop="13.3dp"
+    tools:background="@color/black">
+
+    <TextView
+        android:id="@+id/tv_order"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        android:fontFamily="@font/gmarket_sans_bold"
+        android:textColor="@color/color_e2e2e2"
+        android:textSize="14.7sp"
+        tools:text="1" />
+
+    <TextView
+        android:id="@+id/tv_roulette_item_title"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        android:layout_marginStart="13.3dp"
+        android:fontFamily="@font/gmarket_sans_medium"
+        android:textColor="@color/color_e2e2e2"
+        android:textSize="14.7sp"
+        tools:text="힝구 (40%)" />
+</LinearLayout>