אפליקציית אנדרואיד חלק 1: מסך התזה באמצעות שברים/קוטלין: 5 שלבים

2024 מְחַבֵּר: John Day | [email protected]. שונה לאחרונה: 2024-01-30 09:12

שוב שלום, סביר להניח שיש לך זמן "פנוי" בבית בגלל COVID19 ותוכל לחזור לבדוק נושאים שרצית ללמוד בעבר.

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

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

בסדרת הדרכות זו, אסביר כיצד לפתח עוקב אחר טניס. ניתן להשתמש באפליקציה זו כשאתה משחק עם חברים ו/או משפחה (אתה יכול לתת את הטאבלט לילדך ולהעסיק אותו/היא:)). יישום זה מבוסס על הדוגמה הבאה של קוטלין Counter.

ההדרכה כוללת חלקים הבאים:

חלק 1: מסך התזה באמצעות שברים (אנחנו כאן עכשיו)

חלק 2: תצורת התאמה - מאפיינים

חלק 3: מעקב אחר ציוני התאמה

הרעיון המרכזי הוא לפצל את האפליקציה ל -3 מסכים שונים שכל אחד מהם יקרא לאחד הבא, לאחר השלמתו או כאשר המשתמש לוחץ על הכפתור המתאים.

בחלק הראשון הזה אסביר כיצד ליצור מסך מבוא -> בדוק את הסרטון למעלה.

אספקה

תכונות Android המשמשות בחלק זה:

• שברים
• אנימציה
• רֶטֶט
• נגן מדיה
• מאזינים

כלים נדרשים:

• Android Studio
• קוטלין 1.3.61
• רמת API 28

נכסים דרושים

קובץ צליל של ביפ

שלב 1: עיצוב חווית משתמש

בואו להסביר את התכונות של מסך המבוא שלנו.

1. אנחנו רוצים שיהיה לנו מסך מלא בצבע לבן
2. אנחנו רוצים שהמסך תמיד יהיה במצב לרוחב
3. אנו רוצים את צבע הלוגו-טקסט שלנו באפור
4. אנחנו רוצים את צבע הכדור שלנו בגוונים של ירוק
5. אנחנו רוצים שהטקסט של הלוגו שלנו ייעלם
6. אנחנו רוצים כדור טניס נע במסך (כדור מקפץ)
7. אנחנו רוצים להשמיע צליל בכל פעם שהכדור נוגע במשטח
8. אנו רוצים להפעיל רטט בטלפון בעת השמעת צליל
9. אנו רוצים שמשך ההקדמה יהיה פחות מ -4 שניות.

שלב 2: מנהל פרגמנט ו -3 מסכים

בואו נזכיר את הרעיון המרכזי של האפליקציה שלנו, אנחנו רוצים שיהיו לנו 3 מסכים (מבוא, נכסים וציון התאמה). לשם כך אנו הולכים להשתמש בשברים. אז אנחנו צריכים 3 מהם אחד לכל מסך. עיין בקטע הקוד הראשון.

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

שלב 3: פריסת מסך אפליקציות ומבוא

• על מנת לתקן את מיקום המסך ולהתעלם מכל סיבוב של הטלפון, עלינו להוסיף את הקוד הבא תמונה 1 ב- AndroidManifest.xml.
• על מנת להסיר את סרגל הפעולה מכל המסכים, עלינו להוסיף את הקוד הבא תמונה 2 בסגנון styles.xml
• על מנת לדחוף מסך מלא בכל המסכים, עלינו להגדיר כמה דגלים כמו בתמונה 3 בשתי שיטות שונות. Oncreate () ו- onWindowFocusChanged.

שלב 4: הגדרת לוגו וסירי כדור

• הגדרנו לפני הטקסט שלנו כאפור, זה נעשה תחת קובץ styles.xml. עיין בתמונה 1.
• הגדרנו גם שהכדור צריך להיות בגוונים ירוקים. לשם כך אנו יוצרים את הכדור ball.xml תחת תיקייה ניתנת לצביעה. בדוק את תמונה 2

שלב 5: תיאור אנימציה

אסביר כאן את ההיגיון והרצף של האנימציה. אני חושב שזה לא הגיוני להוסיף כאן קטעי קוד, עדיף שתעבור על הקוד בעצמך.

הרעיון של האנימציה הוא כדלקמן:

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

הערה: לא יצרתי שיעור מופשט לאנימציות, כי רציתי לשמור על הקוד שטוח … קל יותר לעקוב לפחות בשבילי:)

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