Εφαρμογή Android Μέρος 1: Οθόνη εκτόξευσης χρησιμοποιώντας θραύσματα/Kotlin: 5 βήματα

2024 Συγγραφέας: John Day | [email protected]. Τελευταία τροποποίηση: 2024-01-30 08:33

Γεια σου και πάλι, πιθανότατα έχετε λίγο «ελεύθερο» χρόνο στο σπίτι λόγω του COVID19 και μπορείτε να επιστρέψετε για να ελέγξετε θέματα που θέλετε να μάθετε στο παρελθόν.

Η ανάπτυξη Android App είναι σίγουρα ένα από αυτά για μένα και αποφάσισα πριν από μερικές εβδομάδες να κάνω μια δεύτερη προσπάθεια.

Ο προγραμματισμός στο Kotlin μειώνει σίγουρα την προσπάθεια κωδικοποίησης και βοηθά στην επίτευξη αποτελεσμάτων σε πολύ σύντομο χρονικό διάστημα. Είναι Πραγματικά Υπέροχο!

Σε αυτή τη σειρά σεμιναρίων, θα εξηγήσω πώς να αναπτύξετε ένα Tennis Score Tracker. Αυτή η εφαρμογή μπορεί να χρησιμοποιηθεί όταν παίζετε με φίλους ή/και οικογένεια (μπορείτε να δώσετε το tablet στο παιδί σας και να το/την απασχολήσετε:)). Αυτή η εφαρμογή βασίζεται στο παράδειγμα του μετρητή Kotlin.

Το σεμινάριο έχει τα ακόλουθα μέρη:

Μέρος 1: Οθόνη εκτόξευσης χρησιμοποιώντας Fragments (είμαστε εδώ τώρα)

Μέρος 2: Διαμόρφωση αντιστοίχισης - Ιδιότητες

Μέρος 3: Παρακολούθηση βαθμολογίας αγώνα

Η κύρια ιδέα είναι να χωρίσετε την εφαρμογή σε 3 διαφορετικές οθόνες η κάθε μία από αυτές θα καλέσει την επόμενη, μόλις ολοκληρωθεί ή όταν ο χρήστης πατήσει το αντίστοιχο κουμπί.

Σε αυτό το πρώτο μέρος, θα εξηγήσω πώς να δημιουργήσετε μια οθόνη εισαγωγής -> ελέγξτε το βίντεο παραπάνω.

Προμήθειες

Λειτουργίες Android που χρησιμοποιούνται σε αυτό το μέρος:

• Θραύσματα
• Κινουμένων σχεδίων
• Δόνηση
• Media Player
• Ακροατές

Απαιτούμενα εργαλεία:

• Android Studio
• Κότλιν 1.3.61
• Επίπεδο API 28

Απαιτούμενα περιουσιακά στοιχεία

Ένα αρχείο ήχου μπιπ

Βήμα 1: Σχεδιασμός εμπειρίας χρήστη

Ας εξηγήσουμε τα χαρακτηριστικά της οθόνης εισαγωγής μας.

1. θέλουμε να έχουμε μια πλήρη οθόνη σε λευκό χρώμα
2. Θέλουμε να έχουμε την οθόνη πάντα σε οριζόντια λειτουργία
3. θέλουμε το χρώμα κειμένου λογότυπου σε γκρι χρώμα
4. θέλουμε το χρώμα της μπάλας μας σε τόνους πράσινου
5. θέλουμε να ξεθωριάσει το λογότυπο-κείμενό μας
6. θέλουμε μια μπάλα τένις που κινείται στην οθόνη (αναπηδώντας μπάλα)
7. θέλουμε να παίζουμε έναν ήχο κάθε φορά που η μπάλα αγγίζει μια επιφάνεια
8. Θέλουμε να ενεργοποιήσουμε μια δόνηση του τηλεφώνου όταν παίζεται ένας ήχος
9. θέλουμε η διάρκεια εισαγωγής να είναι μικρότερη από 4 δευτερόλεπτα.

Βήμα 2: Διαχείριση τεμαχίων και 3 οθόνες

Ας θυμηθούμε την κύρια ιδέα της εφαρμογής μας, θέλουμε να έχουμε 3 οθόνες (Intro, Properties and Match Score). Για αυτό θα χρησιμοποιήσουμε Fragment. Χρειαζόμαστε λοιπόν 3 από αυτά ένα για κάθε οθόνη. Ανατρέξτε στο πρώτο απόσπασμα κώδικα.

Στο δεύτερο, μπορούμε να βρούμε πώς ονομάζουμε το πρώτο μας κομμάτι. Το θραύσμα Splash είναι αυτό που θα χρησιμοποιηθεί για την εισαγωγή μας.

Βήμα 3: Διάταξη εφαρμογής και εισαγωγής οθόνης

• Για να διορθώσουμε τη θέση της οθόνης και να αγνοήσουμε οποιαδήποτε περιστροφή του τηλεφώνου, πρέπει να προσθέσουμε τον ακόλουθο κώδικα Εικόνα 1 στο AndroidManifest.xml.
• Για να καταργήσουμε τη γραμμή δράσης από όλες τις οθόνες, πρέπει να προσθέσουμε τον ακόλουθο κώδικα Εικόνα 2 σε styles.xml
• Για να προωθήσουμε την πλήρη οθόνη σε όλες τις οθόνες, πρέπει να ορίσουμε μερικές σημαίες όπως στην εικόνα 3 σε 2 διαφορετικές μεθόδους. Oncreate () και onWindowFocusChanged.

Βήμα 4: Ορισμός λογοτύπου και μπάλας

• ορίσαμε πριν από το κείμενό μας ως γκρι, αυτό γίνεται στο αρχείο styles.xml. Ανατρέξτε στην Εικόνα 1.
• ορίσαμε επίσης ότι η μπάλα πρέπει να είναι σε πράσινους τόνους. Γι 'αυτό, δημιουργούμε το ball.xml κάτω από το φάκελο με δυνατότητα σχεδίασης. Ελέγξτε την εικόνα 2

Βήμα 5: Περιγραφή κινούμενων σχεδίων

Θα εξηγήσω εδώ τη λογική και τη σειρά της κινούμενης εικόνας. Νομίζω ότι δεν έχει νόημα να προσθέσετε αποσπάσματα κώδικα εδώ, καλύτερα να περάσετε από τον κώδικα μόνοι σας.

Η ιδέα του κινούμενου σχεδίου έχει ως εξής:

• Αφού δημιουργηθεί το τμήμα, δημιουργείται και ξεκινά το λογότυπο κειμένου
• Μόλις ολοκληρωθεί η κίνηση του λογότυπου κειμένου, γίνεται επίκληση της πρώτης παραβολικής κίνησης της μπάλας τένις
• Μόλις ολοκληρωθεί η πρώτη παραβολική κίνηση, ακούγεται ένας ήχος και το τηλέφωνο δονείται.. και η επόμενη παραβολική κίνηση επικαλείται
• Μόλις ολοκληρωθεί η τελευταία παραβολική κίνηση και εκτελεστεί ήχος/δόνηση φτάνουμε στο σημείο να καλέσουμε τη δεύτερη οθόνη μας.

Παρατήρηση: Δεν δημιούργησα μια αφηρημένη τάξη για κινούμενα σχέδια, γιατί ήθελα να κρατήσω τον κώδικα σταθερό… πιο εύκολο να ακολουθήσω τουλάχιστον για μένα:)

Θα δημοσιεύσω το δεύτερο μέρος της σειράς τις επόμενες ημέρες, ακολουθήστε με αν σας αρέσει αυτό το μέρος και αν όχι, θα χαρώ να λάβω τα σχόλιά σας.