仅当标题被固定时才自定义节标题,否则不会(SwiftUI)

Rob*_*mac 5 header ios swift swiftui

我的问题很简单:是否有任何方法可以仅在固定节时自定义节的标题,但如果未固定则保持其原样?

我试图将 .shadow 添加到部分的标题中,但我不希望它始终可见,但仅在开始向下滚动经过父 ScrollView 中的标题时(当标题被固定时)。

我主要寻找一个纯粹的 SwiftUI 解决方案,但我也愿意讨论其他解决方案。:)

struct WorkoutCardView: View {
    @Binding var workout: Workout
    @State var expandWorkout: Bool = false
    
    @Environment(\.colorScheme) var colorScheme
    
    var body: some View {
        LazyVStack(alignment: .leading, pinnedViews: .sectionHeaders) {
            Section {
                if expandWorkout {
                    WCExerciseSectionView(workout: $workout)
                }
            } header: {
                WCTitleSectionView(workout: $workout)
                    .background {
                        Color(uiColor: .systemBackground)
                        Color(uiColor: .systemFill)
                    }
                    .cornerRadius(10)
                    .shadow(color: colorScheme == .light ?
                            Color.black.opacity(expandWorkout ? 0.6 : 0) :
                                Color.white.opacity(expandWorkout ? 0.6 : 0), radius: 5, x: 0, y: 2)
                    .padding(.all, 2)
            }
        }
        .padding(.all, 8)
        .background {
            RoundedRectangle(cornerRadius: 10)
                .fill(Color(uiColor: .systemFill))
        }
        .padding(.all, 8)
        .onTapGesture {
            withAnimation {
                expandWorkout.toggle()
            }
        }
    }
}
Run Code Online (Sandbox Code Playgroud)

在这里检查当前结果

Asp*_*eri 10

一种可能的方法是基于相对于容器坐标空间的标头位置的动态检测,如果它为零(即固定在顶部),则相应地更改样式。

使用 Xcode 13.4 / iOS 15.5 进行测试

演示

这是主要部分:

                } header: {
                    HeaderView(value: "HEADER \(i + 1)", pinned: i == pinned)
                        .background(GeometryReader {
                            // detect current position of header
                            Color.clear.preference(key: ViewOffsetKey.self,
                                value: $0.frame(in: .named("area")).origin.y)
                        })
                }
                .onPreferenceChange(ViewOffsetKey.self) {
                    // verify if position is zero (pinned) in container coordinates
                    if $0 == 0 {
                        self.pinned = i
                    } else if self.pinned == i {
                        // clean-up if changed (might depend - for simplicity)
                        self.pinned = nil
                    }
                }
            }
        }
    }.clipped()
}.coordinateSpace(name: "area")    // << here !!
Run Code Online (Sandbox Code Playgroud)

GitHub 上的测试模块