אנימציות יכולות להוסיף רמזים חזותיים שמודיעים למשתמשים מה קורה באפליקציה. הן שימושיות במיוחד כשממשק המשתמש משנה את המצב שלו, למשל כשתוכן חדש נטען או כשפעולות חדשות הופכות לזמינות. האנימציות גם מוסיפות מראה מלוטש לאפליקציה, שמעניק לה מראה ותחושה איכותיים יותר.
ב-Android יש ממשקי API שונים לאנימציה, בהתאם לסוג האנימציה שרוצים ליצור. במסמך הזה מוסבר איך אפשר להוסיף תנועה לממשק המשתמש.
כדי להבין טוב יותר מתי כדאי להשתמש באנימציות, אפשר לעיין גם במדריך של Material Design בנושא תנועה.
הנפשת מפות סיביות
איור 1. פריט גרפי שניתן לשרטוט עם אנימציה.
כדי להוסיף אנימציה לגרפיקה של מפת סיביות (bitmap), כמו סמל או איור, משתמשים בממשקי ה-API של האנימציה שניתן להציג. בדרך כלל, האנימציות האלה מוגדרות באופן סטטי באמצעות פריט גרפי שניתן להזזה, אבל אפשר גם להגדיר את אופן הפעולה של האנימציה בזמן הריצה.
לדוגמה, דרך טובה להראות למשתמש ששתי פעולות קשורות היא להוסיף אנימציה לכפתור הפעלה שהופך לכפתור השהיה כשלוחצים עליו.
מידע נוסף זמין במאמר הוספת אנימציה לגרפיקה שניתן לשרטט.
הנפשה של החשיפה והתנועה של ממשק המשתמש
איור 2. אנימציה עדינה כשתיבת דו-שיח מופיעה ונעלמת הופכת את השינוי בממשק המשתמש לפחות צורם.
כשצריך לשנות את החשיפה או המיקום של התצוגות בפריסה, מומלץ לכלול אנימציות עדינות כדי לעזור למשתמש להבין איך ממשק המשתמש משתנה.
כדי להזיז, להציג או להסתיר תצוגות בפריסה הנוכחית, אתם יכולים להשתמש במערכת האנימציה של המאפיינים שכלולה בחבילה android.animation, שזמינה ב-Android 3.0 (רמת API 11) ואילך. ממשקי ה-API האלה מעדכנים את המאפיינים של אובייקטי View לאורך זמן, ומשרטטים מחדש את התצוגה באופן רציף כשהמאפיינים משתנים. לדוגמה, כשמשנים את מאפייני המיקום, התצוגה זזה במסך. כשמשנים את מאפיין האלפא, התצוגה מופיעה או נעלמת בהדרגה.
הדרך הפשוטה ביותר ליצור את האנימציות האלה היא להפעיל אנימציות בפריסה, כך שכאשר משנים את החשיפה של תצוגה, האנימציה מופעלת באופן אוטומטי. מידע נוסף זמין במאמר הנפשה אוטומטית של עדכוני פריסה.
כדי ללמוד איך ליצור אנימציות באמצעות מערכת האנימציה של המאפיינים, קראו את הסקירה הכללית על אנימציית מאפיינים. בדפים הבאים מוסבר איך ליצור אנימציות נפוצות:
תנועה שמבוססת על פיזיקה
איור 3. אנימציה שנוצרה באמצעות ObjectAnimator.
איור 4. אנימציה שנוצרה באמצעות ממשקי API שמבוססים על פיזיקה.
כשאפשר, כדאי להחיל חוקי פיזיקה מהעולם האמיתי על האנימציות כדי שהן ייראו טבעיות. לדוגמה, הם צריכים לשמור על המומנטום כשהיעד משתנה ולעבור בצורה חלקה בין שינויים.
כדי לספק את ההתנהגויות האלה, ספריית התמיכה של Android כוללת ממשקי API של אנימציה שמבוססים על חוקי הפיזיקה כדי לשלוט באופן שבו האנימציות מתרחשות.
אלה שתי אנימציות נפוצות שמבוססות על פיזיקה:
אנימציות שלא מבוססות על פיזיקה, כמו אלה שנוצרו באמצעות ממשקי API של ObjectAnimator, הן די סטטיות ויש להן משך זמן קבוע. אם ערך היעד משתנה, צריך לבטל את האנימציה בזמן השינוי של ערך היעד, להגדיר מחדש את האנימציה עם ערך חדש כערך ההתחלה החדש, ולהוסיף את ערך היעד החדש. מבחינה חזותית, התהליך הזה יוצר עצירה פתאומית באנימציה, ותנועה לא רציפה לאחר מכן, כמו שמוצג באיור 3.
אנימציות שנוצרו באמצעות ממשקי API של אנימציה שמבוססת על פיזיקה, כמו DynamicAnimation, מונעות על ידי כוח. השינוי בערך היעד גורם לשינוי בכוח. הכוח החדש מופעל על המהירות הקיימת, וכך נוצר מעבר רציף ליעד החדש. התהליך הזה יוצר אנימציה שנראית טבעית יותר, כמו שמוצג באיור 4.
הנפשה של שינויים בפריסה
איור 5. כדי להציג פרטים נוספים באמצעות אנימציה, אפשר לשנות את הפריסה או להתחיל פעילות חדשה.
ב-Android 4.4 (רמת API 19) ומעלה, אפשר להשתמש במסגרת המעבר כדי ליצור אנימציות כשמחליפים את הפריסה בתוך הפעילות או החלק הנוכחיים. כל מה שצריך לעשות הוא לציין את הפריסה בהתחלה ובסוף ואת סוג האנימציה שרוצים להשתמש בה. לאחר מכן המערכת מחשבת ומפעילה אנימציה בין שתי הפריסות. אתם יכולים להשתמש באפשרות הזו כדי להחליף את כל ממשק המשתמש או כדי להעביר או להחליף רק חלק מהתצוגות.
לדוגמה, כשהמשתמש מקיש על פריט כדי לראות מידע נוסף, אפשר להחליף את הפריסה בפרטי הפריט, ולהחיל מעבר כמו זה שמוצג באיור 5.
פריסת ההתחלה ופריסת הסיום מאוחסנות כל אחת ב-Scene, אבל סצנת ההתחלה נקבעת בדרך כלל באופן אוטומטי מהפריסה הנוכחית. יוצרים אובייקט Transition כדי להגדיר למערכת את סוג האנימציה שרוצים, ואז קוראים ל-TransitionManager.go() והמערכת מריצה את האנימציה כדי להחליף את הפריסות.
מידע נוסף זמין במאמר הוספת אנימציה לשינויים בפריסה באמצעות מעבר. לדוגמה של קוד, אפשר לעיין ב-BasicTransition.
הנפשה בין פעילויות
ב-Android 5.0 (רמת API 21) ומעלה, אפשר גם ליצור אנימציות שמעבירות בין הפעילויות. הוא מבוסס על אותה מסגרת מעבר שמתוארת בקטע הקודם, אבל מאפשר ליצור אנימציות בין פריסות בפעילויות נפרדות.
אתם יכולים להחיל אנימציות פשוטות, כמו החלקה של הפעילות החדשה מהצד או הופעה הדרגתית, אבל אתם יכולים גם ליצור אנימציות שעוברות בין תצוגות משותפות בכל פעילות. לדוגמה, כשהמשתמש לוחץ על פריט כדי לראות מידע נוסף, אפשר לעבור לפעילות חדשה עם אנימציה שמגדילה את הפריט בצורה חלקה כדי למלא את המסך, כמו האנימציה שמוצגת באיור 5.
כרגיל, קוראים ל-startActivity(), אבל מעבירים לו חבילה של אפשרויות שסופקו על ידי ActivityOptions.makeSceneTransitionAnimation().
חבילת האפשרויות הזו עשויה לכלול את התצוגות שמשותפות בין הפעילויות, כדי שמסגרת המעבר תוכל לחבר ביניהן במהלך האנימציה.
מקורות מידע נוספים: