הצגת תמונה מונפשת

כדי ליצור חוויית משתמש אינטראקטיבית ומעניינת יותר באפליקציה, אפשר לטעון קובץ drawable כדי להציג תמונות מונפשות. תמונות מונפשות שימושיות ליצירת אינדיקטורים של טעינה, אינדיקטורים של הצלחה או שגיאה, לצורך פיתוח משחקים ולפונקציות אחרות בממשק המשתמש.

תאימות גרסאות

כדי להטמיע את הקוד הזה, צריך להגדיר את minSDK של הפרויקט לרמת API 21 ואילך.

יחסי תלות

הצגת תמונה מונפשת

הקוד הבא מציג וקטור מונפש שמחליף באופן אוטומטי בין שני מצבים:

@Composable
fun AnimatedVectorDrawable() {
    val image = AnimatedImageVector.animatedVectorResource(R.drawable.ic_hourglass_animated)
    var atEnd by remember { mutableStateOf(false) }
    Image(
        painter = rememberAnimatedVectorPainter(image, atEnd),
        contentDescription = "Timer",
        modifier = Modifier.clickable {
            atEnd = !atEnd
        },
        contentScale = ContentScale.Crop
    )
}
AnimationSnippets.kt

נקודות עיקריות לגבי הקוד

  • טעינת משאב וקטור, עם אנימציה של מאפייני הציור לאורך זמן.
  • מכונה של Image שמשתמשת במכונה של Painter כדי לבצע את האנימציה, שנוצרה מהמצב AnimatedImageVector והמצב boolean על ידי הפונקציה rememberAnimatedVectorPainter().
  • כש-atEnd הוא true, האנימציה של המכונה Painter מופסקת.

תוצאות

שעון חול עם אנימציה של התוכן שלו ועם סיבוב
איור 1. פריט גרפי וקטורי שניתן לשרטוט עם אנימציה ב-Compose.

אוספים שמכילים את המדריך הזה

המדריך הזה הוא חלק מהאוספים הבאים של מדריכים מהירים, שמכסים יעדים רחבים יותר לפיתוח Android:

כאן מוסבר איך להשתמש בתמונות ובסרטונים בהירים ומעניינים כדי ליצור מראה מעוצב ויפה לאפליקציה ל-Android.
אוסף מדריכים מהירים

יש לכם שאלות או משוב

אתם יכולים להיכנס לדף השאלות הנפוצות שלנו ולקרוא מדריכים מהירים, או ליצור איתנו קשר ולספר לנו מה דעתכם.
לשאלות נפוצות שליחת משוב