Nutri Capture 프론트엔드 - '피자' 아이콘 임시 적용

#1 커스텀 아이콘 임시 적용

#1-1 커스텀 아이콘

Nutri Capture 프론트엔드 - '피자' 아이콘 구현

이전에 만든 아이콘이다. 만들었으니, 우선 본 프로젝트에 적용부터 해봤다.

 

#1-2 임시 적용 코드

...

@Composable
fun NutrientBottomSheet(
    viewModel: NutrientViewModel = hiltViewModel()
) {
    val inputtedDayMeal = viewModel.nutrientScreenState.collectAsState().value.inputtedDayMeal

    NutrientInputKeyboard(
        modifier = Modifier.fillMaxSize(), inputtedDayMeal = inputtedDayMeal
    )
}

@Composable
fun NutrientInputKeyboard(
    modifier: Modifier = Modifier,
    inputtedDayMeal: DayMeal,
) {
    LazyVerticalGrid(
        columns = GridCells.Adaptive(minSize = 100.dp),
        modifier = Modifier.fillMaxSize(),
        contentPadding = PaddingValues(12.dp),
        verticalArrangement = Arrangement.spacedBy(12.dp),
        horizontalArrangement = Arrangement.SpaceBetween
    ) {
        items(
            11 // TODO: inputtedDayMeal.nutritionInfo의 각 프로퍼티만큼 item 생성
        ) {
            Box(
                modifier = Modifier
                    .fillMaxSize()
                    .border(width = 1.dp, color = Color.Black),
                contentAlignment = Alignment.Center
            ) {
                ResponsiveArcSurroundedIconButton(
                    imageVector = Icons.Sharp.Done,
                    contentDescription = "test",
                    currentLevel = 2,
                    maxLevel = 3,
                    arcColor = Color.Yellow,
                    arcWidth = 15
                ) {
                    // TODO: inputtedDayMeal의 값을 변경하는 event
                }
            }
        }
    }
}

여기까지 하고 Commit하기로 결심했다. 왜냐하면, 백엔드적으로 리팩토링할 부분이 상당하다는 걸 알았기 때문이다. 여기서 멈추지 않으면 스파게티 코드가 되버릴 거라는 직감이 들었다.

 

#1-3 스크린샷

임시 코드지만 그럭저럭 잘 표시된다. 코드 리팩토링 후에 더 다듬어보겠다.

 

#2 완성된 앱

#2-1 이 게시글 시점의 Commit

GitHub - Kanmanemone/nutri-capture-new

 

#2-2 본 프로젝트의 가장 최신 Commit

GitHub - Kanmanemone/nutri-capture-new