ModernText

A ModernText composable is helpful to add additional capabilities to the text.

Now with Jetpack Compose easily add the following capabilities

  1. Add multicolor word in a single line
  2. Add link for a line
  3. Add link for a word
  4. Change color of a word based on hot key

To get started with ModernText just add the maven url and the ModernText dependency

build.gradle (Project level)

allprojects {
    repositories {
    ...
    //Add this url
    maven { url 'https://jitpack.io' }
    }
}

If you are using Android Studio Arctic Fox and do not have allProjects in build.gradle then add following maven url in settings.gradle like below

dependencyResolutionManagement {
    repositoriesMode.set(RepositoriesMode.FAIL_ON_PROJECT_REPOS)
    repositories {
        google()
        mavenCentral()
        //Add this url
        maven { url 'https://jitpack.io' }
        jcenter() // Warning: this repository is going to shut down soon
    }
}

Once you have added the maven url now add the moderntext dependency in the build.gradle (module level)

implementation 'com.github.raipankaj:moderntext:1.0.0'

Code snippet for various capabilities

Add link to the text

ModernText(text = {
        append("Please accept the")
        append(
            "terms and conditions",
            tag = "terms", url = "https://www.yourterms.com",
            spanStyle = SpanStyle(Color.Red, fontWeight = FontWeight.ExtraBold)
        )
        append("& also the")
        append(
            "privacy policy", tag = "privacy", url = "https://www.yourprivacypolicy.com",
            spanStyle = SpanStyle(Color.Red, fontWeight = FontWeight.ExtraBold)
        )
    }, onClick = { tag, uri ->
        uriHandler.openUri(uri)
    })

Add multicolor line

ModernText(text = {
        append("This simple string is shown through the")
        append("ModernText", spanStyle = SpanStyle(color = Color.Green))
        append("composable to showcase", spanStyle = SpanStyle(Color.Gray))
        append("multicolor text")
        append("in a single line", spanStyle = SpanStyle(Color.Blue))
    })

Add hotkey to the line

ModernText(text = {
        append(
            "You can also add a hotkey like #ModernTextRocks in this case",
            hotKey = "#",
            spanStyle = SpanStyle(Color.Blue)
        )
        append(
            "just adding a hashtag or any other key based on what you provide",
        )
        append(
            "as the hotKey parameter #done",
            hotKey = "#",
            spanStyle = SpanStyle(Color.Blue)
        )
    })

You can also add tagging function based on username like this

val uriHandler = LocalUriHandler.current

ModernText(text = {
    append("You can also tag a person with a symbol (@)")
    append(
        "like this, hey @username wassup?",
         tag = "username",
         hotKey = "@",
         spanStyle = SpanStyle(Color.Blue),
         url = "https://www.dummy.com/profile/username"
    )
    append("Now above text have a link annotated with the username")
    }, onClick = { tag, uri ->
        uriHandler.openUri(uri)
})

Demo

If you found it beneficial, give it a star 😃

GitHub

View Github