How to make Text Selectable in Android using Jetpack Compose? - GeeksforGeeks

11 Jul, 2021
By default, Composable Texts are not selectable which means users cannot copy text from your application, and to enable text selection you need to wrap the text elements into Selection Container. In this article, we will use Android’s Jetpack Compose to create those chips. A sample image is given below to give an idea of what we are going to build. Note that we are going to implement this project using the Kotlin language. 
Step 1: Create a New Project
To create a new project in the Android Studio Canary Version please refer to How to Create a new Project in Android Studio Canary Version with Jetpack Compose.
Step 2: Working with the MainActivity.kt file
Navigate to the app > java > your app’s package name and open the MainActivity.kt file. Inside that file add the below code to it. Comments are added inside the code to understand the code in more detail.
Kotlin
import android.os.Bundleimport androidx.activity.ComponentActivityimport androidx.activity.compose.setContentimport androidx.compose.foundation.layout.Columnimport androidx.compose.foundation.layout.fillMaxWidthimport androidx.compose.foundation.layout.paddingimport androidx.compose.foundation.text.selection.DisableSelectionimport androidx.compose.foundation.text.selection.SelectionContainerimport androidx.compose.material.MaterialThemeimport androidx.compose.material.Surfaceimport androidx.compose.material.Textimport androidx.compose.runtime.Composableimport androidx.compose.ui.Modifierimport androidx.compose.ui.text.style.TextAlignimport androidx.compose.ui.tooling.preview.Previewimport androidx.compose.ui.unit.dpimport com.example.jetpack_playground.ui.theme.Jetpack_playgroundTheme  class MainActivity : ComponentActivity() {    override fun onCreate(savedInstanceState: Bundle?) {        super.onCreate(savedInstanceState)        setContent {            Jetpack_playgroundTheme {                // A surface container using the                   // 'background' color from the theme                Surface(color = MaterialTheme.colors.background) {                    // call the CustomSelectableText() function                    // it is defined below                    Column {                        CustomSelectableText()                    }                }            }        }    }}  // create a composable function// for the selectable text.// Wrap the text inside SelectionContainer()// in order to make it selectable@Composablefun CustomSelectableText() {    SelectionContainer() {        Column() {            Text(                text = "Welcome to Geeks for Geeks,A Computer Science portal for geeks." +                        "It contains well written, well thought and well explained computer " +                        "science and programming articles, quizzes and ...",                textAlign = TextAlign.Center,                modifier = Modifier                    .padding(start = 10.dp, top = 20.dp)                    .fillMaxWidth()            )        }    }}  @Preview(showBackground = true)@Composablefun DefaultPreview() {    Jetpack_playgroundTheme {        CustomSelectableText()    }}
Output:
Android-Jetpack
Android
Kotlin
Android
Writing code in comment?
Please use ide.geeksforgeeks.org,
generate link and share the link here.
Comments
Old Comments
Retrofit with Kotlin Coroutine in Android
Android Listview in Java with Example
How to Read Data from SQLite Database in Android?
Flutter - Custom Bottom Navigation Bar
How to Change the Background Color After Clicking the Button in Android?
Android UI Layouts
Kotlin Array
Retrofit with Kotlin Coroutine in Android
Kotlin Setters and Getters
MVP (Model View Presenter) Architecture Pattern in Android with Example