From dc56323d4635a45e14d75df98272aa95c512259c Mon Sep 17 00:00:00 2001 From: Joe Date: Sun, 2 Mar 2025 15:09:00 -0700 Subject: [PATCH] Background on Focus? --- ...rButton.swift => FilterPickerButton.swift} | 4 +- .../FilterPickerBar/FilterPickerBar.swift | 90 +++++++++++++------ Swiftfin.xcodeproj/project.pbxproj | 8 +- 3 files changed, 68 insertions(+), 34 deletions(-) rename Swiftfin tvOS/Components/LibraryFilters/FilterPickerBar/Components/{FilterButton.swift => FilterPickerButton.swift} (96%) diff --git a/Swiftfin tvOS/Components/LibraryFilters/FilterPickerBar/Components/FilterButton.swift b/Swiftfin tvOS/Components/LibraryFilters/FilterPickerBar/Components/FilterPickerButton.swift similarity index 96% rename from Swiftfin tvOS/Components/LibraryFilters/FilterPickerBar/Components/FilterButton.swift rename to Swiftfin tvOS/Components/LibraryFilters/FilterPickerBar/Components/FilterPickerButton.swift index 5e1948252..f5c8f4f35 100644 --- a/Swiftfin tvOS/Components/LibraryFilters/FilterPickerBar/Components/FilterButton.swift +++ b/Swiftfin tvOS/Components/LibraryFilters/FilterPickerBar/Components/FilterPickerButton.swift @@ -40,7 +40,7 @@ extension FilterPickerBar { private let collapsedWidth: CGFloat = 75 private var expandedWidth: CGFloat { - textWidth(for: title) + 20 + collapsedWidth + FilterPickerBar.FilterPickerButton.textWidth(for: title) + 20 + collapsedWidth } // MARK: - Button Styles @@ -69,7 +69,7 @@ extension FilterPickerBar { // MARK: - Text Width - private func textWidth(for text: String) -> CGFloat { + static func textWidth(for text: String) -> CGFloat { let textSize = String().height( withConstrainedWidth: CGFloat.greatestFiniteMagnitude, font: UIFont.preferredFont( diff --git a/Swiftfin tvOS/Components/LibraryFilters/FilterPickerBar/FilterPickerBar.swift b/Swiftfin tvOS/Components/LibraryFilters/FilterPickerBar/FilterPickerBar.swift index c5ec7fac5..1dacb0634 100644 --- a/Swiftfin tvOS/Components/LibraryFilters/FilterPickerBar/FilterPickerBar.swift +++ b/Swiftfin tvOS/Components/LibraryFilters/FilterPickerBar/FilterPickerBar.swift @@ -22,42 +22,76 @@ struct FilterPickerBar: View { private var filterTypes: [ItemFilterType] private var onSelect: (FilterCoordinator.Parameters) -> Void + @FocusState + private var isFocused: Bool + // MARK: - Body var body: some View { - VStack(spacing: 20) { - if viewModel.currentFilters.hasFilters { - FilterPickerButton( - systemName: "line.3.horizontal.decrease.circle.fill", - title: L10n.reset, - role: .destructive - ) - .onSelect { - viewModel.send(.reset()) - } - .environment(\.isSelected, true) - } else { - // Leave space for the Reset Button - Spacer() - .frame(width: 75, height: 75) + ZStack(alignment: .leading) { + + if isFocused { + selectedButtonBackground + .animation(.easeIn(duration: 0.2), value: isFocused) + .transition(.move(edge: .leading).combined(with: .opacity)) } - ForEach(filterTypes, id: \.self) { type in - FilterPickerButton( - systemName: type.systemImage, - title: type.displayTitle - ) - .onSelect { - onSelect(.init(type: type, viewModel: viewModel)) + VStack(spacing: 20) { + if viewModel.currentFilters.hasFilters { + FilterPickerButton( + systemName: "line.3.horizontal.decrease.circle.fill", + title: L10n.reset, + role: .destructive + ) + .onSelect { + viewModel.send(.reset()) + } + .environment(\.isSelected, true) + .background( + selectedButtonBackground + ) + } else { + // Leave space for the Reset Button + Spacer() + .frame(width: 75, height: 75) + } + + ForEach(filterTypes, id: \.self) { type in + FilterPickerButton( + systemName: type.systemImage, + title: type.displayTitle + ) + .onSelect { + onSelect(.init(type: type, viewModel: viewModel)) + } + .environment( + \.isSelected, + viewModel.isFilterSelected(type: type) + ) + .background( + viewModel.isFilterSelected(type: type) ? selectedButtonBackground : nil + ) } - .environment( - \.isSelected, - viewModel.isFilterSelected(type: type) - ) } + .focused($isFocused) + .padding(.horizontal, 0) + .padding(.vertical, 1) } - .padding(.horizontal, 0) - .padding(.vertical, 1) + } + + private var selectedButtonBackground: some View { + Rectangle() + .fill(.regularMaterial) + .frame( + width: FilterPickerBar.FilterPickerButton + .textWidth( + for: filterTypes.map(\.displayTitle) + .max(by: { $0.count < $1.count }) ?? "" + ) + 150 + ) + .ignoresSafeArea() + .edgesIgnoringSafeArea(.leading) + .edgesIgnoringSafeArea(.vertical) } } diff --git a/Swiftfin.xcodeproj/project.pbxproj b/Swiftfin.xcodeproj/project.pbxproj index f167ff220..c6a794e89 100644 --- a/Swiftfin.xcodeproj/project.pbxproj +++ b/Swiftfin.xcodeproj/project.pbxproj @@ -210,7 +210,7 @@ 4EBE064F2C7ECE8D004A6C03 /* InlineEnumToggle.swift in Sources */ = {isa = PBXBuildFile; fileRef = E1549677296CB22B00C4EF88 /* InlineEnumToggle.swift */; }; 4EBE06532C7ED0E1004A6C03 /* DeviceProfile.swift in Sources */ = {isa = PBXBuildFile; fileRef = 4EBE06502C7ED0E1004A6C03 /* DeviceProfile.swift */; }; 4EBE06542C7ED0E1004A6C03 /* DeviceProfile.swift in Sources */ = {isa = PBXBuildFile; fileRef = 4EBE06502C7ED0E1004A6C03 /* DeviceProfile.swift */; }; - 4EC07D3B2D6F95E60052DC2C /* FilterButton.swift in Sources */ = {isa = PBXBuildFile; fileRef = 4EC07D382D6F95E60052DC2C /* FilterButton.swift */; }; + 4EC07D3B2D6F95E60052DC2C /* FilterPickerButton.swift in Sources */ = {isa = PBXBuildFile; fileRef = 4EC07D382D6F95E60052DC2C /* FilterPickerButton.swift */; }; 4EC1C8522C7FDFA300E2879E /* PlaybackDeviceProfile.swift in Sources */ = {isa = PBXBuildFile; fileRef = 4EC1C8512C7FDFA300E2879E /* PlaybackDeviceProfile.swift */; }; 4EC1C8532C7FDFA300E2879E /* PlaybackDeviceProfile.swift in Sources */ = {isa = PBXBuildFile; fileRef = 4EC1C8512C7FDFA300E2879E /* PlaybackDeviceProfile.swift */; }; 4EC1C8692C808FBB00E2879E /* CustomDeviceProfileSettingsView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 4EC1C8682C808FBB00E2879E /* CustomDeviceProfileSettingsView.swift */; }; @@ -1433,7 +1433,7 @@ 4EBE06452C7E9509004A6C03 /* PlaybackCompatibility.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = PlaybackCompatibility.swift; sourceTree = ""; }; 4EBE064C2C7EB6D3004A6C03 /* VideoPlayerType.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = VideoPlayerType.swift; sourceTree = ""; }; 4EBE06502C7ED0E1004A6C03 /* DeviceProfile.swift */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.swift; path = DeviceProfile.swift; sourceTree = ""; }; - 4EC07D382D6F95E60052DC2C /* FilterButton.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = FilterButton.swift; sourceTree = ""; }; + 4EC07D382D6F95E60052DC2C /* FilterPickerButton.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = FilterPickerButton.swift; sourceTree = ""; }; 4EC1C8512C7FDFA300E2879E /* PlaybackDeviceProfile.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = PlaybackDeviceProfile.swift; sourceTree = ""; }; 4EC1C8572C80332500E2879E /* EditCustomDeviceProfileCoordinator.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = EditCustomDeviceProfileCoordinator.swift; sourceTree = ""; }; 4EC1C8682C808FBB00E2879E /* CustomDeviceProfileSettingsView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = CustomDeviceProfileSettingsView.swift; sourceTree = ""; }; @@ -2677,7 +2677,7 @@ 4E81D2B52D72B1D600CA71CC /* Components */ = { isa = PBXGroup; children = ( - 4EC07D382D6F95E60052DC2C /* FilterButton.swift */, + 4EC07D382D6F95E60052DC2C /* FilterPickerButton.swift */, ); path = Components; sourceTree = ""; @@ -5949,7 +5949,7 @@ 4E7315762D1485CC00EA2A95 /* UserProfileHeroImage.swift in Sources */, E18A8E7E28D606BE00333B9A /* BaseItemDto+VideoPlayerViewModel.swift in Sources */, E1E6C43B29AECBD30064123F /* BottomBarView.swift in Sources */, - 4EC07D3B2D6F95E60052DC2C /* FilterButton.swift in Sources */, + 4EC07D3B2D6F95E60052DC2C /* FilterPickerButton.swift in Sources */, E190704C2C858CEB0004600E /* VideoPlayerType+Shared.swift in Sources */, E152107D2947ACA000375CC2 /* InvertedLightAppIcon.swift in Sources */, E1549663296CA2EF00C4EF88 /* UserSession.swift in Sources */,