#178 [ui] 테마 선택 뷰 UI 변경

Team-Sopetit · Jun 24, 2024 · 70a1d15 · 70a1d15
1 parent 01e3f2d
commit 70a1d15
Show file tree

Hide file tree

Showing 5 changed files with 55 additions and 42 deletions.
diff --git a/app/src/main/java/com/sopetit/softie/ui/onboarding/themechoice/ChoiceThemeAdapter.kt b/app/src/main/java/com/sopetit/softie/ui/onboarding/themechoice/ChoiceThemeAdapter.kt
@@ -81,11 +81,11 @@ class ChoiceThemeAdapter :
     ) {
         when (selected) {
             true -> {
-                binding.ivThemeBackground.setBackgroundResource(R.drawable.shape_gray200_fill_gray500_stroke_100_circle)
+                binding.layoutThemeBackground.setBackgroundResource(R.drawable.shape_gray200_fill_gray650_stroke_99_rect)
             }
 
             false -> {
-                binding.ivThemeBackground.setBackgroundResource(R.drawable.shape_gray0_fill_gray200_stroke_100_circle)
+                binding.layoutThemeBackground.setBackgroundResource(R.drawable.shape_gray0_fill_gray200_stroke_99_rect)
             }
         }
     }

diff --git a/app/src/main/java/com/sopetit/softie/ui/onboarding/themechoice/ChoiceThemeFragment.kt b/app/src/main/java/com/sopetit/softie/ui/onboarding/themechoice/ChoiceThemeFragment.kt
@@ -4,7 +4,6 @@ import android.os.Bundle
 import android.view.View
 import androidx.fragment.app.viewModels
 import androidx.lifecycle.ViewModelProvider
-import androidx.recyclerview.widget.GridLayoutManager
 import com.sopetit.softie.R
 import com.sopetit.softie.databinding.FragmentOnboardingChoiceThemeBinding
 import com.sopetit.softie.ui.onboarding.OnboardingActivity.Companion.MAXIMUM_THEME_SELECTION
@@ -38,10 +37,8 @@ class ChoiceThemeFragment :
     private fun initMakeThemeAdapter() {
         _choiceThemeAdapter = ChoiceThemeAdapter()
 //        themeViewModel.getThemeList()
-        binding.rvOnboardingChoiceTheme.apply {
-            layoutManager = GridLayoutManager(requireContext(), 3)
-            adapter = choiceThemeAdapter
-        }
+
+        binding.rvOnboardingChoiceTheme.adapter = choiceThemeAdapter
 
         setThemeList()
         selectThemes()

diff --git a/app/src/main/res/drawable/shape_gray200_fill_gray650_stroke_99_rect.xml b/app/src/main/res/drawable/shape_gray200_fill_gray650_stroke_99_rect.xml
@@ -0,0 +1,8 @@
+<?xml version="1.0" encoding="utf-8"?>
+<shape xmlns:android="http://schemas.android.com/apk/res/android"
+    android:shape="rectangle">
+    <solid android:color="@color/gray200"/>
+    <stroke android:color="@color/gray650" android:width="1dp"/>
+    <corners android:radius="99dp"/>
+
+</shape>
diff --git a/app/src/main/res/layout/fragment_onboarding_choice_theme.xml b/app/src/main/res/layout/fragment_onboarding_choice_theme.xml
@@ -29,6 +29,9 @@
             android:layout_marginTop="34dp"
             android:layout_marginBottom="34dp"
             android:overScrollMode="never"
+            app:layoutManager="androidx.recyclerview.widget.LinearLayoutManager"
+            android:orientation="vertical"
+            android:foregroundGravity="center"
             app:layout_constraintBottom_toTopOf="@id/btn_onboarding_choice_theme"
             app:layout_constraintEnd_toEndOf="parent"
             app:layout_constraintStart_toStartOf="parent"

diff --git a/app/src/main/res/layout/item_onboarding_choice_theme.xml b/app/src/main/res/layout/item_onboarding_choice_theme.xml
@@ -1,6 +1,7 @@
 <?xml version="1.0" encoding="utf-8"?>
 <layout xmlns:android="http://schemas.android.com/apk/res/android"
-    xmlns:app="http://schemas.android.com/apk/res-auto">
+    xmlns:app="http://schemas.android.com/apk/res-auto"
+    xmlns:tools="http://schemas.android.com/tools">
 
     <data>
 
@@ -11,42 +12,46 @@
     </data>
 
     <androidx.constraintlayout.widget.ConstraintLayout
-        android:layout_width="wrap_content"
-        android:layout_height="wrap_content"
-        android:paddingHorizontal="10dp">
-
-        <ImageView
-            android:id="@+id/iv_theme_background"
-            android:layout_width="70dp"
-            android:layout_height="70dp"
-            android:background="@drawable/shape_gray0_fill_gray200_stroke_100_circle"
-            android:layout_marginHorizontal="18dp"
-            app:layout_constraintTop_toTopOf="parent"
-            app:layout_constraintStart_toStartOf="parent"
-            app:layout_constraintEnd_toEndOf="parent" />
-
-        <ImageView
-            android:id="@+id/iv_theme_icon"
-            android:layout_width="40dp"
-            android:layout_height="40dp"
-            app:layout_constraintTop_toTopOf="@id/iv_theme_background"
-            app:layout_constraintBottom_toBottomOf="@id/iv_theme_background"
-            app:layout_constraintStart_toStartOf="@id/iv_theme_background"
-            app:layout_constraintEnd_toEndOf="@id/iv_theme_background" />
-
-        <TextView
-            android:id="@+id/tv_theme_name"
+        android:layout_width="match_parent"
+        android:layout_height="wrap_content">
+
+        <androidx.constraintlayout.widget.ConstraintLayout
+            android:id="@+id/layout_theme_background"
             android:layout_width="wrap_content"
             android:layout_height="wrap_content"
-            android:text="@{item.name}"
-            android:textAppearance="@style/caption1"
-            android:textColor="@color/gray500"
-            android:layout_marginTop="9dp"
-            android:layout_marginBottom="30dp"
-            app:layout_constraintTop_toBottomOf="@id/iv_theme_background"
-            app:layout_constraintStart_toStartOf="@id/iv_theme_background"
-            app:layout_constraintEnd_toEndOf="@id/iv_theme_background"
-            app:layout_constraintBottom_toBottomOf="parent" />
+            android:background="@drawable/shape_gray0_fill_gray200_stroke_99_rect"
+            android:layout_marginVertical="4dp"
+            app:layout_constraintTop_toTopOf="parent"
+            app:layout_constraintBottom_toBottomOf="parent"
+            app:layout_constraintStart_toStartOf="parent"
+            app:layout_constraintEnd_toEndOf="parent">
+
+            <ImageView
+                android:id="@+id/iv_theme_icon"
+                android:layout_width="18dp"
+                android:layout_height="18dp"
+                android:layout_marginStart="20dp"
+                app:layout_constraintTop_toTopOf="@id/tv_theme_name"
+                app:layout_constraintBottom_toBottomOf="@id/tv_theme_name"
+                app:layout_constraintStart_toStartOf="parent" />
+
+            <TextView
+                android:id="@+id/tv_theme_name"
+                android:layout_width="wrap_content"
+                android:layout_height="wrap_content"
+                style="@style/body1"
+                android:text="@{item.name}"
+                android:textColor="@color/gray700"
+                android:layout_marginStart="6dp"
+                android:layout_marginEnd="20dp"
+                android:layout_marginVertical="14dp"
+                app:layout_constraintStart_toEndOf="@id/iv_theme_icon"
+                app:layout_constraintTop_toTopOf="parent"
+                app:layout_constraintBottom_toBottomOf="parent"
+                app:layout_constraintEnd_toEndOf="parent"
+                tools:text="좋은 관계 만들기" />
+
+        </androidx.constraintlayout.widget.ConstraintLayout>
 
     </androidx.constraintlayout.widget.ConstraintLayout>
 </layout>