Android -alkalmazás 1. rész: Splash -képernyőkeresztő képernyő/Kotlin: 5 lépés

2024 Szerző: John Day | [email protected]. Utoljára módosítva: 2024-01-30 09:40

Szia ismét, Valószínűleg van néhány szabad ideje otthon a COVID19 miatt, és visszatérhet a korábban megtanulni kívánt témákhoz.

Az Android -alkalmazások fejlesztése határozottan az egyik számomra, és néhány hete úgy döntöttem, hogy megpróbálom másodszor.

A Kotlinban történő programozás határozottan csökkenti a kódolási erőfeszítéseket, és segít rövid időn belül eredményeket elérni. Ez tényleg nagyszerű!

Ebben az oktatóanyag -sorozatban elmagyarázom, hogyan kell kifejleszteni egy tenisz pontszámkövetőt. Ez az alkalmazás akkor használható, ha barátaival és/vagy családjával játszik (adhatja a táblagépet gyermekének, és elfoglalhatja őt:)). Ez az alkalmazás a Kotlin Counter példájának követésén alapul.

Az oktatóanyag a következő részeket tartalmazza:

1. rész: Csobbanó képernyő töredékek használatával (most itt vagyunk)

2. rész: Egyezési konfiguráció - Tulajdonságok

3. rész: Match Score tracker

A fő ötlet az, hogy az alkalmazást három különböző képernyőre osztja, amelyek mindegyike a következőt fogja hívni, miután befejezte vagy amikor a felhasználó megnyomja a megfelelő gombot.

Ebben az első részben elmagyarázom, hogyan kell létrehozni egy bevezető képernyőt -> ellenőrizze a fenti videót.

Kellékek

Az ebben a részben használt Android -funkciók:

• Töredékek
• Élénkség
• Rezgés
• Médialejátszó
• Hallgatók

Szükséges eszközök:

• Android Studio
• Kotlin 1.3.61
• API szint 28

Szükséges eszközök

Hangjelzés

1. lépés: A felhasználói élmény tervezése

Magyarázzuk el az Intro képernyő jellemzőit.

1. teljes képernyőt szeretnénk, fehér színben
2. azt szeretnénk, hogy a képernyő mindig fekvő módban legyen
3. a logó-szöveg színét szürke színben szeretnénk
4. a golyó színét zöld színben szeretnénk
5. azt akarjuk, hogy a logó-szövegünk elhalványuljon
6. teniszlabdát szeretnénk mozgatni a képernyőn (pattogó labda)
7. hangot akarunk játszani minden alkalommal, amikor a labda felszínt ér
8. egy hang lejátszásakor telefon rezgését szeretnénk kiváltani
9. azt szeretnénk, ha a bevezető időtartama kevesebb lenne, mint 4 másodperc.

2. lépés: Töredékkezelő és 3 képernyő

Emlékezzünk vissza alkalmazásunk fő gondolatára, szeretnénk 3 képernyőt (Intro, Properties és Match Score). Ehhez töredékeket fogunk használni. Tehát szükségünk van 3 -ra egy -egy képernyőre. Lásd az első kódrészletet.

A másodikban megtaláljuk, hogyan nevezzük első töredékünket. A bevezetőnkhöz a Splash töredéket használjuk.

3. lépés: Az alkalmazás és az Intro képernyő elrendezése

• Annak érdekében, hogy rögzítsük a képernyő helyzetét, és figyelmen kívül hagyjuk a telefon forgatását, hozzá kell adnunk a következő kódot, az 1. képet az AndroidManifest.xml fájlban.
• Annak érdekében, hogy eltávolítsuk a Műveletsávot az összes képernyőről, hozzá kell adnunk a következő 2. kép kódot a styles.xml fájlban
• Annak érdekében, hogy a teljes képernyőt minden képernyőn megjeleníthessük, be kell állítanunk néhány jelzőt, mint a 3. képen, 2 különböző módszerrel. Oncreate () és onWindowFocusChanged.

4. lépés: A logó és a golyósínek meghatározása

• szövegünk előtt szürke színűként definiáltuk, ez a styles.xml fájl alatt történik. Lásd az 1. képet.
• azt is meghatároztuk, hogy a labdának zöld tónusúnak kell lennie. Ehhez a ball.xml fájlt a rajzolható mappa alatt hozzuk létre. Ellenőrizze a 2. képet

5. lépés: Animáció leírása

Itt elmagyarázom az animáció logikáját és sorrendjét. Szerintem nincs értelme kódrészleteket hozzáadni, jobb, ha maga végzi el a kódot.

Az animáció ötlete a következő:

• A töredék létrehozása után létrejön és elindul a szöveges logó
• A szöveges logó animációjának befejezése után a teniszlabda első parabolikus mozdulata indul
• Miután az első parabolikus mozdulat befejeződött, egy hang szólal meg, és a telefon rezeg … és a következő parabolikus mozdulat
• Miután az utolsó parabolikus mozdulat befejeződött és a hang/rezgés végrehajtásra került, elérjük azt a pontot, hogy felhívjuk a második képernyőt.

Megjegyzés: Nem absztrakt osztályt hoztam létre az animációkhoz, mert meg akartam tartani a kódot … könnyebb követni, legalábbis nekem:)

A következő napokban közzéteszem a sorozat második részét, kövess, ha tetszik ez a rész, és ha nem, örülnék, ha visszajelzést kapnál.