Alix Blaine
Alix Blaine

Reputation: 821

Align Text below Image center correctly

   Box(modifier = Modifier.fillMaxSize(), contentAlignment = Alignment.BottomCenter){
        Image(
            painter = painterResource(R.drawable.background),
            contentDescription = null,
            modifier = Modifier.fillMaxSize(),
            contentScale = ContentScale.Crop
        )

        Box(modifier = Modifier
            .fillMaxSize()
            .padding(top = 120.dp),
            contentAlignment = Alignment.TopCenter,
            content = {
                Image(
                    painter = painterResource(R.drawable.logo),
                    contentDescription = null,
                    contentScale = ContentScale.FillBounds
                )
                Text("Medicine")
            }
        )
    }

The Text() component, appears above the logo, how to bring it down below? Aligning it center below with some padding.

EDIT: I tried this,

Text(modifier = Modifier.align(Alignment.Center).padding(0.dp),text = "Medicine")

But, the text appear way down.

Upvotes: 0

Views: 32

Answers (1)

Karol
Karol

Reputation: 76

I would try to change the inner Box to Column. There are examples of alignment in column

Upvotes: 1

Related Questions