diff --git a/Course/Course/Presentation/Outline/CourseExpandableContentView.swift b/Course/Course/Presentation/Outline/CourseExpandableContentView.swift index ee742d727..d0f73e917 100644 --- a/Course/Course/Presentation/Outline/CourseExpandableContentView.swift +++ b/Course/Course/Presentation/Outline/CourseExpandableContentView.swift @@ -50,14 +50,9 @@ struct CourseExpandableContentView: View { .lineLimit(1) .foregroundColor(Theme.Colors.textPrimary) Spacer() - if isExpanded { - Image(systemName: "chevron.right") - .foregroundColor(Theme.Colors.accentColor) - .rotationEffect(.degrees(90)) - } else { - Image(systemName: "chevron.right") - .foregroundColor(Theme.Colors.accentColor) - } + Image(systemName: "chevron.right") + .foregroundColor(Theme.Colors.accentColor) + .dropdownArrowRotationAnimation(value: isExpanded) } .padding(.horizontal, 30) .padding(.vertical, 15) diff --git a/Course/Course/Presentation/Unit/CourseUnitView.swift b/Course/Course/Presentation/Unit/CourseUnitView.swift index 6cbcb2aa3..311643472 100644 --- a/Course/Course/Presentation/Unit/CourseUnitView.swift +++ b/Course/Course/Presentation/Unit/CourseUnitView.swift @@ -296,21 +296,26 @@ public struct CourseUnitView: View { } } VStack { - NavigationBar( - title: isDropdownActive ? sequenceTitle : "", - leftButtonAction: { - viewModel.router.back() - playerStateSubject.send(VideoPlayerState.kill) - }).padding(.top, isHorizontal ? 10 : 0) + Group { + NavigationBar( + title: isDropdownActive ? sequenceTitle : "", + leftButtonAction: { + viewModel.router.back() + playerStateSubject.send(VideoPlayerState.kill) + }) + .padding(.top, isHorizontal ? 10 : 0) .padding(.leading, isHorizontal ? -16 : 0) - if isDropdownActive { - CourseUnitDropDownTitle( - title: unitTitle, - isAvailable: isDropdownAvailable, - showDropdown: $showDropdown) - .padding(.top, 0) - .offset(y: -25) + if isDropdownActive { + CourseUnitDropDownTitle( + title: unitTitle, + isAvailable: isDropdownAvailable, + showDropdown: $showDropdown) + .padding(.top, 0) + .padding(.horizontal, 48) + .offset(y: -25) + } } + .padding(.trailing, isHorizontal ? 215 : 0) Spacer() } HStack(alignment: .center) { diff --git a/Course/Course/Presentation/Unit/Subviews/DropdownList/CourseUnitDropDownTitle.swift b/Course/Course/Presentation/Unit/Subviews/DropdownList/CourseUnitDropDownTitle.swift index e2d83af16..413edcc8e 100644 --- a/Course/Course/Presentation/Unit/Subviews/DropdownList/CourseUnitDropDownTitle.swift +++ b/Course/Course/Presentation/Unit/Subviews/DropdownList/CourseUnitDropDownTitle.swift @@ -22,19 +22,17 @@ struct CourseUnitDropDownTitle: View { HStack { Text(title) .opacity(showDropdown ? 0.7 : 1.0) + .lineLimit(1) if isAvailable { - if showDropdown { - Image(systemName: "chevron.right") - .rotationEffect(.degrees(90)) - } else { - Image(systemName: "chevron.right") - } + Image(systemName: "chevron.right") + .dropdownArrowRotationAnimation(value: showDropdown) } } } .buttonStyle(.plain) } else { Text(title) + .lineLimit(1) } } } diff --git a/Course/Course/Presentation/Unit/Subviews/DropdownList/CourseUnitVerticalsDropdownView.swift b/Course/Course/Presentation/Unit/Subviews/DropdownList/CourseUnitVerticalsDropdownView.swift index 94c83ec7f..cf3db4309 100644 --- a/Course/Course/Presentation/Unit/Subviews/DropdownList/CourseUnitVerticalsDropdownView.swift +++ b/Course/Course/Presentation/Unit/Subviews/DropdownList/CourseUnitVerticalsDropdownView.swift @@ -22,6 +22,12 @@ struct CourseUnitVerticalsDropdownView: View { .onTapGesture { showDropdown.toggle() } + .simultaneousGesture( + DragGesture() + .onChanged { _ in + if showDropdown { showDropdown.toggle() } + } + ) CourseUnitDropDownList(content: { ForEach(verticals, id: \.id) { vertical in let isLast = verticals.last?.id == vertical.id @@ -31,6 +37,10 @@ struct CourseUnitVerticalsDropdownView: View { isLast: isLast, isSelected: isSelected ) { + if isSelected { + showDropdown.toggle() + return + } action(vertical) } } diff --git a/Course/Course/Presentation/Unit/Subviews/DropdownList/DropdownAnimationModifier.swift b/Course/Course/Presentation/Unit/Subviews/DropdownList/DropdownAnimationModifier.swift index b1529edb9..c1ef7d230 100644 --- a/Course/Course/Presentation/Unit/Subviews/DropdownList/DropdownAnimationModifier.swift +++ b/Course/Course/Presentation/Unit/Subviews/DropdownList/DropdownAnimationModifier.swift @@ -20,8 +20,21 @@ struct DropdownAnimationModifier: ViewModifier where V: Equatable { } } +struct DropdownArrowRotationModifier: ViewModifier { + var value: Bool + func body(content: Content) -> some View { + content + .rotationEffect(value ? .degrees(90) : .degrees(0)) + .animation(.easeOut(duration: 0.2), value: value) + } +} + extension View { func dropdownAnimation(isActive: Bool, value: V) -> some View where V: Equatable { modifier(DropdownAnimationModifier(isActive: isActive, value: value)) } + + func dropdownArrowRotationAnimation(value: Bool) -> some View { + modifier(DropdownArrowRotationModifier(value: value)) + } }