Skip to content

Commit 626487e

Browse files
l5x5ll5x5l
committed
CHORE: 기존 감정구슬 선택, 추천 루틴 화면를 emotion/component/template으로 이동
1 parent 66543dd commit 626487e

3 files changed

Lines changed: 266 additions & 243 deletions

File tree

‎presentation/src/main/java/com/threegap/bitnagil/presentation/emotion/EmotionScreen.kt‎

Lines changed: 3 additions & 243 deletions
Original file line numberDiff line numberDiff line change
@@ -1,50 +1,15 @@
11
package com.threegap.bitnagil.presentation.emotion
22

33
import androidx.activity.compose.BackHandler
4-
import androidx.compose.foundation.background
5-
import androidx.compose.foundation.layout.Arrangement
6-
import androidx.compose.foundation.layout.Column
7-
import androidx.compose.foundation.layout.Spacer
8-
import androidx.compose.foundation.layout.aspectRatio
9-
import androidx.compose.foundation.layout.fillMaxSize
10-
import androidx.compose.foundation.layout.fillMaxWidth
11-
import androidx.compose.foundation.layout.height
12-
import androidx.compose.foundation.layout.padding
13-
import androidx.compose.foundation.layout.statusBarsPadding
14-
import androidx.compose.foundation.lazy.grid.GridCells
15-
import androidx.compose.foundation.lazy.grid.LazyVerticalGrid
16-
import androidx.compose.foundation.lazy.grid.items
17-
import androidx.compose.foundation.rememberScrollState
18-
import androidx.compose.foundation.verticalScroll
19-
import androidx.compose.material3.Text
204
import androidx.compose.runtime.Composable
215
import androidx.compose.runtime.collectAsState
226
import androidx.compose.runtime.getValue
23-
import androidx.compose.ui.Alignment
24-
import androidx.compose.ui.Modifier
25-
import androidx.compose.ui.graphics.Color
26-
import androidx.compose.ui.platform.LocalContext
27-
import androidx.compose.ui.res.painterResource
28-
import androidx.compose.ui.text.style.TextAlign
29-
import androidx.compose.ui.text.style.TextDecoration
30-
import androidx.compose.ui.tooling.preview.Preview
31-
import androidx.compose.ui.unit.dp
327
import androidx.hilt.navigation.compose.hiltViewModel
33-
import coil3.compose.AsyncImage
34-
import coil3.request.ImageRequest
35-
import coil3.request.crossfade
36-
import com.threegap.bitnagil.designsystem.BitnagilTheme
37-
import com.threegap.bitnagil.designsystem.component.atom.BitnagilSelectButton
38-
import com.threegap.bitnagil.designsystem.component.atom.BitnagilTextButton
39-
import com.threegap.bitnagil.designsystem.component.atom.BitnagilTextButtonColor
40-
import com.threegap.bitnagil.designsystem.component.block.BitnagilTopBar
41-
import com.threegap.bitnagil.designsystem.modifier.clickableWithoutRipple
428
import com.threegap.bitnagil.presentation.common.flow.collectAsEffect
43-
import com.threegap.bitnagil.presentation.emotion.model.EmotionRecommendRoutineUiModel
9+
import com.threegap.bitnagil.presentation.emotion.component.template.EmotionRecommendRoutineScreen
10+
import com.threegap.bitnagil.presentation.emotion.component.template.SimpleEmotionSelectionScreen
4411
import com.threegap.bitnagil.presentation.emotion.model.EmotionScreenStep
45-
import com.threegap.bitnagil.presentation.emotion.model.EmotionUiModel
4612
import com.threegap.bitnagil.presentation.emotion.model.mvi.EmotionSideEffect
47-
import com.threegap.bitnagil.presentation.emotion.model.mvi.EmotionState
4813

4914
@Composable
5015
fun EmotionScreenContainer(
@@ -64,7 +29,7 @@ fun EmotionScreenContainer(
6429
}
6530

6631
when (state.step) {
67-
EmotionScreenStep.Emotion -> EmotionScreen(
32+
EmotionScreenStep.Emotion -> SimpleEmotionSelectionScreen(
6833
state = state,
6934
onClickPreviousButton = navigateToBack,
7035
onClickEmotion = viewModel::selectEmotion,
@@ -77,208 +42,3 @@ fun EmotionScreenContainer(
7742
)
7843
}
7944
}
80-
81-
@Composable
82-
private fun EmotionScreen(
83-
state: EmotionState,
84-
onClickPreviousButton: () -> Unit,
85-
onClickEmotion: (String) -> Unit,
86-
) {
87-
Column(
88-
modifier = Modifier
89-
.fillMaxSize()
90-
.background(color = BitnagilTheme.colors.white)
91-
.statusBarsPadding(),
92-
horizontalAlignment = Alignment.CenterHorizontally,
93-
) {
94-
BitnagilTopBar(
95-
showBackButton = true,
96-
onBackClick = onClickPreviousButton,
97-
)
98-
99-
Spacer(modifier = Modifier.height(32.dp))
100-
101-
Text(
102-
"오늘의 감정구슬을 골라보세요",
103-
style = BitnagilTheme.typography.title2Bold.copy(color = BitnagilTheme.colors.navy500),
104-
textAlign = TextAlign.Center,
105-
)
106-
107-
Spacer(modifier = Modifier.height(6.dp))
108-
109-
Text(
110-
"감정구슬을 등록하면 루틴을 추천받아요!",
111-
style = BitnagilTheme.typography.subtitle1Regular.copy(color = BitnagilTheme.colors.navy300),
112-
textAlign = TextAlign.Center,
113-
)
114-
115-
Spacer(modifier = Modifier.height(64.dp))
116-
117-
LazyVerticalGrid(
118-
columns = GridCells.Fixed(3),
119-
modifier = Modifier.padding(horizontal = 24.dp),
120-
horizontalArrangement = Arrangement.spacedBy(12.dp),
121-
verticalArrangement = Arrangement.spacedBy(28.dp),
122-
) {
123-
items(state.emotionTypeUiModels) { emotion ->
124-
Column(
125-
modifier = Modifier
126-
.clickableWithoutRipple { onClickEmotion(emotion.emotionType) },
127-
horizontalAlignment = Alignment.CenterHorizontally,
128-
) {
129-
AsyncImage(
130-
model = ImageRequest.Builder(LocalContext.current)
131-
.data(emotion.imageUrl)
132-
.crossfade(true)
133-
.build(),
134-
modifier = Modifier.aspectRatio(1f),
135-
contentDescription = null,
136-
error = emotion.offlineBackupImageResourceId?.let { painterResource(it) },
137-
)
138-
139-
Text(
140-
text = emotion.emotionMarbleName,
141-
style = BitnagilTheme.typography.body1Regular.copy(color = BitnagilTheme.colors.coolGray20),
142-
)
143-
}
144-
}
145-
}
146-
}
147-
}
148-
149-
@Composable
150-
private fun EmotionRecommendRoutineScreen(
151-
state: EmotionState,
152-
onClickRoutine: (String) -> Unit,
153-
onClickRegisterRecommendRoutines: () -> Unit,
154-
onClickSkip: () -> Unit,
155-
) {
156-
Column(
157-
modifier = Modifier
158-
.fillMaxSize()
159-
.background(color = BitnagilTheme.colors.coolGray99)
160-
.statusBarsPadding()
161-
.padding(start = 16.dp, end = 16.dp, bottom = 20.dp, top = 32.dp),
162-
) {
163-
Spacer(modifier = Modifier.height(54.dp))
164-
165-
Text(
166-
text = "오늘 감정에 따른\n루틴을 추천드릴께요!",
167-
color = BitnagilTheme.colors.navy500,
168-
style = BitnagilTheme.typography.title2Bold,
169-
)
170-
171-
Spacer(modifier = Modifier.height(10.dp))
172-
173-
Text(
174-
text = "오늘 당신의 감정 상태에 맞춰 구성된 맞춤 루틴이에요.\n원하는 루틴을 선택해서 가볍게 시작해보세요.",
175-
color = BitnagilTheme.colors.coolGray50,
176-
style = BitnagilTheme.typography.body2Medium,
177-
)
178-
179-
Spacer(modifier = Modifier.height(28.dp))
180-
181-
val scrollState = rememberScrollState()
182-
Column(
183-
modifier = Modifier
184-
.weight(1f)
185-
.verticalScroll(state = scrollState),
186-
) {
187-
for (recommendRoutine in state.recommendRoutines) {
188-
BitnagilSelectButton(
189-
title = recommendRoutine.name,
190-
description = recommendRoutine.description,
191-
onClick = { onClickRoutine(recommendRoutine.id) },
192-
selected = recommendRoutine.selected,
193-
modifier = Modifier.padding(bottom = 12.dp),
194-
)
195-
}
196-
}
197-
198-
Spacer(modifier = Modifier.height(12.dp))
199-
200-
BitnagilTextButton(
201-
text = "변경하기",
202-
onClick = onClickRegisterRecommendRoutines,
203-
enabled = state.registerRecommendRoutinesButtonEnabled,
204-
modifier = Modifier.fillMaxWidth(),
205-
)
206-
207-
Spacer(modifier = Modifier.height(10.dp))
208-
209-
BitnagilTextButton(
210-
text = "건너뛰기",
211-
onClick = onClickSkip,
212-
colors = BitnagilTextButtonColor.skip().copy(
213-
defaultBackgroundColor = Color.Transparent,
214-
pressedBackgroundColor = Color.Transparent,
215-
disabledBackgroundColor = Color.Transparent,
216-
),
217-
textStyle = BitnagilTheme.typography.body2Regular,
218-
textDecoration = TextDecoration.Underline,
219-
modifier = Modifier.fillMaxWidth(),
220-
)
221-
}
222-
}
223-
224-
@Preview
225-
@Composable
226-
private fun EmotionScreenPreview() {
227-
BitnagilTheme {
228-
EmotionScreen(
229-
state = EmotionState(
230-
emotionTypeUiModels = listOf(
231-
EmotionUiModel(
232-
emotionType = "emotionType",
233-
imageUrl = "https://bitnagil-s3.s3.ap-northeast-2.amazonaws.com/home_satisfaction.png",
234-
emotionMarbleName = "emotionMarbleName",
235-
offlineBackupImageResourceId = null,
236-
),
237-
EmotionUiModel(
238-
emotionType = "emotionType",
239-
imageUrl = "https://bitnagil-s3.s3.ap-northeast-2.amazonaws.com/home_satisfaction.png",
240-
emotionMarbleName = "emotionMarbleName",
241-
offlineBackupImageResourceId = null,
242-
),
243-
),
244-
isLoading = false,
245-
step = EmotionScreenStep.Emotion,
246-
recommendRoutines = listOf(),
247-
),
248-
onClickEmotion = { _ -> },
249-
onClickPreviousButton = {},
250-
)
251-
}
252-
}
253-
254-
@Preview
255-
@Composable
256-
private fun EmotionRecommendRoutineScreenPreview() {
257-
BitnagilTheme {
258-
EmotionRecommendRoutineScreen(
259-
state = EmotionState(
260-
emotionTypeUiModels = listOf(
261-
EmotionUiModel(
262-
emotionType = "emotionType",
263-
imageUrl = "https://bitnagil-s3.s3.ap-northeast-2.amazonaws.com/home_satisfaction.png",
264-
emotionMarbleName = "emotionMarbleName",
265-
offlineBackupImageResourceId = null,
266-
),
267-
),
268-
isLoading = false,
269-
step = EmotionScreenStep.RecommendRoutines,
270-
recommendRoutines = listOf(
271-
EmotionRecommendRoutineUiModel(
272-
id = "1",
273-
name = "루틴 이름",
274-
description = "루틴 설명",
275-
selected = true,
276-
),
277-
),
278-
),
279-
onClickRoutine = {},
280-
onClickRegisterRecommendRoutines = {},
281-
onClickSkip = {},
282-
)
283-
}
284-
}

0 commit comments

Comments
 (0)