style(ui): 列表项改用 Miuix BasicComponent(MD3 圆角卡片)
抽屉的会话行/入口行、设置页的主题选项统一换成 BasicComponent,间距 8dp,选中态用 ✓ 标记。
This commit is contained in:
1 parent
00856eeaf7
commit
df2a26701c
2 files changed
+52
-54
No files matched your search
@@ -23,11 +23,12 @@ import androidx.compose.ui.Alignment
|
|||||||
import androidx.compose.ui.Modifier
|
import androidx.compose.ui.Modifier
|
||||||
import androidx.compose.ui.unit.dp
|
import androidx.compose.ui.unit.dp
|
||||||
import androidx.compose.ui.window.Dialog
|
import androidx.compose.ui.window.Dialog
|
||||||
|
import top.yukonga.miuix.kmp.basic.BasicComponent
|
||||||
import top.yukonga.miuix.kmp.basic.Text
|
import top.yukonga.miuix.kmp.basic.Text
|
||||||
import top.yukonga.miuix.kmp.basic.TextButton
|
import top.yukonga.miuix.kmp.basic.TextButton
|
||||||
import top.yukonga.miuix.kmp.theme.MiuixTheme
|
import top.yukonga.miuix.kmp.theme.MiuixTheme
|
||||||
|
|
||||||
/** 侧边栏内容:会话列表 + IoT/设置占位 + 登出。 */
|
/** 侧边栏内容:会话列表 + IoT/设置占位 + 登出。列表项统一用 Miuix 的 MD3 圆角卡片。 */
|
||||||
@Composable
|
@Composable
|
||||||
fun ColumnScope.SessionDrawerContent(
|
fun ColumnScope.SessionDrawerContent(
|
||||||
state: SessionsUiState,
|
state: SessionsUiState,
|
||||||
@@ -52,14 +53,17 @@ fun ColumnScope.SessionDrawerContent(
|
|||||||
Row(
|
Row(
|
||||||
modifier = Modifier
|
modifier = Modifier
|
||||||
.fillMaxWidth()
|
.fillMaxWidth()
|
||||||
.padding(horizontal = 20.dp, vertical = 4.dp),
|
.padding(start = 20.dp, end = 12.dp, bottom = 4.dp),
|
||||||
verticalAlignment = Alignment.CenterVertically,
|
verticalAlignment = Alignment.CenterVertically,
|
||||||
) {
|
) {
|
||||||
Text("会话", style = MiuixTheme.textStyles.subtitle, modifier = Modifier.weight(1f))
|
Text("会话", style = MiuixTheme.textStyles.subtitle, modifier = Modifier.weight(1f))
|
||||||
TextButton("新建", onClick = onCreate)
|
TextButton("新建", onClick = onCreate)
|
||||||
}
|
}
|
||||||
|
|
||||||
LazyColumn(modifier = Modifier.weight(1f)) {
|
LazyColumn(
|
||||||
|
modifier = Modifier.weight(1f),
|
||||||
|
verticalArrangement = Arrangement.spacedBy(8.dp),
|
||||||
|
) {
|
||||||
items(items = state.sessions, key = { it.id }) { session ->
|
items(items = state.sessions, key = { it.id }) { session ->
|
||||||
SessionRow(
|
SessionRow(
|
||||||
session = session,
|
session = session,
|
||||||
@@ -86,9 +90,11 @@ fun ColumnScope.SessionDrawerContent(
|
|||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
||||||
Spacer(Modifier.height(8.dp))
|
Spacer(Modifier.height(12.dp))
|
||||||
DrawerAction("IoT(规划中)", onOpenIot)
|
DrawerAction("IoT(规划中)", onOpenIot)
|
||||||
DrawerAction("App 设置(规划中)", onOpenSettings)
|
Spacer(Modifier.height(8.dp))
|
||||||
|
DrawerAction("App 设置", onOpenSettings)
|
||||||
|
Spacer(Modifier.height(8.dp))
|
||||||
DrawerAction("登出", onLogout)
|
DrawerAction("登出", onLogout)
|
||||||
Spacer(Modifier.height(16.dp))
|
Spacer(Modifier.height(16.dp))
|
||||||
|
|
||||||
@@ -113,42 +119,35 @@ private fun SessionRow(
|
|||||||
onClick: () -> Unit,
|
onClick: () -> Unit,
|
||||||
onDelete: () -> Unit,
|
onDelete: () -> Unit,
|
||||||
) {
|
) {
|
||||||
Row(
|
BasicComponent(
|
||||||
modifier = Modifier
|
title = session.title,
|
||||||
.fillMaxWidth()
|
onClick = onClick,
|
||||||
.clickable(onClick = onClick)
|
endActions = {
|
||||||
.padding(horizontal = 20.dp, vertical = 12.dp),
|
if (active) {
|
||||||
verticalAlignment = Alignment.CenterVertically,
|
Text(
|
||||||
) {
|
text = "✓",
|
||||||
Text(
|
style = MiuixTheme.textStyles.main,
|
||||||
text = session.title,
|
color = MiuixTheme.colorScheme.primary,
|
||||||
style = MiuixTheme.textStyles.main,
|
modifier = Modifier.padding(horizontal = 6.dp),
|
||||||
color = if (active) MiuixTheme.colorScheme.primary else MiuixTheme.colorScheme.onBackground,
|
)
|
||||||
modifier = Modifier.weight(1f),
|
}
|
||||||
)
|
if (!session.isMain) {
|
||||||
if (!session.isMain) {
|
Text(
|
||||||
Text(
|
text = "删除",
|
||||||
text = "删除",
|
style = MiuixTheme.textStyles.footnote1,
|
||||||
style = MiuixTheme.textStyles.footnote1,
|
color = MiuixTheme.colorScheme.error,
|
||||||
color = MiuixTheme.colorScheme.error,
|
modifier = Modifier
|
||||||
modifier = Modifier
|
.clickable(onClick = onDelete)
|
||||||
.clickable(onClick = onDelete)
|
.padding(horizontal = 8.dp, vertical = 4.dp),
|
||||||
.padding(horizontal = 8.dp, vertical = 4.dp),
|
)
|
||||||
)
|
}
|
||||||
}
|
},
|
||||||
}
|
)
|
||||||
}
|
}
|
||||||
|
|
||||||
@Composable
|
@Composable
|
||||||
private fun DrawerAction(label: String, onClick: () -> Unit) {
|
private fun DrawerAction(label: String, onClick: () -> Unit) {
|
||||||
Text(
|
BasicComponent(title = label, onClick = onClick)
|
||||||
text = label,
|
|
||||||
style = MiuixTheme.textStyles.main,
|
|
||||||
modifier = Modifier
|
|
||||||
.fillMaxWidth()
|
|
||||||
.clickable(onClick = onClick)
|
|
||||||
.padding(horizontal = 20.dp, vertical = 14.dp),
|
|
||||||
)
|
|
||||||
}
|
}
|
||||||
|
|
||||||
@Composable
|
@Composable
|
||||||
|
|||||||
@@ -1,6 +1,5 @@
|
|||||||
package top.yeij.cyrene.ui.settings
|
package top.yeij.cyrene.ui.settings
|
||||||
|
|
||||||
import androidx.compose.foundation.clickable
|
|
||||||
import androidx.compose.foundation.layout.Column
|
import androidx.compose.foundation.layout.Column
|
||||||
import androidx.compose.foundation.layout.Row
|
import androidx.compose.foundation.layout.Row
|
||||||
import androidx.compose.foundation.layout.Spacer
|
import androidx.compose.foundation.layout.Spacer
|
||||||
@@ -22,6 +21,7 @@ import top.yeij.cyrene.BuildConfig
|
|||||||
import top.yeij.cyrene.app.AppContainer
|
import top.yeij.cyrene.app.AppContainer
|
||||||
import top.yeij.cyrene.core.prefs.AppPrefs
|
import top.yeij.cyrene.core.prefs.AppPrefs
|
||||||
import top.yeij.cyrene.core.prefs.ThemeMode
|
import top.yeij.cyrene.core.prefs.ThemeMode
|
||||||
|
import top.yukonga.miuix.kmp.basic.BasicComponent
|
||||||
import top.yukonga.miuix.kmp.basic.Scaffold
|
import top.yukonga.miuix.kmp.basic.Scaffold
|
||||||
import top.yukonga.miuix.kmp.basic.SmallTopAppBar
|
import top.yukonga.miuix.kmp.basic.SmallTopAppBar
|
||||||
import top.yukonga.miuix.kmp.basic.Text
|
import top.yukonga.miuix.kmp.basic.Text
|
||||||
@@ -59,6 +59,7 @@ fun SettingsScreen(
|
|||||||
selected = prefs.themeMode == mode,
|
selected = prefs.themeMode == mode,
|
||||||
onClick = { scope.launch { settings.setThemeMode(mode) } },
|
onClick = { scope.launch { settings.setThemeMode(mode) } },
|
||||||
)
|
)
|
||||||
|
Spacer(Modifier.height(8.dp))
|
||||||
}
|
}
|
||||||
|
|
||||||
SectionTitle("聊天")
|
SectionTitle("聊天")
|
||||||
@@ -68,6 +69,7 @@ fun SettingsScreen(
|
|||||||
checked = prefs.showNarration,
|
checked = prefs.showNarration,
|
||||||
onCheckedChange = { scope.launch { settings.setShowNarration(it) } },
|
onCheckedChange = { scope.launch { settings.setShowNarration(it) } },
|
||||||
)
|
)
|
||||||
|
Spacer(Modifier.height(8.dp))
|
||||||
SwitchPreference(
|
SwitchPreference(
|
||||||
title = "思维链默认展开",
|
title = "思维链默认展开",
|
||||||
summary = "流式期间展开思维链,结束后自动折叠",
|
summary = "流式期间展开思维链,结束后自动折叠",
|
||||||
@@ -110,22 +112,19 @@ private fun ThemeOption(
|
|||||||
selected: Boolean,
|
selected: Boolean,
|
||||||
onClick: () -> Unit,
|
onClick: () -> Unit,
|
||||||
) {
|
) {
|
||||||
Row(
|
BasicComponent(
|
||||||
modifier = Modifier
|
title = label,
|
||||||
.fillMaxWidth()
|
onClick = onClick,
|
||||||
.clickable(onClick = onClick)
|
endActions = {
|
||||||
.padding(horizontal = 20.dp, vertical = 14.dp),
|
if (selected) {
|
||||||
verticalAlignment = Alignment.CenterVertically,
|
Text(
|
||||||
) {
|
text = "✓",
|
||||||
Text(label, style = MiuixTheme.textStyles.main, modifier = Modifier.weight(1f))
|
style = MiuixTheme.textStyles.main,
|
||||||
if (selected) {
|
color = MiuixTheme.colorScheme.primary,
|
||||||
Text(
|
)
|
||||||
text = "✓",
|
}
|
||||||
style = MiuixTheme.textStyles.main,
|
},
|
||||||
color = MiuixTheme.colorScheme.primary,
|
)
|
||||||
)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
private fun ThemeMode.label(): String = when (this) {
|
private fun ThemeMode.label(): String = when (this) {
|
||||||
|
|||||||
Reference in new issue
Block a user