Swift Academy · Pelajaran

Animasi Tersirat dan Eksplisit

Animasikan sifat lapisan dengan CABasicAnimation.

Pelajaran 2 daripada 413 langkah

Animasi Tersirat dan Eksplisit ialah pelajaran Swift Academy percuma di CoddyKit. Ini ialah pelajaran 2 daripada 4. Sebanyak 3 pelajaran dalam laluan pembelajaran ini boleh dibaca sepenuhnya secara percuma — selepas itu, CoddyKit PRO membuka akses kepada semua pelajaran, serta latihan praktikal dengan penyunting kod terbina dalam dan tutor kecerdasan buatan yang tersedia 24/7. Pelajaran ini merupakan sebahagian daripada laluan pembelajaran Swift Academy, dan kemajuan anda disegerakkan merentas web serta aplikasi CoddyKit. Kursus Swift Academy merangkumi sejumlah 4 pelajaran.

Dua Cara untuk Menganimasikan Layer

Core Animation menawarkan animasi tersirat, iaitu automatik apabila sifat berubah, dan animasi jelas, iaitu objek animasi yang anda cipta sendiri.

Memahami kedua-duanya serta cara kedua-duanya berinteraksi ialah kunci kepada pergerakan yang lancar.

Animasi Tersirat

Mengubah sifat yang boleh dianimasikan bagi layer kendiri mencetuskan animasi tersirat menggunakan lengkung lalai 0.25s—tiada objek animasi diperlukan.

let layer = CALayer()
// Later, this animates automatically:
layer.opacity = 0.0

Sifat yang Boleh Dianimasikan

Banyak sifat layer boleh dianimasikan: opacity, position, bounds, backgroundColor, transform, cornerRadius dan banyak lagi.

layer.cornerRadius = 20 // animates implicitly
layer.backgroundColor = UIColor.systemGreen.cgColor

Tindakan dan Mekanisme Tindakan

Animasi tersirat didorong oleh tindakan. Apabila sifat berubah, layer mencari CAAction untuk dijalankan. Anda boleh menyesuaikan atau melumpuhkan tindakan ini.

Layer yang Disokong Paparan Melumpuhkan Animasi Tersirat

Layer yang dilampirkan pada UIView mempunyai animasi tersirat yang dimatikan. Sebaliknya, animasikan layer tersebut melalui UIView.animate atau gunakan animasi jelas.

UIView.animate(withDuration: 0.3) {
    view.alpha = 0
}

CABasicAnimation

CABasicAnimation menganimasikan satu sifat antara fromValue dan toValue. Tambahkannya pada layer dengan laluan kunci yang sepadan dengan sifat tersebut.

let anim = CABasicAnimation(keyPath: "opacity")
anim.fromValue = 1.0
anim.toValue = 0.0
anim.duration = 0.5
layer.add(anim, forKey: "fade")

Persembahan vs Model

Animasi jelas hanya mengubah nilai persembahan pada skrin; nilai model layer kembali semula apabila animasi tamat.

Untuk mengekalkan perubahan itu, tetapkan nilai model juga.

layer.opacity = 0.0 // set model value so it persists
layer.add(anim, forKey: "fade")

Animasi Bingkai Utama

CAKeyframeAnimation menganimasikan beberapa values melalui keyTimes, atau sepanjang path—sesuai untuk lantunan atau pergerakan sepanjang lengkung.

let move = CAKeyframeAnimation(keyPath: "position")
move.values = [
    NSValue(cgPoint: CGPoint(x: 0, y: 0)),
    NSValue(cgPoint: CGPoint(x: 100, y: 0)),
    NSValue(cgPoint: CGPoint(x: 100, y: 100))
]
move.duration = 1.0
layer.add(move, forKey: "path")

Fungsi Pemasaan

Kawal pecutan dengan timingFunction: ease-in, ease-out, linear atau Bezier kubik tersuai.

anim.timingFunction = CAMediaTimingFunction(name: .easeInEaseOut)

Pengumpulan dan Transaksi

Bungkus beberapa perubahan dalam CATransaction untuk berkongsi tempoh dan pemasaan, atau untuk melumpuhkan animasi tersirat sepenuhnya.

CATransaction.begin()
CATransaction.setDisableActions(true)
layer.position = CGPoint(x: 200, y: 200)
CATransaction.commit()

Delegat Animasi dan Penyelesaian

Tetapkan CATransaction.setCompletionBlock atau delegat animasi untuk menjalankan kod apabila pergerakan selesai—pembersihan, penyambungan atau kemas kini keadaan.

CATransaction.begin()
CATransaction.setCompletionBlock { print("done") }
layer.add(anim, forKey: "fade")
CATransaction.commit()

Semakan Pantas: Animasi

Uji pemahaman anda tentang animasi tersirat berbanding animasi jelas.

Imbas Kembali: Animasi Tersirat dan Jelas

Layer kendiri menganimasikan perubahan sifat yang boleh dianimasikan secara tersirat melalui tindakan; layer yang disokong paparan melumpuhkan ciri ini dan menggunakan UIView.animate. CABasicAnimation dan CAKeyframeAnimation yang jelas menganimasikan nilai persembahan, jadi kemas kini nilai model untuk mengekalkan hasilnya.

Laraskan pergerakan dengan fungsi pemasaan, kelompokkan perubahan dalam CATransaction, dan gunakan blok penyelesaian untuk kerja susulan.

Percuma untuk bermula

Pelajari Swift dengan tutor kecerdasan buatan — percuma

Tulis dan jalankan kod sebenar dalam pelayar anda, dapatkan bantuan segera daripada tutor kecerdasan buatan yang tersedia 24/7, dan sambung semula dari tempat anda berhenti di web atau dalam aplikasi.

Kursus
122
Pelajaran
409

Soalan Lazim

Adakah pelajaran “Animasi Tersirat dan Eksplisit” percuma?

Ya — sebanyak 3 pelajaran dalam laluan pembelajaran Swift Academy, termasuk “Animasi Tersirat dan Eksplisit”, boleh dibaca sepenuhnya secara percuma di web ini. Selepas itu, CoddyKit PRO membuka akses kepada semua pelajaran, serta latihan interaktif dengan penyunting kod terbina dalam dan tutor kecerdasan buatan yang tersedia 24/7. Kursus Swift Academy merangkumi sejumlah 4 pelajaran.

Apakah yang akan saya pelajari dalam “Animasi Tersirat dan Eksplisit”?

Animasikan sifat lapisan dengan CABasicAnimation. Anda berlatih Swift Academy menggunakan kod praktikal yang dijalankan terus dalam pelayar, manakala tutor kecerdasan buatan 24/7 menjawab soalan anda semasa anda mengikuti pelajaran.

Adakah saya memerlukan pengalaman untuk memulakan Swift Academy?

Tiada pengalaman terdahulu diperlukan. Pembelajaran Swift Academy di CoddyKit disusun untuk pelajar daripada peringkat pemula hingga lanjutan, jadi anda boleh bermula di sini atau dari awal dan belajar mengikut kadar anda sendiri. Ini ialah pelajaran 2 daripada 4.

Berapa lamakah pelajaran “Animasi Tersirat dan Eksplisit” diambil?

Kebanyakan pelajaran CoddyKit mengambil masa kira-kira 5–10 minit. Setiap pelajaran ringkas dan interaktif, jadi anda boleh membuat kemajuan secara berterusan dan menyambung tepat dari tempat anda berhenti di web atau aplikasi.

Bolehkah saya menulis dan menjalankan kod dalam pelajaran Swift Academy ini?

Ya. Setiap pelajaran Swift Academy menyertakan penyunting kod terbina dalam, jadi anda boleh menulis dan menjalankan kod sebenar terus dalam pelayar serta menerima maklum balas kecerdasan buatan serta-merta — tanpa memerlukan persediaan setempat.

Semua pelajaran dalam kursus ini

  1. Asas CALayer
  2. Animasi Tersirat dan Eksplisit
  3. Transformasi dan Kesan 3D
  4. Lukisan Tersuai dengan Core Graphics
← Kembali ke Swift Academy