1. 공통으로 전달할 데이터 만들기

Screenshot_20240405_094859_Settings.jpg

마이페이지에는 위와 같은 연속된 탭이 반복 된다.

탭 구성에는 title, description, 우측 버튼 여부/종류로 다양하게 탭이 구성 되어있기때문에 공통으로 사용해야겠다고 생각했다!

BlueComposeComponent.kt

@Composable
fun BlueTitleWhite(text: String = "") {
    Text(
        text = text,
        fontSize = 16.sp,
        fontFamily = nanumsquare,
        fontWeight = FontWeight.Bold,
        style = YafitTextStyle(
            color = Color.White,
        )
    )
}

@Composable
fun BlueExplanation(modifier: Modifier = Modifier, text: String = "") {
    Text(
        text = text,
        fontSize = 12.sp,
        fontFamily = nanumsquare,
        fontWeight = FontWeight.Medium,
        style = YafitTextStyle(
            color = Color.Gray,
        ),
        modifier = modifier
    )
}

@Composable
fun BlueRightArrow(
    modifier: Modifier
) {
    Image(
        painter = painterResource(id = R.drawable.btn_arrow),
        contentDescription = "",
        modifier = modifier
    )
}

@Composable
fun BlueSwitch(
    modifier: Modifier = Modifier,
    isChecked: Boolean,
    onCheckedChange: (Boolean) -> Unit = {},
) {
    Switch(
        checked = isChecked,
        onCheckedChange = { onCheckedChange.invoke(it) },
        colors = SwitchDefaults.colors(
            checkedThumbColor = Color.Green,
            uncheckedThumbColor = Color.White,
            checkedTrackColor = Color.Gray,
            uncheckedTrackColor = Color.Gray
        ),
        modifier = modifier
            .width(34.dp)
            .height(20.dp)
    )
}