Lag glatte overganger med Android's ObjectAnimator-klasse

Ettersom antall apper i Google Play fortsetter å vokse, er det ikke lenger alltid nok å skrive en kvalitetsapplikasjon som gjør en jobb godt. Gitt to apper som fungerer like bra, har brukerne en tendens til å trekke til den med den mer interessante brukeropplevelsen. Faktisk kjenner jeg noen brukere som vil velge en mindre funksjonell app når de blir presentert med nok godteri.

Heldigvis trenger du ikke å være UI-jedi for å piske opp noen ganske glatte animasjoner. Folkene på Google legger stadig til funksjoner til API for å gjøre jobben med å lage jevn fades og iøynefallende overganger til en lek. I denne opplæringen skal vi utforske ObjectAnimator, en grei klasse for å manipulere objektegenskaper som resulterer i imponerende animasjoner som kan brukes på hvilken som helst visning eller widget. Du kan følge med trinn-for-trinn-instruksjonene nedenfor, eller laste ned og importere hele prosjektet til Eclipse.

1. Start et nytt Android-prosjekt i Eclipse. Du må målrette mot et minimum SDK versjon 11 (Honeycomb). Navngi oppstartsaktiviteten henholdsvis Main.java og layout main.xml.

2. I mappen / res / layout vil vi endre main.xml til å bestå av en lineær layout og to widgets: en tekstvisning og en knapp.

main.xml

 "Http://schemas.android.com/apk/res/android" 
 android: layout_width = "fill_parent" 
 android: layout_height = "fill_parent" 
 android: gravitasjon = "sentrum" 
 android: orientering = "vertikal" > 
 android: layout_width = "wrap_content" 
 android: layout_height = "wrap_content" 
 android: tekst = "" 
 android: textColor = "# 000000" 
 android: textSize = "25sp" 
 android: id = "@ + id / text_view" 
 android: layout_marginBottom = "50dip" /> 
 android: layout_width = "wrap_content" 
 android: layout_height = "wrap_content" 
 android: text = "Apply Transition" 
 android: id = "@ + id / knapp" /> 

3. Vi går videre til /src/Main.java-filen. Overstyring av on on-line er ditt standard Android UI-paradigme: fest et oppsett og koble opp knappen. I mellomtiden er vår klikkbehandler der magien skjer. Du kan se hvor praktisk objektanimatoren kombineres med animatorsettet og byggherren for å tillate oss å bruke flere overganger på et enkelt objekt i tandem.

Main.java

 pakke com.authorwjf.transition; 
 import android.os.Bundle; 
 import android.view.View; 
 import android.view.View.OnClickListener; 
 import android.widget.TextView; 
 import android.animation.AnimatorSet; 
 import android.animation.ObjectAnimator; 
 import android.app.Aktivitet; 
 public class Main utvider aktivitetsredskaper OnClickListener { 
 privat endelig boolesk IN = sann ; 
 privat boolsk stat = IN; 
 @Overstyring 
 public void onCreate (Bundle savedInstanceState) { 
 super .onCreate (savedInstanceState); 
 setContentView (R.layout. main ); 
 findViewById (R.id.- knapp ) .setOnClickListener ( dette ); 
 } 
 @Overstyring 
 public void onClick (Vis v) { 
 TextView tv = (TextView) findViewById (R.id. Text_view ); 
 tv.setText ("Hello Transition!"); 
 ObjectAnimator skalaXOut = ObjectAnimator. ofFloat (tv, "skalaX", 1f, 0f); 
 ObjectAnimator skalaXIn = ObjectAnimator. ofFloat (tv, "skalaX", 0f, 1f); 
 ObjectAnimator skalaYOut = ObjectAnimator. ofFloat (tv, "skalaY", 1f, 0f); 
 ObjectAnimator skalaYIn = ObjectAnimator. ofFloat (tv, "skalaY", 0f, 1f); 
 ObjectAnimator rotateClockWise = ObjectAnimator. ofFloat (tv, "rotasjon", 0f, 360f); 
 ObjectAnimator rotateCounterClockWise = ObjectAnimator. ofFloat (tv, "rotasjon", 0f, -360f); 
 AnimatorSet set = new AnimatorSet (); 
 if (tilstand == IN) { 
 set.play (scaleXIn) .Med (rotateClockWise) .Med (scaleYIn); 
 } annet { 
 set.play (scaleXOut) .Med (rotateCounterClockWise) .Med (scaleYOut); 
 } 
 tilstand =! tilstand; 
 set.setDuration (1000); 
 set.start (); 
 } 
 } 
Er du klar for litt GUI-godhet? Last opp demoen og gi den en virvel ( figur A ). Ved å trykke på knappen får teksten vekselvis inn og ut, spinne mens den samtidig krymper eller vokser. Du må innrømme at den resulterende animasjonen er ganske kul, og API gjør alt det harde arbeidet. Figur A

Hvis du ikke allerede hadde pyntet appene dine med Googles animasjonsramme, oppfordrer jeg deg til å undersøke det nærmere. Du kan lese Googles komplette og offisielle dokumentasjon for eiendomsanimasjon.

© Copyright 2021 | pepebotifarra.com