Задать вопрос
@SomeDude1314

Как сделать такую карточку?

день добрый, я сел разрабатывать приложение и когда дошёл до уведомлений по макету то столкнулся с проблемой я не могу понять как мне сделать такую карточку
67bebe3e4d7d9287730101.jpeg

я написал но она не такая как надо вся проблема в круге у меня у контейнера padding
мой код:

@Preview
@Composable
fun previewCard() {
    val configuration = LocalConfiguration.current
    val screenWidth = configuration.screenWidthDp
    val screenHeight = configuration.screenHeightDp
    val scale = min(screenWidth / 320f, screenHeight / 640f)

    Box(
        modifier = Modifier
            .fillMaxWidth()
            .clip(RoundedCornerShape(16.dp * scale))
            .background(Color(0xFFF8F8FA))
    ) {
        Box(
            modifier = Modifier
                .size(24.dp * scale)
                .align(Alignment.TopEnd)
                .offset(x = (12).dp * scale, y = (-12).dp * scale)
                .background(Color.White, shape = CircleShape),
            contentAlignment = Alignment.Center
        ) {
            Box(
                modifier = Modifier
                    .size(16.dp * scale)
                    .background(Color(0xFF8DD627), shape = CircleShape)
            )
        }
        Column(
            modifier = Modifier.padding(
                top = 14.dp * scale,
                start = 18.dp * scale, end = 18.dp * scale, bottom = 14.dp * scale
            )
        ) {
            Text(
                text = "Комментарий",
                style = ManropeStyles.BoldTextStyle.copy(
                    fontSize = 14.sp * scale,
                    color = Color(0xFF555861)
                )
            )
            Spacer(modifier = Modifier.height(6.dp * scale))

            Text(
                text = buildAnnotatedString {
                    append("Пользователь ")

                    withStyle(style = SpanStyle(color = Color(0xFF5A87E0))) {
                        append("Кот без усов ")
                    }

                    append("оставил комментарий под записью ")

                    withStyle(style = SpanStyle(color = Color(0xFF5A87E0))) {
                        append("Изучение k-on")
                    }
                },
                style = ManropeStyles.SemiBoldTextStyle.copy(
                    fontSize = 10.sp * scale,
                    color = Color(0XFF858994)
                )
            )
            Spacer(modifier = Modifier.height(12.dp * scale))

            Row(
                modifier = Modifier.fillMaxWidth(),
                horizontalArrangement = Arrangement.End,
                verticalAlignment = Alignment.CenterVertically
            ) {

                Spacer(modifier = Modifier.width(4.dp * scale))
                Text(
                    text = "8 часов назад",
                    style = ManropeStyles.MediumTextStyle.copy(
                        fontSize = 10.sp * scale,
                        color = Color(0XFF858994)
                    )
                )
            }
        }
    }
}

буду благодарен если поможете, спасибо
  • Вопрос задан
  • 51 просмотр
Подписаться 1 Простой Комментировать
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы