Loading...
Loading...
Best practices for Jetpack Compose text fields in Android apps. Use when building forms or search inputs and you need guidance on IME padding, keyboard options, focus movement, and accessible input behavior.
npx skill4agent add aubynsamuel/android-dev-skills textfield-best-practicesModifier.imePadding()Scaffold(
modifier = Modifier.imePadding(),
// ...
) { padding ->
LazyColumn(modifier = Modifier.padding(padding)) {
// ...
}
}KeyboardOptionscapitalizationKeyboardCapitalization.WordsKeyboardCapitalization.SentencesimeActionImeAction.NextImeAction.DonekeyboardActions@Composable
fun UserForm() {
val focusManager = LocalFocusManager.current
var firstName by remember { mutableStateOf("") }
var lastName by remember { mutableStateOf("") }
Column {
OutlinedTextField(
value = firstName,
onValueChange = { firstName = it },
label = { Text("First Name") },
keyboardOptions = KeyboardOptions(
capitalization = KeyboardCapitalization.Words,
imeAction = ImeAction.Next
),
keyboardActions = KeyboardActions(
onNext = { focusManager.moveFocus(FocusDirection.Down) }
)
)
OutlinedTextField(
value = lastName,
onValueChange = { lastName = it },
label = { Text("Last Name") },
keyboardOptions = KeyboardOptions(
capitalization = KeyboardCapitalization.Words,
imeAction = ImeAction.Done
),
keyboardActions = KeyboardActions(
onDone = {
focusManager.clearFocus()
// Submit form
}
)
)
}
}ImeAction.SearchkeyboardActionsonSearch@Composable
fun SearchBar(
query: String,
onQueryChanged: (String) -> Unit,
onSearchTriggered: () -> Unit
) {
val focusManager = LocalFocusManager.current
OutlinedTextField(
value = query,
onValueChange = onQueryChanged,
placeholder = { Text("Search...") },
singleLine = true,
keyboardOptions = KeyboardOptions(
capitalization = KeyboardCapitalization.Sentences,
imeAction = ImeAction.Search
),
keyboardActions = KeyboardActions(
onSearch = {
focusManager.clearFocus() // Hide keyboard
onSearchTriggered() // Execute the explicit search action
}
)
)
}