From 27ebefd799fc0af1344e57e16cb165f8b936600e Mon Sep 17 00:00:00 2001 From: Ching Date: Sun, 23 Nov 2025 02:46:36 +0800 Subject: [PATCH] fix(android): improve dark mode text readability and contrast - Add dedicated dark mode color scheme with high contrast text - Create values-night resources for optimized dark theme - Update UI components to use MaterialTheme dynamic colors - Replace hardcoded colors with theme-aware colors in Compose UI - Fix widget text colors to adapt to system theme - Improve task status colors for better visibility in dark mode --- .../calendarwidget/ui/components/TaskCard.kt | 10 ++++--- .../ui/control/ControlScreen.kt | 12 ++++----- .../ui/display/DisplayScreen.kt | 6 ++--- .../tunpok/calendarwidget/ui/theme/Color.kt | 27 ++++++++++++++++--- .../main/res/layout/widget_item_layout.xml | 2 +- .../main/res/layout/widget_layout_large.xml | 2 +- .../main/res/layout/widget_layout_medium.xml | 2 +- .../main/res/layout/widget_layout_small.xml | 2 +- .../app/src/main/res/values-night/colors.xml | 24 +++++++++++++++++ .../app/src/main/res/values-night/themes.xml | 25 +++++++++++++++++ 10 files changed, 92 insertions(+), 20 deletions(-) create mode 100644 android-app/app/src/main/res/values-night/colors.xml create mode 100644 android-app/app/src/main/res/values-night/themes.xml diff --git a/android-app/app/src/main/java/com/tunpok/calendarwidget/ui/components/TaskCard.kt b/android-app/app/src/main/java/com/tunpok/calendarwidget/ui/components/TaskCard.kt index ea67cd4..08bfd94 100644 --- a/android-app/app/src/main/java/com/tunpok/calendarwidget/ui/components/TaskCard.kt +++ b/android-app/app/src/main/java/com/tunpok/calendarwidget/ui/components/TaskCard.kt @@ -32,7 +32,8 @@ fun TaskCard( modifier = modifier.fillMaxWidth(), shape = RoundedCornerShape(12.dp), colors = CardDefaults.cardColors( - containerColor = Color.White + containerColor = MaterialTheme.colorScheme.surface, + contentColor = MaterialTheme.colorScheme.onSurface ), elevation = CardDefaults.cardElevation( defaultElevation = 2.dp @@ -75,13 +76,13 @@ fun TaskCard( Text( text = "间隔: ${task.minIntervalDays} 天", style = MaterialTheme.typography.bodySmall, - color = Color.Gray + color = MaterialTheme.colorScheme.onSurfaceVariant ) task.lastExecutionTime?.let { time -> Text( text = " | 上次: ${formatDate(time)}", style = MaterialTheme.typography.bodySmall, - color = Color.Gray + color = MaterialTheme.colorScheme.onSurfaceVariant ) } } @@ -128,7 +129,8 @@ fun TaskDisplayCard( .clickable { onClick() }, shape = RoundedCornerShape(16.dp), colors = CardDefaults.cardColors( - containerColor = SurfaceColor + containerColor = MaterialTheme.colorScheme.surface, + contentColor = MaterialTheme.colorScheme.onSurface ) ) { Column( diff --git a/android-app/app/src/main/java/com/tunpok/calendarwidget/ui/control/ControlScreen.kt b/android-app/app/src/main/java/com/tunpok/calendarwidget/ui/control/ControlScreen.kt index e8bc981..7c1daf6 100644 --- a/android-app/app/src/main/java/com/tunpok/calendarwidget/ui/control/ControlScreen.kt +++ b/android-app/app/src/main/java/com/tunpok/calendarwidget/ui/control/ControlScreen.kt @@ -39,17 +39,17 @@ fun ControlScreen( ) }, colors = TopAppBarDefaults.topAppBarColors( - containerColor = PrimaryColor, - titleContentColor = Color.White + containerColor = MaterialTheme.colorScheme.primary, + titleContentColor = MaterialTheme.colorScheme.onPrimary ) ) }, floatingActionButton = { FloatingActionButton( onClick = { viewModel.showAddDialog() }, - containerColor = PrimaryColor + containerColor = MaterialTheme.colorScheme.primary ) { - Icon(Icons.Default.Add, contentDescription = "添加任务", tint = Color.White) + Icon(Icons.Default.Add, contentDescription = "添加任务", tint = MaterialTheme.colorScheme.onPrimary) } } ) { paddingValues -> @@ -143,13 +143,13 @@ fun EmptyState(modifier: Modifier = Modifier) { Text( "暂无任务", style = MaterialTheme.typography.titleLarge, - color = Color.Gray + color = MaterialTheme.colorScheme.onSurfaceVariant ) Spacer(modifier = Modifier.height(8.dp)) Text( "点击右下角添加第一个任务", style = MaterialTheme.typography.bodyMedium, - color = Color.Gray + color = MaterialTheme.colorScheme.onSurfaceVariant ) } } diff --git a/android-app/app/src/main/java/com/tunpok/calendarwidget/ui/display/DisplayScreen.kt b/android-app/app/src/main/java/com/tunpok/calendarwidget/ui/display/DisplayScreen.kt index cc174c8..745b5d6 100644 --- a/android-app/app/src/main/java/com/tunpok/calendarwidget/ui/display/DisplayScreen.kt +++ b/android-app/app/src/main/java/com/tunpok/calendarwidget/ui/display/DisplayScreen.kt @@ -36,8 +36,8 @@ fun DisplayScreen( ) }, colors = TopAppBarDefaults.topAppBarColors( - containerColor = PrimaryColor, - titleContentColor = Color.White + containerColor = MaterialTheme.colorScheme.primary, + titleContentColor = MaterialTheme.colorScheme.onPrimary ) ) } @@ -56,7 +56,7 @@ fun DisplayScreen( "暂无任务", modifier = Modifier.align(Alignment.Center), style = MaterialTheme.typography.titleLarge, - color = Color.Gray + color = MaterialTheme.colorScheme.onSurfaceVariant ) } else { LazyVerticalGrid( diff --git a/android-app/app/src/main/java/com/tunpok/calendarwidget/ui/theme/Color.kt b/android-app/app/src/main/java/com/tunpok/calendarwidget/ui/theme/Color.kt index ba33054..1b0689d 100644 --- a/android-app/app/src/main/java/com/tunpok/calendarwidget/ui/theme/Color.kt +++ b/android-app/app/src/main/java/com/tunpok/calendarwidget/ui/theme/Color.kt @@ -10,14 +10,35 @@ val Purple40 = Color(0xFF6650a4) val PurpleGrey40 = Color(0xFF625b71) val Pink40 = Color(0xFF7D5260) -// Custom colors for Calendar Widget +// Custom colors for Calendar Widget - Light Mode val PrimaryColor = Color(0xFF667EEA) val SecondaryColor = Color(0xFF764BA2) val BackgroundColor = Color(0xFFF5F5F9) val SurfaceColor = Color(0xFFF2F2F2) val ErrorColor = Color(0xFFFF4757) -// Task status colors +// Task status colors - Light Mode val TaskGreen = Color(0xFF00B894) val TaskYellow = Color(0xFFFDCB6E) -val TaskRed = Color(0xFFFF4757) \ No newline at end of file +val TaskRed = Color(0xFFFF4757) + +// Dark Mode Colors +val DarkPrimaryColor = Color(0xFF5E72E4) +val DarkSecondaryColor = Color(0xFF8B5CF6) +val DarkBackgroundColor = Color(0xFF1A1A1A) +val DarkSurfaceColor = Color(0xFF2A2A2A) +val DarkErrorColor = Color(0xFFFF6B6B) + +// Task status colors - Dark Mode +val DarkTaskGreen = Color(0xFF4ADE80) +val DarkTaskYellow = Color(0xFFFACC15) +val DarkTaskRed = Color(0xFFFF6B6B) + +// Text colors for dark mode +val DarkTextPrimary = Color(0xFFFFFFFF) +val DarkTextSecondary = Color(0xFFD1D5DB) +val DarkTextDisabled = Color(0xFF6B7280) + +// Card colors for dark mode +val DarkCardBackground = Color(0xFF374151) +val DarkDivider = Color(0xFF4B5563) \ No newline at end of file diff --git a/android-app/app/src/main/res/layout/widget_item_layout.xml b/android-app/app/src/main/res/layout/widget_item_layout.xml index 3c814b4..41c117b 100644 --- a/android-app/app/src/main/res/layout/widget_item_layout.xml +++ b/android-app/app/src/main/res/layout/widget_item_layout.xml @@ -14,7 +14,7 @@ android:layout_height="wrap_content" android:text="Task Name" android:textSize="14sp" - android:textColor="@color/black" + android:textColor="?android:attr/textColorPrimary" android:textAlignment="center" android:ellipsize="end" android:maxLines="1" /> diff --git a/android-app/app/src/main/res/layout/widget_layout_large.xml b/android-app/app/src/main/res/layout/widget_layout_large.xml index 7a976b5..569f1ca 100644 --- a/android-app/app/src/main/res/layout/widget_layout_large.xml +++ b/android-app/app/src/main/res/layout/widget_layout_large.xml @@ -19,7 +19,7 @@ android:text="@string/app_name" android:textSize="16sp" android:textStyle="bold" - android:textColor="@color/black" /> + android:textColor="?android:attr/textColorPrimary" /> + android:textColor="?android:attr/textColorPrimary" /> + android:textColor="?android:attr/textColorPrimary" /> + + + #FF5E72E4 + #FF8B5CF6 + #FF1A1A1A + #FF2A2A2A + #FFFF6B6B + + + #FF4ADE80 + #FFFACC15 + #FFFF6B6B + #FF9CA3AF + + + #FFFFFFFF + #FFD1D5DB + #FF6B7280 + + + #FF374151 + #FF4B5563 + \ No newline at end of file diff --git a/android-app/app/src/main/res/values-night/themes.xml b/android-app/app/src/main/res/values-night/themes.xml new file mode 100644 index 0000000..08389a4 --- /dev/null +++ b/android-app/app/src/main/res/values-night/themes.xml @@ -0,0 +1,25 @@ + + + + + \ No newline at end of file