Я хочу создать эффекты перевода с помощью ScrollTransition.
Вот пример использования ScaleEffect. Я пробовал использовать TransformEffect для перевода, но этот модификатор, похоже, не работает с ScrollTransition. Есть ли другой способ создать эффект перевода?
struct ContentView: View {
var colors: [Color] = [.blue, .green, .yellow, .orange, .red]
var body: some View {
ScrollView(.horizontal) {
LazyHStack(spacing: 0) {
ForEach(colors, id: \.self) { color in
ZStack {
Rectangle()
.foregroundStyle(color)
Rectangle()
.foregroundStyle(.black)
.frame(width: 100, height: 100)
.scrollTransition { content, phase in
content
.scaleEffect(phase.isIdentity ? 1 : 0.6)
}
}
.containerRelativeFrame(.horizontal, count: 1, spacing: 0)
}
}
.scrollTargetLayout()
}
.scrollTargetBehavior(.viewAligned)
}
}





Используйте .offset(x:y:). Пример:
struct ContentView: View {
var colors: [Color] = [.blue, .green, .yellow, .orange, .red]
var body: some View {
ScrollView(.horizontal) {
LazyHStack(spacing: 0) {
ForEach(colors, id: \.self) { color in
ZStack {
Rectangle()
.foregroundStyle(color)
Rectangle()
.foregroundStyle(.black)
.frame(width: 100, height: 100)
.scrollTransition { content, phase in
content
.offset(y: phase.isIdentity ? 0 : 100)
.scaleEffect(phase.isIdentity ? 1 : 0.6)
.opacity(phase.isIdentity ? 1.0 : 0.0)
}
}
.containerRelativeFrame(.horizontal, count: 1, spacing: 0)
}
}
.scrollTargetLayout()
}
.scrollTargetBehavior(.viewAligned)
}
}
Спасибо! Есть ли способ изменить смещение в зависимости от направления, в котором вы проводите пальцем?