mirror of https://github.com/tasks/tasks
Add search bar to drawer
parent
28de989a05
commit
007c536312
@ -0,0 +1,37 @@
|
||||
package org.tasks.previews.components
|
||||
|
||||
import android.content.res.Configuration
|
||||
import androidx.compose.runtime.Composable
|
||||
import androidx.compose.ui.tooling.preview.Preview
|
||||
import org.tasks.compose.components.SearchBar
|
||||
import org.tasks.themes.TasksTheme
|
||||
|
||||
@Preview(widthDp = 320, showBackground = true)
|
||||
@Preview(widthDp = 320, showBackground = false, uiMode = Configuration.UI_MODE_NIGHT_YES)
|
||||
@Composable
|
||||
fun SearchBarPreviewPlaceholder() {
|
||||
TasksTheme {
|
||||
SearchBar(
|
||||
text = "",
|
||||
onTextChange = {},
|
||||
placeHolder = "Search",
|
||||
onCloseClicked = {},
|
||||
onSearchClicked = {},
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
@Preview(widthDp = 320, showBackground = true)
|
||||
@Preview(widthDp = 320, showBackground = false, uiMode = Configuration.UI_MODE_NIGHT_YES)
|
||||
@Composable
|
||||
fun SearchBarPreviewSearching() {
|
||||
TasksTheme {
|
||||
SearchBar(
|
||||
text = "Testing",
|
||||
onTextChange = {},
|
||||
placeHolder = "Search",
|
||||
onCloseClicked = {},
|
||||
onSearchClicked = {},
|
||||
)
|
||||
}
|
||||
}
|
@ -0,0 +1,79 @@
|
||||
package org.tasks.compose.components
|
||||
|
||||
import androidx.compose.foundation.layout.fillMaxHeight
|
||||
import androidx.compose.foundation.layout.height
|
||||
import androidx.compose.foundation.text.KeyboardActions
|
||||
import androidx.compose.foundation.text.KeyboardOptions
|
||||
import androidx.compose.material.icons.Icons
|
||||
import androidx.compose.material.icons.outlined.Clear
|
||||
import androidx.compose.material.icons.outlined.Search
|
||||
import androidx.compose.material3.Icon
|
||||
import androidx.compose.material3.IconButton
|
||||
import androidx.compose.material3.MaterialTheme
|
||||
import androidx.compose.material3.OutlinedTextField
|
||||
import androidx.compose.material3.OutlinedTextFieldDefaults
|
||||
import androidx.compose.material3.Text
|
||||
import androidx.compose.runtime.Composable
|
||||
import androidx.compose.ui.Modifier
|
||||
import androidx.compose.ui.text.input.ImeAction
|
||||
import androidx.compose.ui.unit.dp
|
||||
|
||||
@Composable
|
||||
fun SearchBar(
|
||||
modifier: Modifier = Modifier,
|
||||
text: String,
|
||||
onTextChange: (String) -> Unit,
|
||||
placeHolder: String,
|
||||
onCloseClicked: () -> Unit,
|
||||
onSearchClicked: (String) -> Unit,
|
||||
) {
|
||||
OutlinedTextField(
|
||||
shape = MaterialTheme.shapes.medium,
|
||||
modifier = modifier.height(56.dp),
|
||||
value = text,
|
||||
onValueChange = {
|
||||
onTextChange(it)
|
||||
},
|
||||
placeholder = {
|
||||
Text(
|
||||
text = placeHolder,
|
||||
color = MaterialTheme.colorScheme.onSurface,
|
||||
modifier = Modifier.fillMaxHeight(),
|
||||
style = MaterialTheme.typography.bodyLarge,
|
||||
)
|
||||
},
|
||||
leadingIcon = {
|
||||
Icon(
|
||||
imageVector = Icons.Outlined.Search,
|
||||
contentDescription = null,
|
||||
tint = MaterialTheme.colorScheme.onSurface,
|
||||
)
|
||||
},
|
||||
trailingIcon = {
|
||||
IconButton(onClick = { onCloseClicked() }) {
|
||||
if (text.isNotBlank()) {
|
||||
Icon(
|
||||
imageVector = Icons.Outlined.Clear,
|
||||
contentDescription = null,
|
||||
tint = MaterialTheme.colorScheme.onSurface,
|
||||
)
|
||||
}
|
||||
}
|
||||
},
|
||||
keyboardOptions = KeyboardOptions(
|
||||
imeAction = ImeAction.Search
|
||||
),
|
||||
keyboardActions = KeyboardActions(
|
||||
onSearch = {
|
||||
onSearchClicked(text)
|
||||
}
|
||||
),
|
||||
singleLine = true,
|
||||
textStyle = MaterialTheme.typography.bodyLarge,
|
||||
colors = OutlinedTextFieldDefaults.colors(
|
||||
focusedBorderColor = MaterialTheme.colorScheme.onSurface,
|
||||
unfocusedBorderColor = MaterialTheme.colorScheme.onSurface,
|
||||
cursorColor = MaterialTheme.colorScheme.onSurface,
|
||||
),
|
||||
)
|
||||
}
|
Loading…
Reference in New Issue