Published on

SwiftUI-da RotationGesture-dan qanday foydalanish kerak

Authors

RotationGesture nima

RotationGesture β€” qurilmada ikki barmog'ingizni aylantirib, elementni aylantirish (rotate) gesture-i. Matn, rasm yoki istalgan SwiftUI elementiga qo'shish mumkin.

Bu gesture production ilovalarda kam ishlatiladi β€” aksariyat hollarda foydalanuvchi elementni qo'lda aylantirishga ehtiyoj sezilmaydi. Shuning uchun bu video qisqa bo'ladi, keyingi video esa DragGesture haqida bo'ladi β€” u ancha keng qo'llaniladi.

Yangi fayl

RotationGestureBootcamp nomli yangi SwiftUI View fayl yaratamiz.

Kod

@State private var angle: Angle = Angle(degrees: 0)

var body: some View {
    Text("Hello, World!")
        .font(.largeTitle)
        .fontWeight(.semibold)
        .foregroundColor(.white)
        .padding(50)
        .background(Color.blue)
        .cornerRadius(10)
        .rotationEffect(angle)
        .gesture(
            RotationGesture()
                .onChanged { value in
                    angle = value
                }
                .onEnded { value in
                    withAnimation(.spring()) {
                        angle = Angle(degrees: 0)
                    }
                }
        )
}

Tushuntirish

  • Angle β€” Swift-ning o'rnatilgan tur, burchakni ifodalaydi. Angle(degrees: 0) β€” boshlang'ich holat (aylantirilmagan).
  • .rotationEffect(angle) β€” elementni berilgan burchakka aylantiradi.
  • onChanged β€” gesture davomida value (joriy burchak) anglega o'rnatiladi.
  • onEnded β€” gesture tugaganda, withAnimation(.spring()) bilan burchak 0ga qaytadi β€” "sakrab qaytish" effekti.

MagnificationGesture bilan solishtirma

MagnificationGestureRotationGesture
Modifier.scaleEffect(...).rotationEffect(...)
Qiymat turiCGFloatAngle
onChangedcurrentAmount = value - 1angle = value
onEndedlastAmount += currentAmountangle = Angle(degrees: 0)

Tuzilma deyarli bir xil β€” faqat gesture turi va ishlanadigan qiymat o'zgaradi.

Simulatorda sinash

Gesture-lar preview-da yaxshi ishlamaydi β€” simulatorda sinash kerak. Simulatorda ikki barmog'ini ko'rsatish uchun Option tugmasini bosib ushlab turing, so'ngra bosing va aylantiring. Qo'l ko'tarilganda element spring animatsiya bilan boshlang'ich holatiga qaytadi.

Eslatma: Simulatorda Option tugmasini bosib-ushlab turish davomida qo'l ko'tarish kerak β€” Option-ni avval qo'ysangiz, element o'sha joyda "qotib" qoladi.

Buy mea coffee