SwiftUI Academy · Pelajaran

Kurva Waktu Spring & Kustom

Sesuaikan gerakan dengan spring dan easing.

Kurva Waktu Spring & Kustom adalah pelajaran SwiftUI Academy gratis di CoddyKit. Ini adalah pelajaran 4 dari 4. Kamu bisa membaca pelajaran lengkapnya di bawah secara gratis — lalu praktikkan langsung di browser dengan editor kode bawaan dan tutor AI 24/7. Ini adalah bagian dari jalur belajar SwiftUI Academy, dan progresmu tersinkronisasi di web dan aplikasi CoddyKit. Kursus SwiftUI Academy mencakup 4 pelajaran total.

Bagian dari pelajaran ini belum diterjemahkan dan ditampilkan dalam bahasa Inggris.

The Feel of Motion

How an animation accelerates and settles shapes its personality. The timing curve decides whether motion feels snappy, smooth, or bouncy.

Linear Is Constant

A linear curve moves at one steady speed start to finish. It can feel mechanical, so it suits progress bars more than UI.

.animation(.linear, value: x)

Ease In and Out

The easeInOut curve starts slow, speeds up, then slows to a gentle stop, the most natural choice for most UI.

.animation(.easeInOut, value: x)

Ease In vs Ease Out

Use easeIn to start gently and easeOut to stop gently, picking which end of the motion feels softer.

Meet Springs

A spring animation models real physics, overshooting slightly and settling, which feels lively and responsive.

.animation(.spring, value: x)

Tune the Bounce

The bounce parameter sets how springy the motion is. Zero is smooth; higher values add a playful overshoot.

.spring(duration: 0.5, bounce: 0.3)

Response and Damping

Springs can also be tuned with response for speed and damping for how quickly the bounce dies out.

.interpolatingSpring(
    stiffness: 170, damping: 15)

Custom Bezier Curves

For full control, timingCurve lets you define a custom bezier with your own control points and duration.

.timingCurve(0.2, 0.8, 0.2, 1,
    duration: 0.5)

Add a Delay

Chain .delay onto any animation to wait before it begins, perfect for staggering several elements.

.animation(.spring.delay(0.1), value: x)

Repeat the Motion

Use repeatForever or repeatCount to loop an animation, ideal for pulsing dots and loading hints.

.easeInOut.repeatForever(
    autoreverses: true)

Speed It Up or Down

The .speed modifier scales an animation faster or slower without rewriting its curve or duration.

.animation(.default.speed(2), value: x)

Quick Check

Which curve gives the most natural everyday UI motion?

Recap: Curves and Springs

You explored timing curves from linear to easeInOut, lively springs with bounce, custom beziers, delays, and repeats. Now your motion has personality. 🚀

Pertanyaan yang Sering Diajukan

Apakah pelajaran “Kurva Waktu Spring & Kustom” gratis?

Ya — teks lengkap “Kurva Waktu Spring & Kustom” gratis dibaca di sini di web. Untuk praktiknya secara interaktif (editor kode bawaan dan tutor AI 24/7) dan buka sisa kursus SwiftUI Academy, upgrade ke CoddyKit PRO. Kursus SwiftUI Academy mencakup 4 pelajaran total.

Apa yang akan aku pelajari di “Kurva Waktu Spring & Kustom”?

Sesuaikan gerakan dengan spring dan easing. Kamu berlatih SwiftUI Academy dengan kode praktik yang langsung kamu jalankan di browser, dan tutor AI 24/7 menjawab pertanyaanmu saat kamu mengerjakan pelajaran ini.

Apakah aku perlu pengalaman untuk memulai SwiftUI Academy?

Tidak diperlukan pengalaman sebelumnya. SwiftUI Academy di CoddyKit dirancang untuk pemula hingga pelajar tingkat lanjut, jadi kamu bisa memulai di sini atau dari awal dan belajar sesuai kecepatan kamu sendiri. Ini adalah pelajaran 4 dari 4.

Berapa lama pelajaran “Kurva Waktu Spring & Kustom” memakan waktu?

Sebagian besar pelajaran CoddyKit memakan waktu sekitar 5–10 menit. Setiap pelajaran ringkas dan interaktif, jadi kamu membuat kemajuan stabil dan melanjutkan dari tempat kamu tinggalkan di web dan aplikasi.

Bisakah aku menulis dan menjalankan kode dalam pelajaran SwiftUI Academy ini?

Ya. Setiap pelajaran SwiftUI Academy menyertakan editor kode bawaan, jadi kamu menulis dan menjalankan kode nyata langsung di browser dan mendapatkan umpan balik AI instan — tidak diperlukan penyiapan lokal.

Semua pelajaran dalam kursus ini

← Kembali ke SwiftUI Academy