Implisiittiset ja eksplisiittiset animaatiot
Animoi tasojen ominaisuuksia CABasicAnimationilla.
Implisiittiset ja eksplisiittiset animaatiot on ilmainen Swift Academy-oppitunti CoddyKitissä. Tämä on oppitunti 2/4. Voit lukea tästä oppimispolusta kokonaan mitkä tahansa 3 oppituntia ilmaiseksi — sen jälkeen CoddyKit PRO avaa kaikki oppitunnit sekä käytännön harjoittelun sisäänrakennetulla koodieditorilla ja ympäri vuorokauden toimivalla tekoälytuutorilla. Oppitunti kuuluu Swift Academy-oppimispolkuun, ja edistymisesi synkronoituu verkon ja CoddyKit-sovelluksen välillä. Swift Academy-kurssilla on yhteensä 4 oppituntia.
Kaksi tapaa animoida layereita
Core Animation tarjoaa implisiittisiä animaatioita (automaattisia ominaisuuden muuttuessa) ja eksplisiittisiä animaatioita (luotte animaatio-olion itse).
Molempien tapojen ja niiden yhteistoiminnan tunteminen on sujuvan liikkeen kannalta olennaista.
Implisiittiset animaatiot
Kun itsenäisen layerin animoitavaa ominaisuutta muutetaan, käynnistyy implisiittinen animaatio oletusarvoisella 0,25 sekunnin kaarella – animaatio-oliota ei tarvita.
let layer = CALayer()
// Later, this animates automatically:
layer.opacity = 0.0Animoitavat ominaisuudet
Monet layerin ominaisuudet ovat animoitavia: opacity, position, bounds, backgroundColor, transform, cornerRadius ja monet muut.
layer.cornerRadius = 20 // animates implicitly
layer.backgroundColor = UIColor.systemGreen.cgColorToiminnot ja toimintamekanismi
Implisiittiset animaatiot perustuvat toimintoihin. Kun ominaisuus muuttuu, layer etsii suoritettavan CAAction-toiminnon. Voitte mukauttaa näitä toimintoja tai poistaa ne käytöstä.
Näkymään liitetyt layerit poistavat implisiittiset animaatiot käytöstä
UIView-näkymään liitettyjen layerien implisiittiset animaatiot on poistettu käytöstä. Animoikaa niitä sen sijaan UIView.animate-toiminnolla tai eksplisiittisillä animaatioilla.
UIView.animate(withDuration: 0.3) {
view.alpha = 0
}CABasicAnimation
CABasicAnimation animoi yhtä ominaisuutta fromValue-arvosta toValue-arvoon. Lisätkää se layeriin ominaisuutta vastaavalla avainpolulla.
let anim = CABasicAnimation(keyPath: "opacity")
anim.fromValue = 1.0
anim.toValue = 0.0
anim.duration = 0.5
layer.add(anim, forKey: "fade")Presentation-arvo ja model-arvo
Eksplisiittinen animaatio muuttaa vain presentation-arvoja (näytöllä näkyviä arvoja); layerin model-arvo palautuu ennalleen animaation päättyessä.
Jotta muutos säilyy, asettakaa myös model-arvo.
layer.opacity = 0.0 // set model value so it persists
layer.add(anim, forKey: "fade")Keyframe-animaatiot
CAKeyframeAnimation animoi useiden values-arvojen kautta keyTimes-aikojen mukaisesti tai path-polkua pitkin – se sopii erinomaisesti pomppuihin ja kaaria pitkin liikkuvaan liikkeeseen.
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")Ajoitusfunktiot
Hallitkaa kiihtyvyyttä timingFunction-ominaisuudella: ease-in, ease-out, linear tai mukautettu kuutio-Bezier.
anim.timingFunction = CAMediaTimingFunction(name: .easeInEaseOut)Ryhmittely ja transaktiot
Käärikää useita muutoksia CATransaction-transaktioon, jotta ne käyttävät samaa kestoa ja ajoitusta tai jotta voitte poistaa implisiittiset animaatiot kokonaan käytöstä.
CATransaction.begin()
CATransaction.setDisableActions(true)
layer.position = CGPoint(x: 200, y: 200)
CATransaction.commit()Animaatiodelegaatit ja valmistuminen
Asettakaa CATransaction.setCompletionBlock tai animaatiodelegaatti suorittamaan koodia liikkeen päätyttyä – esimerkiksi siivousta, animaatioiden ketjutusta tai tilan päivityksiä varten.
CATransaction.begin()
CATransaction.setCompletionBlock { print("done") }
layer.add(anim, forKey: "fade")
CATransaction.commit()Pikatarkistus: animaatiot
Testatkaa, miten hyvin ymmärrätte implisiittiset ja eksplisiittiset animaatiot.
Kertaus: implisiittiset ja eksplisiittiset animaatiot
Itsenäiset layerit animoituvat implisiittisesti toimintojen avulla, kun animoitavia ominaisuuksia muutetaan; näkymään liitetyt layerit poistavat tämän käytöstä ja käyttävät UIView.animate-toimintoa. Eksplisiittiset CABasicAnimation- ja CAKeyframeAnimation-animaatiot animoivat presentation-arvoa, joten päivittäkää model-arvo, jotta tulokset säilyvät.
Säätäkää liikettä ajoitusfunktioilla, niputtakaa muutokset CATransaction-transaktioon ja käyttäkää valmistumislohkoja jatkotoimia varten.
Opi Swift tekoälytuutorin avulla — ilmaiseksi
Kirjoita ja suorita oikeaa koodia selaimessa, saa välitöntä apua tekoälytuutorilta ympäri vuorokauden ja jatka siitä, mihin jäit, verkossa tai sovelluksessa.
- Kurssit
- 122
- Oppitunnit
- 409
Usein kysytyt kysymykset
Onko oppitunti ”Implisiittiset ja eksplisiittiset animaatiot” ilmainen?
Kyllä — voit lukea täällä verkossa kokonaan ilmaiseksi mitkä tahansa Swift Academy-oppimispolun 3 oppituntia, myös oppitunnin “Implisiittiset ja eksplisiittiset animaatiot”. Sen jälkeen CoddyKit PRO avaa kaikki oppitunnit sekä interaktiiviset harjoitukset sisäänrakennetulla koodieditorilla ja ympäri vuorokauden toimivalla tekoälytuutorilla. Swift Academy-kurssilla on yhteensä 4 oppituntia.
Mitä opin oppitunnilla ”Implisiittiset ja eksplisiittiset animaatiot”?
Animoi tasojen ominaisuuksia CABasicAnimationilla. Harjoittelet Swift Academy-aihetta koodilla, jonka suoritat suoraan selaimessa. Ympäri vuorokauden käytettävissä oleva tekoälytuutori vastaa kysymyksiisi oppitunnin aikana.
Tarvitsenko kokemusta aloittaakseni Swift Academy-opiskelun?
Aiempi kokemus ei ole tarpeen. CoddyKitin Swift Academy-oppimispolku sopii vasta-alkajista edistyneisiin, joten voit aloittaa tästä tai alusta ja edetä omaan tahtiisi. Tämä on oppitunti 2/4.
Kuinka kauan ”Implisiittiset ja eksplisiittiset animaatiot”-oppitunnin suorittaminen kestää?
Useimmat CoddyKitin oppitunnit kestävät noin 5–10 minuuttia. Jokainen oppitunti on lyhyt ja interaktiivinen, joten edistyt tasaisesti ja voit jatkaa siitä, mihin jäit – sekä verkossa että sovelluksessa.
Voinko kirjoittaa ja suorittaa koodia tällä Swift Academy-oppitunnilla?
Kyllä. Jokainen Swift Academy-oppitunti sisältää sisäänrakennetun koodieditorin, joten voit kirjoittaa ja suorittaa oikeaa koodia suoraan selaimessa ja saada välitöntä palautetta tekoälyltä – paikallista asennusta ei tarvita.
Kaikki tämän kurssin oppitunnit
- CALayerin perusteet
- Implisiittiset ja eksplisiittiset animaatiot
- Muunnokset ja 3D-tehosteet
- Mukautettu piirtäminen Core Graphicsilla