Monday 3 July 2023

JetPack Compose: Basic TextView Sample in JetPack Compose

 Hi All,

     This is the very basic Text View Sample Jetpack compose.  


1. Text Color:
Change the text color using color parameter
@Composable
fun ColorText() {
    Text("Text in Red Color", color = Color.Red ,  modifier = Modifier
        .padding(8.dp) // margin
        .padding(8.dp) // padding
    )
}

2. Text Size: Change the text size using fontSize parameter
@Composable
fun TextWithSize(label : String, size : TextUnit) {
    Text(label, fontSize = size)
}

//TextWithSize("Big text",40.sp) -- call this method 
3.Bold Text: Use fontWeight parameter to making the bold text
@Composable
fun BoldText() {
    Text("Text in Bold", fontWeight = FontWeight.Bold,  modifier = Modifier
        .padding(8.dp) // margin
        .padding(8.dp)) // padding
}
4. Italic Text: Use fontStyle paramter to making the italic text
@Composable
fun ItalicText() {
    Text("Italic Text", fontStyle = FontStyle.Italic,  modifier = Modifier
        .padding(8.dp) // margin
        .padding(8.dp)) // padding
}
5. Maximum number of lines: To limit the number of visible lines in a Text composable, set the maxLines parameter,
@Composable
fun MaxLines() {
    Text("Text with Max line 2 ".repeat(50), maxLines = 2, modifier = Modifier
        .padding(8.dp) // margin
        .padding(8.dp)) // padding
}
6. Text Overflow: When limiting a long text, you may want to indicate a text overflow, which is only shown if the displayed text is truncated. To do so, set the textOverflow parameter
@Composable
fun OverflowedText() {
    Text("Text with three dot at end, Text Overflow  ".repeat(150),
        maxLines = 3, overflow = TextOverflow.Ellipsis,
        modifier = Modifier
            .padding(8.dp)) // margin
}

Download code from here

 

Copyright @ 2013 Android Developers Blog.