0

is there a way to use overflow = TextOverflow.Ellipsis dynamically depending on the view size?

I am trying to implement this screen that I designed in Figma

enter image description here

my problem is with the More Information Section. I used Text object with the attribute maxLines = 5 with TextOverflow.Ellipsis attribute in Pixel 3a XL the view is correct but on smaller phones the maxLines need to be smaller like 3. see the example, please

small phone problem

enter image description here

bigger phone

enter image description here

Relevant code

@Composable
fun ProfileScreen() {

        MoreInfo("Amit Segal is a journalist and a news anchor. He is the host of the N12 news channel. He is a very popular journalist. Amit Yitzchak Segal[1] (born Biz in Nisan 5, 1982, April 10, 1982) is an Israeli journalist, and radio and television personality. Serves as the political commentator of the news company and a political columnist in the \"Yediot Aharonot\" newspaper. One of the most influential journalists in Israel[2]. Presents Meet the Press on Channel 12 together with Ben Caspit.")

    
}

@Composable
fun MoreInfo(information_param: String, modifier: Modifier = Modifier) {
    Column(modifier = modifier.padding(start = 26.dp , end = 26.dp)) {
        Text(
            text = "More information",
            color = Color.Black,
            fontSize = 36.sp,
            fontWeight = FontWeight.Bold
        )

        Text(
            text = information_param,
            fontSize = 20.sp,
            fontWeight = FontWeight.Normal,
            color = Color.Black,
            maxLines = 5,
            overflow = TextOverflow.Ellipsis,
        )
    }
}

I want to take the opportunity that I already ask something related. Is there a possibility that when the text reaches the end of the page it will change its opacity so that it slowly disappears downwards instead of the ellipsis

Dolev Dublon
  • 643
  • 1
  • 6
  • 16

0 Answers0