Android App Del 1: Splash Screen Using Fragments/Kotlin: 5 Steg

2024 Författare: John Day | [email protected]. Senast ändrad: 2024-01-30 12:39

Hej igen, troligen har du lite "ledig" tid hemma på grund av COVID19 och du kan gå tillbaka för att kolla ämnen du ville lära dig tidigare.

Android App -utveckling är definitivt en av dem för mig och jag bestämde mig för några veckor sedan för att göra ett nytt försök.

Programmering i Kotlin minskar definitivt kodningsansträngningen och hjälper till att uppnå resultat på ganska kort tid. Det är riktigt bra!

I denna handledningsserie kommer jag att förklara hur man utvecklar en Tennis Score Tracker. Denna app kan användas när du spelar med vänner och/eller familj (du kan ge surfplattan till ditt barn och hålla honom/henne upptagen:)). Denna app är baserad på följande Kotlin Counter -exempel.

Handledningen har följande delar:

Del 1: Splash Screen med fragment (vi är här nu)

Del 2: Matchkonfiguration - Egenskaper

Del 3: Match Score tracker

Huvudidén är att dela appen i 3 olika skärmar var och en av dem ringer nästa, när den är klar eller när användaren trycker på respektive knapp.

I denna första del kommer jag att förklara hur man skapar en introduktionsskärm -> kolla video ovan.

Tillbehör

Android -funktioner som används i denna del:

• Fragment
• Animering
• Vibration
• Mediaspelare
• Lyssnare

Nödvändiga verktyg:

• Android Studio
• Kotlin 1.3.61
• API -nivå 28

Obligatoriska tillgångar

En pip -ljudfil

Steg 1: Design för användarupplevelse

Låt oss förklara funktionerna i vår Intro -skärm.

1. vi vill ha en helskärm i vit färg
2. vi vill ha skärmen alltid i liggande läge
3. vi vill ha vår logotyp-textfärg i grått
4. vi vill ha vår bollfärg i gröna toner
5. vi vill att vår logotyp-text ska blekna in
6. vi vill att en tennisboll rör sig i skärmen (studsande boll)
7. vi vill spela ett ljud varje gång bollen rör vid en yta
8. vi vill utlösa en telefonvibration när ett ljud spelas
9. vi vill att introtiden ska vara mindre än 4 sekunder.

Steg 2: Fragment Manager och 3 skärmar

Låt oss komma ihåg huvudidén med vår app, vi vill ha tre skärmar (introduktion, egenskaper och matchresultat). För detta kommer vi att använda Fragment. Så vi behöver 3 av dem en för varje skärm. Se det första kodavsnittet.

I det andra kan vi hitta hur vi kallar vårt första fragment. Splash -fragmentet är det som ska användas för vårt Intro.

Steg 3: Skärmlayout för app och introduktion

• För att fixa skärmens position och ignorera eventuell rotation av telefonen måste vi lägga till följande kod Bild 1 i AndroidManifest.xml.
• För att ta bort Action Bar från alla skärmar måste vi lägga till följande kod Bild 2 i styles.xml
• För att trycka på helskärm i alla skärmar måste vi ställa in några flaggor som i bild 3 på 2 olika metoder. Oncreate () och onWindowFocusChanged.

Steg 4: Definiera logotyp och bollkod

• vi definierade före vår text som grå, detta görs under styles.xml -filen. Se bild 1.
• vi definierade också att bollen ska vara i gröna toner. För detta skapar vi ball.xml under dragbar mapp. Kolla bild 2

Steg 5: Animationsbeskrivning

Jag kommer här att förklara logiken och sekvensen för animationen. Jag tycker att det inte är vettigt att lägga till kodavsnitt här, bättre att du går igenom koden själv.

Idén med animationen är följande:

• Efter att fragmentet har skapats skapas och startas textlogotypen
• När textlogotypanimationen är klar, åberopas tennisbollens första paraboliska drag
• När den första paraboliska rörelsen är klar spelas ett ljud och telefonen vibrerar..och nästa paraboliska rörelse åberopas
• När den sista paraboliska rörelsen har slutförts och ljud/vibrationer har utförts når vi punkten för att ringa vår andra skärm.

Anmärkning: Jag skapade ingen abstrakt klass för animationer, för jag ville hålla koden platt … lättare att följa åtminstone för mig:)

Jag kommer att lägga upp den andra delen av serien under de närmaste dagarna, följ mig om du gillar den här delen och om inte, skulle jag bli glad att få din feedback.