Bilvosita animatsiyalar


ULASHISH

SwiftUI animatsiyalar: bilvosita (implicit)

Bog‘langan qiymatdagi o‘zgarishlar avtomatik animatsiya qilinishi uchun view’ga animatsiya biriktiring.


Sintaksis

Animatsiyani biriktirish: .animation(.easeInOut, value: state).

state ga bog‘liq har qanday modifikator state o‘zgarganda animatsiya qilinadi.


Bosib kattalashtirish (bilvosita)

Doiraga .animation(..., value: on) ni biriktirish on almashganda uning o‘lchami va rangini animatsiya qiladi.

Misol

import SwiftUI

struct ImplicitAnimDemo: View {
  @State private var on = false
  var body: some View {
    VStack(spacing: 12) {
      Circle()
        .fill(on ? .green : .gray)
        .frame(width: on ? 120 : 60, height: on ? 120 : 60)
        .animation(.spring(), value: on)
      Button(on ? "Reset" : "Grow") { on.toggle() }
    }
    .padding()
  }
}
import SwiftUI

struct ContentView: View {
  var body: some View { ImplicitAnimDemo() }
}
import SwiftUI

@main
struct MyApp: App {
  var body: some Scene {
    WindowGroup { ContentView() }
  }
}

Misolni ishga tushirish »

Yuqoridagi misolda on state’i o‘zgarganda doiraning o‘lchami va rangi animatsiya qilinadi.



Bir nechta modifikatorni bilvosita animatsiya qilish

Bitta .animation ni biriktiring va bir nechta xususiyatni o‘zgartiring; state almashganda masshtab, shaffoflik va rang animatsiya qilinadi.

Misol

import SwiftUI

struct ImplicitMultiDemo: View {
  @State private var on = false
  var body: some View {
    VStack(spacing: 16) {
      Image(systemName: "star.fill")
        .font(.system(size: 48))
        .foregroundStyle(on ? .yellow : .gray)
        .scaleEffect(on ? 1.25 : 1.0)
        .opacity(on ? 1 : 0.6)
        .animation(.easeInOut(duration: 0.6), value: on)
      Button(on ? "Reset" : "Animate") { on.toggle() }
    }
    .padding()
  }
}
import SwiftUI

struct ContentView: View {
  var body: some View { ImplicitMultiDemo() }
}
import SwiftUI

@main
struct MyApp: App {
  var body: some Scene {
    WindowGroup { ContentView() }
  }
}

Misolni ishga tushirish »

Yuqoridagi misolda on state’i o‘zgarganda yulduzning o‘lchami, rangi va shaffofligi animatsiya qilinadi.



W3Schools Pathfinder

Yutuqlaringizni kuzating – bu bepul!