Skip to content

Commit a969d5f

Browse files
graycreateclaude
andauthored
Improve tab bar color contrast in light and dark modes (#55)
* feat: improve tab bar color contrast in light and dark modes Update tab bar unselected item color from 40% to 60% opacity for better contrast and visibility in both light and dark modes. Changes: - Light mode: selected uses dark color, unselected uses 60% opacity dark (was 40%) - Dark mode: selected uses white, unselected uses 60% opacity white (was 40%) The subtle difference (100% vs 60%) provides better visual feedback while maintaining a clean, modern look consistent with iOS design patterns. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com> * fix: improve tab bar color configuration using SwiftUI modifiers Fix tab bar colors by using proper SwiftUI approach instead of UIKit appearance APIs: - Use .tint(Color.primary) for selected items (auto-adapts to light/dark mode) - Set appearance.stackedLayoutAppearance for unselected text colors - Remove UITabBar.appearance().tintColor to fix dark mode color reversal Light mode: selected=black, unselected=light gray (78%) Dark mode: selected=white, unselected=dim gray (60%) Text colors now work correctly, icon colors need further fix. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com> * fix: simplify tab bar color configuration with accentColor Simplify the tab bar color implementation: - Use UITabBar.appearance().unselectedItemTintColor for unselected items (both icons and text) - Use .accentColor(Color.primary) modifier on TabView for selected items - Remove complex UITabBarAppearance layout configurations This simpler approach should properly apply colors to both icons and text: - Light mode: selected=black, unselected=light gray (78%) - Dark mode: selected=white, unselected=dim gray (60%) 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com> --------- Co-authored-by: Claude <noreply@anthropic.com>
1 parent 053bfdd commit a969d5f

File tree

1 file changed

+18
-0
lines changed

1 file changed

+18
-0
lines changed

V2er/View/MainPage.swift

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -24,6 +24,23 @@ struct MainPage: StateView {
2424
store.appState.feedState.feedInfo.unReadNums
2525
}
2626

27+
init() {
28+
// Configure unselected item color using UITabBar.appearance()
29+
// Selected color is controlled by .accentColor() modifier on TabView
30+
let unselectedColor = UIColor { traitCollection in
31+
switch traitCollection.userInterfaceStyle {
32+
case .dark:
33+
// Dark mode: dim gray (60% white)
34+
return UIColor(red: 0.6, green: 0.6, blue: 0.6, alpha: 1.0)
35+
default:
36+
// Light mode: very light gray (78% gray - very subtle)
37+
return UIColor(red: 0.78, green: 0.78, blue: 0.78, alpha: 1.0)
38+
}
39+
}
40+
41+
UITabBar.appearance().unselectedItemTintColor = unselectedColor
42+
}
43+
2744
// Create an intermediate binding that captures all tab selections
2845
// This is the proper SwiftUI way to detect same-tab taps without UIKit
2946
private var tabSelection: Binding<TabId> {
@@ -85,6 +102,7 @@ struct MainPage: StateView {
85102
}
86103
.tag(TabId.me)
87104
}
105+
.accentColor(Color.primary) // This controls the selected icon color in TabView
88106

89107
// Filter menu overlay - only render when needed
90108
if state.selectedTab == .feed && store.appState.feedState.showFilterMenu {

0 commit comments

Comments
 (0)