sayang_android's questions

No VS Code, você pode usar CTRL+ Spacepara acionar sugestão (pelo menos é o que eu uso para o comando Trigger Suggest ). O comando mostrará a sugestão; por exemplo, usá-lo em um objeto mostrará seu método e propriedades.

Também mostrará a dica de tipo apenas para a sugestão atualmente selecionada. Como posso mostrar todas as dicas de tipo para todas as sugestões?

Como fazer notas de piano como esta imagem abaixo:

Deve ter texto e clicável.

Aqui está o que eu tentei:

PianoNotes.kt

const val NUM_NOTES = 7
const val DIVIDER_WIDTH = 5

@Composable
fun PianoNotes(modifier: Modifier = Modifier) {
    val config = LocalConfiguration.current
    val screenWidth = config.screenWidthDp.dp
    val screenHeight = config.screenHeightDp.dp

    Row {
        repeat(NUM_NOTES) { ithNotes -> // 0 indexed
            // NUM_NOTES - 1 because we don't use divider on last notes
            val dividerOffset = (DIVIDER_WIDTH * NUM_NOTES - 1).dp
            val singleNotesWidth = (screenWidth - dividerOffset) / NUM_NOTES

            NaturalNotes(
                size = DpSize(width = singleNotesWidth, height = screenHeight),
                ithNotes = ithNotes,
            )

            // we don't need divider on the last notes
            if (ithNotes != NUM_NOTES - 1) {
                VerticalDivider(
                    modifier = modifier.fillMaxHeight(),
                    thickness = DIVIDER_WIDTH.dp,
                    color = Color.Black
                )
            }

            // sharp notes doesn't exist on the third divider
            // we don't even have divider on 6th note
            if (ithNotes != 2 && ithNotes != 6) {
                SharpNotes(
                    size = DpSize(60.dp, 2 * screenHeight / 3),
                    ithNotes = ithNotes,
                )
            }

        }
    }
}

NaturalNotes.kt

@Composable
fun NaturalNotes(modifier: Modifier = Modifier, size: DpSize, ithNotes: Int) {
    Box(
        modifier = modifier
            .background(Color.White)
            .size(size.width, size.height)
            .clickable {
                Log.e(
                    "TAG",
                    PianoConstants.getNaturalNoteFromNumber(ithNotes + 1)
                )
            },
        contentAlignment = Alignment.BottomCenter
    ) {
        Text(
            text = PianoConstants.getNaturalNoteFromNumber(ithNotes + 1),
            fontSize = 36.sp,
            fontWeight = FontWeight.ExtraBold,
            modifier = modifier.padding(bottom = 20.dp)
        )
    }
}

SharpNotes.kt

@Composable
fun SharpNotes(modifier: Modifier = Modifier, size: DpSize, ithNotes: Int) {
    Box(
        modifier = modifier
            .background(Color.Black)
            .size(size.width, size.height)
            .clickable {
                Log.e(
                    "TAG",
                    PianoConstants.getSharpNoteFromNumber(ithNotes + 1)
                )
            },
        contentAlignment = Alignment.BottomCenter
    ) {
        Text(
            text = PianoConstants.getSharpNoteFromNumber(ithNotes + 1),
            fontSize = 36.sp,
            fontWeight = FontWeight.ExtraBold,
            color = Color.White,
            modifier = modifier.padding(bottom = 20.dp)
        )
    }
}

Isso resultou em:

As notas sustenidas ocupam espaço e não se sobrepõem à divisória. Outro método que tentei é embrulhar VerticalDividere SharpNotesem uma caixa e usar deslocamento, mas ainda deixa um espaço vazio.

PianoConstantsnada mais é do que uma classe que me dá um texto para mostrar nas notas