Swift Academy · Pelajaran

Dasar-Dasar CALayer

Gunakan layer, propertinya, dan hierarkinya.

Pelajaran 1 dari 413 langkah

Dasar-Dasar CALayer adalah pelajaran Swift Academy gratis di CoddyKit. Ini adalah pelajaran 1 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 Swift Academy, dan progresmu tersinkronisasi di web dan aplikasi CoddyKit. Kursus Swift Academy mencakup 4 pelajaran total.

Apa Itu CALayer?

CALayer adalah penyimpanan dasar untuk semua hal yang Anda lihat di UIKit. Setiap UIView digambar oleh sebuah lapisan yang menyimpan konten visualnya sebagai tekstur pada GPU.

Berinteraksi langsung dengan lapisan membuka akses ke grafik dan animasi yang dipercepat perangkat keras.

import UIKit
let layer = CALayer()

Lapisan di Balik Tampilan

Setiap tampilan memiliki properti layer. Menetapkan properti lapisan sering kali lebih sederhana dan lebih murah daripada menggambar secara khusus.

view.layer.cornerRadius = 12
view.layer.masksToBounds = true

Geometri: bingkai, batas, posisi

Sebuah lapisan memiliki bounds, yaitu ruang koordinatnya sendiri, position, yaitu tempat jangkar lapisan berada pada induknya, dan frame yang diturunkan dari keduanya. Mengubah salah satunya akan memperbarui yang lain.

let layer = CALayer()
layer.bounds = CGRect(x: 0, y: 0, width: 100, height: 100)
layer.position = CGPoint(x: 150, y: 150)

Titik Jangkar

anchorPoint, dengan nilai bawaan 0.5, 0.5 yang berarti tengah, menentukan asal lapisan untuk pemosisian dan transformasi. Rotasi dan penskalaan berputar pada titik ini.

layer.anchorPoint = CGPoint(x: 0, y: 0) // top-left pivot

Properti Visual

Lapisan menyediakan gaya visual secara langsung: backgroundColor, yaitu CGColor, cornerRadius, borderWidth, borderColor, dan opacity.

layer.backgroundColor = UIColor.systemBlue.cgColor
layer.cornerRadius = 8
layer.borderWidth = 2
layer.borderColor = UIColor.white.cgColor

Bayangan

Lapisan menggambar bayangan menggunakan shadowColor, shadowOpacity, shadowOffset, dan shadowRadius. Tetapkan shadowPath untuk meningkatkan kinerja.

layer.shadowColor = UIColor.black.cgColor
layer.shadowOpacity = 0.3
layer.shadowOffset = CGSize(width: 0, height: 4)
layer.shadowRadius = 6

Lapisan Turunan

Lapisan membentuk sebuah hierarki. Tambahkan anak dengan addSublayer; anak tersebut ditempatkan dalam ruang koordinat milik induknya.

let parent = CALayer()
let child = CALayer()
child.frame = CGRect(x: 10, y: 10, width: 40, height: 40)
parent.addSublayer(child)

Jenis Lapisan Khusus

UIKit menyediakan subkelas lapisan: CAShapeLayer untuk jalur vektor, CAGradientLayer untuk gradasi, CATextLayer untuk teks, dan CAReplicatorLayer untuk anak yang diduplikasi.

let shape = CAShapeLayer()
shape.path = UIBezierPath(ovalIn: CGRect(x: 0, y: 0, width: 50, height: 50)).cgPath
shape.fillColor = UIColor.systemRed.cgColor

Lapisan Gradasi

CAGradientLayer merender perpaduan warna yang halus, yang ditentukan oleh colors, locations, startPoint, dan endPoint.

let gradient = CAGradientLayer()
gradient.colors = [UIColor.systemBlue.cgColor, UIColor.systemPurple.cgColor]
gradient.startPoint = CGPoint(x: 0, y: 0)
gradient.endPoint = CGPoint(x: 1, y: 1)

contentsScale dan Ketajaman

Tetapkan contentsScale sesuai skala layar agar konten yang digambar lapisan tetap tajam pada layar Retina. Jika lupa menetapkannya, teks dan bentuk akan terlihat buram.

layer.contentsScale = UIScreen.main.scale

Lapisan Itu Ringan

Lapisan tidak menangani kejadian sentuhan atau Auto Layout; lapisan hanyalah objek visual. Karena itu, lapisan lebih murah daripada tampilan untuk konten dekoratif atau animasi.

Pemeriksaan Singkat: CALayer

Uji pemahaman Anda tentang dasar-dasar CALayer.

Ringkasan: Dasar-Dasar CALayer

CALayer mendukung setiap tampilan UIKit dan menyediakan visual yang dipercepat GPU: geometri bounds/position/anchorPoint, gaya visual seperti radius sudut, garis tepi, dan bayangan, serta hierarki lapisan turunan.

Subkelas khusus menangani bentuk, gradasi, teks, dan replikasi. Tetapkan contentsScale untuk memperoleh ketajaman, dan ingat bahwa lapisan adalah objek visual yang ringan tanpa sentuhan atau Auto Layout. Dasar ini menjadi landasan bagi animasi yang akan dipelajari.

Gratis untuk memulai

Belajar Swift dengan tutor AI — gratis

Tulis dan jalankan kode asli di browser kamu, dapatkan bantuan instan dari tutor AI 24/7, dan lanjutkan di mana kamu tinggalkan di web atau aplikasi.

Kursus
122
Pelajaran
409

Pertanyaan yang Sering Diajukan

Apakah pelajaran “Dasar-Dasar CALayer” gratis?

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

Apa yang akan aku pelajari di “Dasar-Dasar CALayer”?

Gunakan layer, propertinya, dan hierarkinya. Kamu berlatih Swift 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 Swift Academy?

Tidak diperlukan pengalaman sebelumnya. Swift 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 1 dari 4.

Berapa lama pelajaran “Dasar-Dasar CALayer” 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 Swift Academy ini?

Ya. Setiap pelajaran Swift 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

  1. Dasar-Dasar CALayer
  2. Animasi Implisit dan Eksplisit
  3. Transformasi dan Efek 3D
  4. Menggambar Kustom dengan Core Graphics
← Kembali ke Swift Academy