İçeriğe geç

SwiftUI ile ScrollView Scale Effect

Merhabalar bu yazımda SwiftUI ile birlikte ScrollView kullanırken nesnelere başlangıç konumlarından x konumunu okuyarak güzel bir efekt oluşturmayı paylaşacağım.

SwiftUI ile ScrollView nesnesinin x veya y hareketini okumak ve buna göre işlem yapmak için GeometryReader bloğunu kullanmamız gerekli. İlgili ScrollView nesnesinin x konumuna göre ilk nesneye scaleEffect()  fonksiyonu yardımı ile görsellik kazandıralım.

struct ContentView: View {
    
    var body: some View {
        VStack {
            ScrollView(.horizontal, showsIndicators: false) {
                HStack(spacing: 120) {
                    ForEach(0..<20) { num in
                        GeometryReader { proxy in
                            VStack {
                                let scale = getScale(proxy: proxy)
                                Image("la")
                                    .resizable()
                                    .scaledToFill()
                                    .frame(width: 200)
                                    .overlay(
                                        RoundedRectangle(cornerRadius: 5).stroke(lineWidth: 0.5)
                                    )
                                    .clipped()
                                    .cornerRadius(5)
                                    .shadow(radius: 5)
                                    .scaleEffect(CGSize(width: scale, height: scale))
                                    .animation(.easeOut(duration: 0.5))
                            }
                        }
                        .frame(width: 125, height: 300)
                    }
                }.padding(40)
            }
        }
    }
    
    private func getScale(proxy: GeometryProxy) -> CGFloat {
        var scale: CGFloat = 1
        let x = proxy.frame(in: .global).minX
        let diff = abs(x - 32)
        if diff < 100 {
            scale = 1 + (100 - diff) / 500
        }
        return scale
    }
}

Sizlerde proxy değişkeninden elde ettiğiniz x, y değerleri ile farklı işlemler, animasyonlar yapabilirsiniz.

Tarih:SwiftUI

İlk Yorumu Siz Yapın

Bir cevap yazın

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir

Copyright © 2021 Kenan Atmaca