I have a Row
with some text and different sizes, then in the end of the Row
I have a Column
where I have two Text
so the output is something like this :
Perhaps the image is not the best one but as you can see there's a Row
where I have two Text
one with different size, and in the end I have a Column
with two Text
the problem I'm having is that if I use Column(modifier = Modifier.alignBy(LastBaseline))
it solves one problem that I was having, but creating a new one that is that is moving all the Column
to the top, so what I'm looking for is without losing this Baseline
(since I have different size this command works perfect to avoid playing with margin) I want to avoid moving this column, note that the first Text
of the Column
the best is that should have a alignTopToTop="secondText"
but I don't know if it's possible.
There's the two options, one is if I add the alignBy(LastBaseline)
make the column fixed and don't move anything just align the Text
from the bottom and another one is, somehow add this constraint to the second Text
of the Row
to don't move the Column
My code
ConstraintLayout {
val (text1, text2) = createRefs()
Column(
horizontalAlignment = Alignment.CenterHorizontally,
modifier = Modifier.constrainAs(text1) {
top.linkTo(parent.top)
start.linkTo(parent.start)
end.linkTo(parent.end)
bottom.linkTo(parent.bottom)
}
) {
Text(
text = "Hello",
style = TextStyle(
fontWeight = FontWeight.Bold,
fontSize = 12.sp,
lineHeight = 18.sp,
color = Black,
),
)
Row(verticalAlignment = Alignment.Bottom) {
Text(
text = "World",
style = TextStyle(
fontWeight = FontWeight.Bold,
fontSize = 12.sp,
lineHeight = 18.sp,
color = Black,
),
modifier = Modifier
.alignByBaseline()
)
Text(
text = "WORLD",
style = TextStyle(
fontWeight = FontWeight.Bold,
fontSize = 24.sp,
lineHeight = 18.sp,
color = Black,
),
modifier = Modifier
.alignByBaseline()
)
Column(modifier = Modifier.alignBy(LastBaseline)) {
Text(
text = "^",
style = TextStyle(
fontWeight = FontWeight.Bold,
fontSize = 12.sp,
lineHeight = 18.sp,
color = Black,
),
)
Text(
text = "^",
style = TextStyle(
fontWeight = FontWeight.Bold,
fontSize = 12.sp,
lineHeight = 18.sp,
color = Black,
),
)
}
}
}
}
The problem as you can see here
Is that when I do the
modifier = Modifier.alignBy(LastBaseline)
the column goes up and it makes to make this extra space between the text 2 and text 1, is there any way to avoid this column moving up?