Skip to content

Commit

Permalink
修改搜索框位置 (#20)
Browse files Browse the repository at this point in the history 
* 修正搜索框位置，避免状态栏沉浸导致的问题
  • Loading branch information
@lings03
lings03 authored Sep 20, 2024
1 parent 197e18d commit 28c1be7
Showing 1 changed file with 96 additions and 87 deletions.
183 changes: 96 additions & 87 deletions app/src/main/java/top/laoxin/modmanager/ui/view/modview/ModTopBar.kt
View file
Original file line number Diff line number Diff line change
@@ -1,9 +1,10 @@
package top.laoxin.modmanager.ui.view.modview

import androidx.compose.animation.AnimatedVisibility
import androidx.compose.foundation.background
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.padding
Expand All @@ -28,6 +29,8 @@ import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.Snackbar
import androidx.compose.material3.Text
import androidx.compose.material3.TextButton
import androidx.compose.material3.TextField
import androidx.compose.material3.TextFieldDefaults
import androidx.compose.material3.TopAppBar
import androidx.compose.material3.TopAppBarDefaults
import androidx.compose.runtime.Composable
Expand All @@ -48,13 +51,10 @@ import top.laoxin.modmanager.ui.state.ModUiState
import top.laoxin.modmanager.ui.view.commen.DialogCommon
import top.laoxin.modmanager.ui.viewmodel.ModViewModel


@Composable
fun Tips(
text: String,
showTips: Boolean,
onDismiss: () -> Unit,
uiState: ModUiState,
modifier: Modifier = Modifier
text: String, showTips: Boolean, onDismiss: () -> Unit, uiState: ModUiState
) {
if (showTips) {
val tipsStart = if (uiState.unzipProgress.isNotEmpty()) {
Expand Down Expand Up @@ -116,13 +116,12 @@ fun MultiSelectTopBar(viewModel: ModViewModel, uiState: ModUiState) {
NavigationIndex.DISABLE_MODS -> uiState.disableModList
NavigationIndex.SEARCH_MODS -> uiState.searchModList
}
TopAppBar(
colors = TopAppBarDefaults.topAppBarColors(
Column {
TopAppBar(colors = TopAppBarDefaults.topAppBarColors(
containerColor = MaterialTheme.colorScheme.secondaryContainer,
titleContentColor = MaterialTheme.colorScheme.onSecondaryContainer,
navigationIconContentColor = MaterialTheme.colorScheme.onSecondaryContainer,
),
title = {
), title = {
Box(contentAlignment = Alignment.CenterStart) {
Text(
stringResource(id = uiState.modsView.title),
Expand All @@ -134,14 +133,14 @@ fun MultiSelectTopBar(viewModel: ModViewModel, uiState: ModUiState) {
) {

/* if (uiState.modsSelected.isNotEmpty()){
Text(
text = "已选：${uiState.modsSelected.size}",
style = MaterialTheme.typography.labelMedium,
color = MaterialTheme.colorScheme.onPrimary,
textAlign = TextAlign.Start,
)
Spacer(modifier = Modifier.width(8.dp))
}*/
Text(
text = "已选：${uiState.modsSelected.size}",
style = MaterialTheme.typography.labelMedium,
color = MaterialTheme.colorScheme.onPrimary,
textAlign = TextAlign.Start,
)
Spacer(modifier = Modifier.width(8.dp))
}*/
val total =
if (uiState.modsSelected.isNotEmpty()) "${uiState.modsSelected.size}/${modList.size}" else "${modList.size}"

Expand All @@ -156,9 +155,7 @@ fun MultiSelectTopBar(viewModel: ModViewModel, uiState: ModUiState) {
}
}

},
actions = {

}, actions = {
// 全选
IconButton(onClick = {
// 在这里处理图标按钮的点击事件
Expand Down Expand Up @@ -216,31 +213,19 @@ fun MultiSelectTopBar(viewModel: ModViewModel, uiState: ModUiState) {
//tint = MaterialTheme.colorScheme.primaryContainer
)
}
}
)
AnimatedVisibility(visible = uiState.searchBoxVisible) {
})

// 根据 MutableState 显示或隐藏搜索框
// 添加 Spacer 以分离 SearchBox 和 TopAppBar
Spacer(modifier = Modifier.height(8.dp))

CustomEdit(
text = viewModel.getSearchText(),
onValueChange = {
viewModel.setSearchText(it)
},
hint = stringResource(R.string.mod_page_search_hit),
modifier = Modifier
.fillMaxWidth()
.padding(start = 16.dp, top = 0.dp, end = 16.dp, bottom = 10.dp)
.height(50.dp)
.background(Color(0xBCE9E9E9), shape = MaterialTheme.shapes.medium)
.padding(horizontal = 16.dp),
textStyle = MaterialTheme.typography.bodyMedium,
keyboardOptions = KeyboardOptions(keyboardType = KeyboardType.Text),
close = {
viewModel.setSearchBoxVisible(false)
}
AnimatedVisibility(visible = uiState.searchBoxVisible) {

)
// 根据 MutableState 显示或隐藏搜索框
SearchBox(text = viewModel.getSearchText(),
onValueChange = { viewModel.setSearchText(it) },
hint = stringResource(R.string.mod_page_search_hit),
onClose = { viewModel.setSearchBoxVisible(false) })
}
}
}

Expand All @@ -250,13 +235,12 @@ fun GeneralTopBar(viewModel: ModViewModel, uiState: ModUiState) {

var showMenu by remember { mutableStateOf(false) }

TopAppBar(
colors = TopAppBarDefaults.topAppBarColors(
Column {
TopAppBar(colors = TopAppBarDefaults.topAppBarColors(
containerColor = MaterialTheme.colorScheme.secondaryContainer,
titleContentColor = MaterialTheme.colorScheme.onSecondaryContainer,
navigationIconContentColor = MaterialTheme.colorScheme.onSecondaryContainer,
),
title = {
), title = {
Box(contentAlignment = Alignment.CenterStart) {
Text(
stringResource(id = uiState.modsView.title),
Expand Down Expand Up @@ -286,8 +270,7 @@ fun GeneralTopBar(viewModel: ModViewModel, uiState: ModUiState) {
}
}

},
actions = {
}, actions = {

IconButton(onClick = {
// 在这里处理图标按钮的点击事件
Expand Down Expand Up @@ -324,55 +307,81 @@ fun GeneralTopBar(viewModel: ModViewModel, uiState: ModUiState) {
// tint = MaterialTheme.colorScheme.primaryContainer
)
}
DropdownMenu(
expanded = showMenu,
onDismissRequest = { showMenu = false }
) {
DropdownMenuItem(
text = { Text(stringResource(R.string.mod_page_dropdownMenu_show_enable_mods)) },
DropdownMenu(expanded = showMenu, onDismissRequest = { showMenu = false }) {
DropdownMenuItem(text = { Text(stringResource(R.string.mod_page_dropdownMenu_show_enable_mods)) },
onClick = {
viewModel.setModsView(NavigationIndex.ENABLE_MODS)

}
)
DropdownMenuItem(
text = { Text(stringResource(R.string.mod_page_dropdownMenu_show_disable_mods)) },
})
DropdownMenuItem(text = { Text(stringResource(R.string.mod_page_dropdownMenu_show_disable_mods)) },
onClick = {
viewModel.setModsView(NavigationIndex.DISABLE_MODS)
}
)
DropdownMenuItem(
text = { Text(stringResource(R.string.mod_page_dropdownMenu_show_all_mods)) },
})
DropdownMenuItem(text = { Text(stringResource(R.string.mod_page_dropdownMenu_show_all_mods)) },
onClick = {
viewModel.setModsView(NavigationIndex.ALL_MODS)
}
)
})
// 添加更多的菜单项
}
}
)
AnimatedVisibility(visible = uiState.searchBoxVisible) {
})

// 根据 MutableState 显示或隐藏搜索框
// 添加 Spacer 以分离 SearchBox 和 TopAppBar
Spacer(modifier = Modifier.height(8.dp))

CustomEdit(
text = viewModel.getSearchText(),
onValueChange = {
viewModel.setSearchText(it)
},
hint = stringResource(R.string.mod_page_search_hit),
modifier = Modifier
.fillMaxWidth()
.padding(start = 16.dp, top = 0.dp, end = 16.dp, bottom = 10.dp)
.height(50.dp)
.background(Color(0xBCE9E9E9), shape = MaterialTheme.shapes.medium)
.padding(horizontal = 16.dp),
textStyle = MaterialTheme.typography.bodyMedium,
keyboardOptions = KeyboardOptions(keyboardType = KeyboardType.Text),
close = {
viewModel.setSearchBoxVisible(false)
}
AnimatedVisibility(visible = uiState.searchBoxVisible) {

)
// 根据 MutableState 显示或隐藏搜索框
SearchBox(text = viewModel.getSearchText(),
onValueChange = { viewModel.setSearchText(it) },
hint = stringResource(R.string.mod_page_search_hit),
onClose = { viewModel.setSearchBoxVisible(false) })
}
}
}

@OptIn(ExperimentalMaterial3Api::class)
@Composable
fun SearchBox(
text: String,
onValueChange: (String) -> Unit,
hint: String,
onClose: () -> Unit,
modifier: Modifier = Modifier
) {
TextField(
value = text,
onValueChange = onValueChange,
placeholder = {
Text(
text = hint,
style = MaterialTheme.typography.bodyMedium.copy(
color = MaterialTheme.colorScheme.onSurface.copy(alpha = 0.5f) // 设置透明度
)
)
},
modifier = modifier
.fillMaxWidth()
.padding(start = 16.dp, end = 16.dp, bottom = 10.dp)
.height(50.dp),
textStyle = MaterialTheme.typography.bodyMedium,
keyboardOptions = KeyboardOptions(keyboardType = KeyboardType.Text),
trailingIcon = {
IconButton(onClick = onClose) {
Icon(
imageVector = Icons.Filled.Close,
contentDescription = null
)
}
},
shape = MaterialTheme.shapes.medium,
// 使用动态取色
colors = TextFieldDefaults.colors(
focusedContainerColor = MaterialTheme.colorScheme.secondaryContainer,
unfocusedContainerColor = MaterialTheme.colorScheme.secondaryContainer,
focusedIndicatorColor = Color.Transparent,
unfocusedIndicatorColor = Color.Transparent,
focusedPlaceholderColor = MaterialTheme.colorScheme.onSurface.copy(alpha = 0.5f),
unfocusedPlaceholderColor = MaterialTheme.colorScheme.onSurface.copy(alpha = 0.5f)
)
)
}

0 comments on commit 28c1be7

Please sign in to comment.