Android Day 8 How to get user Input?

Well , let me demostrate some of the user input, you can use all sorts of textfield to do this:

package com.williamjiamin.ourowncomposable

import android.os.Bundle
import androidx.activity.ComponentActivity
import androidx.activity.compose.setContent
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.text.BasicTextField
import androidx.compose.foundation.text.KeyboardOptions
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.OutlinedTextField
import androidx.compose.material3.Surface
import androidx.compose.material3.Text
import androidx.compose.material3.TextField
import androidx.compose.runtime.Composable
import androidx.compose.runtime.getValue
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember
import androidx.compose.runtime.setValue
import androidx.compose.ui.Modifier
import androidx.compose.ui.text.TextStyle
import androidx.compose.ui.text.input.KeyboardType
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.sp
import com.williamjiamin.ourowncomposable.ui.theme.OurOwnComposableTheme

class MainActivity : ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContent {
            OurOwnComposableTheme {
                // A surface container using the 'background' color from the theme
                Surface(
                    modifier = Modifier.fillMaxSize(),
                    color = MaterialTheme.colorScheme.background
                ) {
                    StackOfGreetings()
                }
            }
        }
    }
}

@Composable
fun Greeting(name: String, modifier: Modifier = Modifier) {
    Text(
        text = "$name",
        modifier = modifier
    )
}

@Composable
fun StackOfGreetings() {

    Column {
        Row {
            Column {
                Greeting("1-")
                Greeting("2-")
                Greeting("3-")
                Greeting("4-")
                Greeting("5-")
            }
            Greeting("2-")
            Greeting("3-")
            Greeting("4-")
            Greeting("5-")
        }
        Greeting("Android")
        Greeting("William Jiamin")
        Greeting("Youtube Channel")
        Greeting("Learn-IT-Free.com")
        Greeting("Learn Kotlin The Hard Way")

        UserInputField()
    }

}

@Composable
fun UserInputField() {

    var textState by remember { mutableStateOf("") }

    Column {
        Text("---------------------------------------")
        Text("Just Text Field")
        Text("---------------------------------------")

        TextField(value = "Please Input your name:", onValueChange = {})

        Text("---------------------------------------")
        Text("Basic Text Field")
        Text("---------------------------------------")
        BasicTextField(
            value = textState,
            onValueChange = {
                textState = it
            },
            textStyle = TextStyle(fontSize = 16.sp),
            keyboardOptions = KeyboardOptions.Default.copy(keyboardType = KeyboardType.Text)
        )
        Text("---------------------------------------")
        Text("Outlined Text Field")
        Text("---------------------------------------")

        Text("Please input your name:")

        OutlinedTextField(value = "", onValueChange = {

        })
    }
}

@Preview(showBackground = true)
@Composable
fun GreetingPreview() {
    OurOwnComposableTheme {
        Greeting("Android")
    }
}

I use a state var textState by remember { mutableStateOf("") } to quickly help you review how to hold some data unchanged , you can add baesd on my code.

Then you will see something like this if you run the code:

And you can get the user input. I use keyboardOption to demo that you can set the default keyboard action when user click this textfield.