Я хотел бы добиться такого дизайна (стрелка и овал должны иметь одинаковый цвет)
Я добился этого, сложив две коробки
@Composable частное развлечение Pin() { Столбец { Коробка( модификатор = Модификатор .wrapContentSize() .фон( цвет = цвет булавки, форма = RoundedCornerShape (размер = 100.dp) ) ) { Ряд( модификатор = Модификатор .padding(6.dp) .align(Выравнивание.Центр) ) { Икона( модификатор = Modifier.align(Alignment.CenterVertically), художник = icon.painter, ) Текст( текст = "2", модификатор = modifier.padding(начало = 2.dp, конец = 2.dp) ) } } Коробка( модификатор = Модификатор .align(Alignment.CenterHorizontally) .размер( ширина = 12.дп, высота = 8.дп ) .offset(y = - 4.dp) .clip(форма = TriangleShape()) .background(color = pinColor) ) } } Результат такой. Поскольку фон имеет альфу, перекрывающаяся часть смешивает цвета.
Мне удалось это исправить, добавив graphicsLayer(alpha = 0.99f) к Trianagle из этого решения. Проблема в том, что теперь видна линия, разделяющая два поля.
Коробка( модификатор = Модификатор .graphicsLayer(альфа = 0,99f) .align(Alignment.CenterHorizontally) .размер( ширина = 12.дп, высота = 8.дп ) .offset(y = - 4.dp) .clip(форма = TriangleShape()) .background(color = pinColor) )
Есть ли способ добиться того же результата, не видя границы между двумя прямоугольниками? Может ли использование Canvas стать решением?
