From 21da42f23b980a8bf55c93fd300f8a50d792e58c Mon Sep 17 00:00:00 2001 From: Arkadiusz Fal Date: Sat, 15 Nov 2025 20:08:18 +0100 Subject: [PATCH] Fix picker label visibility on macOS in settings Add visible labels for all pickers in settings on macOS by wrapping them in HStack with Text labels and Spacer() for proper alignment. Fixed pickers: - BrowsingSettings: Startup section, Thumbnails quality, Player bar gestures - PlayerControlsSettings: Action button labels - PlayerSettings: Source, Inspector, Caption size/color/languages, Sidebar All picker labels now consistently display with left-aligned text and right-aligned picker controls on macOS. --- Shared/Settings/BrowsingSettings.swift | 68 +++++-- Shared/Settings/PlayerControlsSettings.swift | 23 ++- Shared/Settings/PlayerSettings.swift | 175 +++++++++++++------ 3 files changed, 195 insertions(+), 71 deletions(-) diff --git a/Shared/Settings/BrowsingSettings.swift b/Shared/Settings/BrowsingSettings.swift index 5a0cc579..102982e1 100644 --- a/Shared/Settings/BrowsingSettings.swift +++ b/Shared/Settings/BrowsingSettings.swift @@ -145,11 +145,25 @@ struct BrowsingSettings: View { } func playerBarGesturePicker(_ label: String, selection: Binding) -> some View { - Picker(label, selection: selection) { - ForEach(PlayerTapGestureAction.allCases, id: \.rawValue) { action in - Text(action.label.localized()).tag(action) + #if os(macOS) + HStack { + Text(label) + Spacer() + Picker(label, selection: selection) { + ForEach(PlayerTapGestureAction.allCases, id: \.rawValue) { action in + Text(action.label.localized()).tag(action) + } + } + .modifier(SettingsPickerModifier()) } - } + #else + Picker(label, selection: selection) { + ForEach(PlayerTapGestureAction.allCases, id: \.rawValue) { action in + Text(action.label.localized()).tag(action) + } + } + .modifier(SettingsPickerModifier()) + #endif } var playerBarFooter: some View { @@ -220,12 +234,25 @@ struct BrowsingSettings: View { } private var thumbnailsQualityPicker: some View { - Picker("Quality", selection: $thumbnailsQuality) { - ForEach(ThumbnailsQuality.allCases, id: \.self) { quality in - Text(quality.description) + #if os(macOS) + HStack { + Text("Quality") + Spacer() + Picker("Quality", selection: $thumbnailsQuality) { + ForEach(ThumbnailsQuality.allCases, id: \.self) { quality in + Text(quality.description) + } + } + .modifier(SettingsPickerModifier()) } - } - .modifier(SettingsPickerModifier()) + #else + Picker("Quality", selection: $thumbnailsQuality) { + ForEach(ThumbnailsQuality.allCases, id: \.self) { quality in + Text(quality.description) + } + } + .modifier(SettingsPickerModifier()) + #endif } private var visibleSectionsSettings: some View { @@ -246,12 +273,25 @@ struct BrowsingSettings: View { #if os(tvOS) SettingsHeader(text: "Startup section".localized()) #endif - Picker("Startup section", selection: $startupSection) { - ForEach(StartupSection.allCases, id: \.rawValue) { section in - Text(section.label).tag(section) + #if os(macOS) + HStack { + Text("Startup section") + Spacer() + Picker("Startup section", selection: $startupSection) { + ForEach(StartupSection.allCases, id: \.rawValue) { section in + Text(section.label).tag(section) + } + } + .modifier(SettingsPickerModifier()) } - } - .modifier(SettingsPickerModifier()) + #else + Picker("Startup section", selection: $startupSection) { + ForEach(StartupSection.allCases, id: \.rawValue) { section in + Text(section.label).tag(section) + } + } + .modifier(SettingsPickerModifier()) + #endif } } diff --git a/Shared/Settings/PlayerControlsSettings.swift b/Shared/Settings/PlayerControlsSettings.swift index 36f50ec8..5e837008 100644 --- a/Shared/Settings/PlayerControlsSettings.swift +++ b/Shared/Settings/PlayerControlsSettings.swift @@ -132,12 +132,25 @@ struct PlayerControlsSettings: View { } Section { - Picker("Action button labels", selection: $playerActionsButtonLabelStyle) { - ForEach(ButtonLabelStyle.allCases, id: \.rawValue) { style in - Text(style.description).tag(style) + #if os(macOS) + HStack { + Text("Action button labels") + Spacer() + Picker("Action button labels", selection: $playerActionsButtonLabelStyle) { + ForEach(ButtonLabelStyle.allCases, id: \.rawValue) { style in + Text(style.description).tag(style) + } + } + .modifier(SettingsPickerModifier()) } - } - .modifier(SettingsPickerModifier()) + #else + Picker("Action button labels", selection: $playerActionsButtonLabelStyle) { + ForEach(ButtonLabelStyle.allCases, id: \.rawValue) { style in + Text(style.description).tag(style) + } + } + .modifier(SettingsPickerModifier()) + #endif } } diff --git a/Shared/Settings/PlayerSettings.swift b/Shared/Settings/PlayerSettings.swift index a8a03051..024d07a1 100644 --- a/Shared/Settings/PlayerSettings.swift +++ b/Shared/Settings/PlayerSettings.swift @@ -110,9 +110,9 @@ struct PlayerSettings: View { #if os(macOS) HStack { Text("Inspector") + Spacer() inspectorVisibilityPicker } - .padding(.leading, 20) #else inspectorVisibilityPicker #endif @@ -239,29 +239,51 @@ struct PlayerSettings: View { } private var sourcePicker: some View { - Picker("Source", selection: $playerInstanceID) { - Text("Instance of current account").tag(String?.none) + #if os(macOS) + HStack { + Text("Source") + Spacer() + Picker("Source", selection: $playerInstanceID) { + Text("Instance of current account").tag(String?.none) - ForEach(instances) { instance in - Text(instance.description).tag(Optional(instance.id)) + ForEach(instances) { instance in + Text(instance.description).tag(Optional(instance.id)) + } + } + .modifier(SettingsPickerModifier()) } - } - .modifier(SettingsPickerModifier()) + #else + Picker("Source", selection: $playerInstanceID) { + Text("Instance of current account").tag(String?.none) + + ForEach(instances) { instance in + Text(instance.description).tag(Optional(instance.id)) + } + } + .modifier(SettingsPickerModifier()) + #endif } private var sidebarPicker: some View { - Picker("Sidebar", selection: $playerSidebar) { - #if os(macOS) - Text("Show sidebar").tag(PlayerSidebarSetting.always) - #endif - - #if os(iOS) - Text("Show sidebar when space permits").tag(PlayerSidebarSetting.whenFits) - #endif - - Text("Hide sidebar").tag(PlayerSidebarSetting.never) - } - .modifier(SettingsPickerModifier()) + #if os(macOS) + HStack { + Text("Sidebar") + Spacer() + Picker("Sidebar", selection: $playerSidebar) { + Text("Show sidebar").tag(PlayerSidebarSetting.always) + Text("Hide sidebar").tag(PlayerSidebarSetting.never) + } + .modifier(SettingsPickerModifier()) + } + #else + Picker("Sidebar", selection: $playerSidebar) { + #if os(iOS) + Text("Show sidebar when space permits").tag(PlayerSidebarSetting.whenFits) + #endif + Text("Hide sidebar").tag(PlayerSidebarSetting.never) + } + .modifier(SettingsPickerModifier()) + #endif } private var commentsToggle: some View { @@ -363,56 +385,105 @@ struct PlayerSettings: View { } private var captionsFontScaleSizePicker: some View { - Picker("Size", selection: $captionsFontScaleSize) { - Text("Small").tag(String("0.725")) - Text("Medium").tag(String("1.0")) - Text("Large").tag(String("1.5")) - } - .onChange(of: captionsFontScaleSize) { _ in - PlayerModel.shared.mpvBackend.client.setSubFontSize(scaleSize: captionsFontScaleSize) - } #if os(macOS) - .labelsHidden() + HStack { + Text("Size") + Spacer() + Picker("Size", selection: $captionsFontScaleSize) { + Text("Small").tag(String("0.725")) + Text("Medium").tag(String("1.0")) + Text("Large").tag(String("1.5")) + } + .onChange(of: captionsFontScaleSize) { _ in + PlayerModel.shared.mpvBackend.client.setSubFontSize(scaleSize: captionsFontScaleSize) + } + .labelsHidden() + } + #else + Picker("Size", selection: $captionsFontScaleSize) { + Text("Small").tag(String("0.725")) + Text("Medium").tag(String("1.0")) + Text("Large").tag(String("1.5")) + } + .onChange(of: captionsFontScaleSize) { _ in + PlayerModel.shared.mpvBackend.client.setSubFontSize(scaleSize: captionsFontScaleSize) + } #endif } private var captionsFontColorPicker: some View { - Picker("Color", selection: $captionsFontColor) { - Text("White").tag(String("#FFFFFF")) - Text("Yellow").tag(String("#FFFF00")) - Text("Red").tag(String("#FF0000")) - Text("Orange").tag(String("#FFA500")) - Text("Green").tag(String("#008000")) - Text("Blue").tag(String("#0000FF")) - } - .onChange(of: captionsFontColor) { _ in - PlayerModel.shared.mpvBackend.client.setSubFontColor(color: captionsFontColor) - } #if os(macOS) - .labelsHidden() + HStack { + Text("Color") + Spacer() + Picker("Color", selection: $captionsFontColor) { + Text("White").tag(String("#FFFFFF")) + Text("Yellow").tag(String("#FFFF00")) + Text("Red").tag(String("#FF0000")) + Text("Orange").tag(String("#FFA500")) + Text("Green").tag(String("#008000")) + Text("Blue").tag(String("#0000FF")) + } + .onChange(of: captionsFontColor) { _ in + PlayerModel.shared.mpvBackend.client.setSubFontColor(color: captionsFontColor) + } + .labelsHidden() + } + #else + Picker("Color", selection: $captionsFontColor) { + Text("White").tag(String("#FFFFFF")) + Text("Yellow").tag(String("#FFFF00")) + Text("Red").tag(String("#FF0000")) + Text("Orange").tag(String("#FFA500")) + Text("Green").tag(String("#008000")) + Text("Blue").tag(String("#0000FF")) + } + .onChange(of: captionsFontColor) { _ in + PlayerModel.shared.mpvBackend.client.setSubFontColor(color: captionsFontColor) + } #endif } #if !os(tvOS) private var captionDefaultLanguagePicker: some View { - Picker("Default language", selection: $captionsDefaultLanguageCode) { - ForEach(LanguageCodes.allCases, id: \.self) { language in - Text("\(language.description.capitalized) (\(language.rawValue))").tag(language.rawValue) - } - } #if os(macOS) - .labelsHidden() + HStack { + Text("Default language") + Spacer() + Picker("Default language", selection: $captionsDefaultLanguageCode) { + ForEach(LanguageCodes.allCases, id: \.self) { language in + Text("\(language.description.capitalized) (\(language.rawValue))").tag(language.rawValue) + } + } + .labelsHidden() + } + #else + Picker("Default language", selection: $captionsDefaultLanguageCode) { + ForEach(LanguageCodes.allCases, id: \.self) { language in + Text("\(language.description.capitalized) (\(language.rawValue))").tag(language.rawValue) + } + } #endif } private var captionFallbackLanguagePicker: some View { - Picker("Fallback language", selection: $captionsFallbackLanguageCode) { - ForEach(LanguageCodes.allCases, id: \.self) { language in - Text("\(language.description.capitalized) (\(language.rawValue))").tag(language.rawValue) - } - } #if os(macOS) - .labelsHidden() + HStack { + Text("Fallback language") + Spacer() + Picker("Fallback language", selection: $captionsFallbackLanguageCode) { + ForEach(LanguageCodes.allCases, id: \.self) { language in + Text("\(language.description.capitalized) (\(language.rawValue))").tag(language.rawValue) + } + } + .labelsHidden() + } + #else + Picker("Fallback language", selection: $captionsFallbackLanguageCode) { + ForEach(LanguageCodes.allCases, id: \.self) { language in + Text("\(language.description.capitalized) (\(language.rawValue))").tag(language.rawValue) + } + } #endif } #else