Florian
10/14/2021, 8:47 AMCsaba Kozák
10/14/2021, 9:04 AMFlorian
10/14/2021, 9:08 AM@Composable
fun ExpandableSearchTextField(
expanded: Boolean,
onSearchIconClicked: () -> Unit,
searchInput: String,
onSearchInputChange: (String) -> Unit,
onFocusLost: () -> Unit,
modifier: Modifier = Modifier,
) {
val focusRequester = remember { FocusRequester() }
Box(modifier) {
if (!expanded) {
IconButton(onClick = onSearchIconClicked) {
Icon(
imageVector = Icons.Default.Search,
contentDescription = stringResource(R.string.search),
)
}
} else {
val tint = LocalContentColor.current.copy(LocalContentAlpha.current)
TextField(
value = searchInput,
onValueChange = onSearchInputChange,
colors = TextFieldDefaults.textFieldColors(
focusedIndicatorColor = Color.Transparent,
unfocusedIndicatorColor = Color.Transparent,
backgroundColor = Color.Transparent,
cursorColor = tint
),
placeholder = {
Text(
stringResource(R.string.search_field_hint),
color = tint
)
},
modifier = Modifier
.fillMaxWidth()
.focusRequester(focusRequester)
.onFocusChanged { focusState ->
if (!focusState.isFocused) {
onFocusLost()
}
}
)
SideEffect {
focusRequester.requestFocus()
}
}
}
}
Csaba Kozák
10/14/2021, 9:11 AMremember { mutableStateOf(false) }
to track wether the text field was opened before, and if not, do not close it when a focus changed is triggered. Of course, you have to update this var
.Florian
10/14/2021, 9:20 AM