Habit Trainer

Cleaner Code for Android apps med Kotlin

Kotlin vil erstatte Java som det primære språket for app-utvikling til Android. Men språket har flere bruksområder enn dette. Kotlin programmer kjøres i utgangspunktet i den samme virtuelle maskinen som Java-basert programvare, altså JVM (Java Virtual Machine) eller tilsvarende. Men med for Kotlin/Native, en teknologi som gjør det mulig å kompilere Kotlin-kode til systemspesifikk programvare som kan kjøres uten noen virtuell maskin. Dette gjør det mulig å bruke Kotlin til å programmere programvare som kan kjøres på Windows, Linux, Macos, Ios, Android og nettlesere i form av Webassembly.

Kotlin video kurs

Create the App Project

Vi starter med å opprette et nytt prosjekt HabitTrainer i Android Studio. Bruk Android 4.1 (Jelly Bean) som minimum SDK. Start med en Empty Activity og behold navnet på aktiviteten.

Klikk på AVD Manager ikonet for å se hvilken virtuell telefon som vil bli brukt for å kjøre og teste applikasjonen som vi lager på maskinen vår. Legg spesielt merke til hvilken API versjon som benyttes.

Klikk på SDK Manager ikonet for å se hvilken Android platformer og SDK versjoner som applikasjonen vår vil støtte.

I utgangspunktet er appen klar til å kjøres. Hovedprogrammet MainActivity.kt vil være koden der appen starter opp. Legg merke til at denne koden setter grensesnittfilen activity_main.xml som oppstartsbilde når appen åpnes.

To viktige kodefiler for bygging av appen er HabitTrainer (/build_gradle) og app (/app/build_gradle). I prosjektfilen HabitTrainer spesifiserer hvilken versjon av Kotlin som benyttes, i dette tilfelle versjon 4.2. Modulfilen app spesifiserer hvilken visjon av Java som vil støttes I dette tilfelle SDK versjon fra 16 til 26 som tilsvarer Android 4.1 (Jelly Bean) og Android 8.0 (Oreo). Kodefilen app vil også angi Kotlin plugins som kotlin-android og kotlin-android-extensions og kodebiblioteker (dependencies) som koden til vår app benytter.

Du kan også velge Preferences fra Android Studio menyen for å gå inn på Preferences. Her vil du finne igjen både versjonen av programmeringsspråket Kotlin som støttes og hvilke versjon av Java SDK som benyttes. Som i dette tilfellet er 1.2 og 1.6. Merk at innstillingene i app kodefilen vil overstyre disse.

Create a CardView Layout and Add UI Elements

Før vi begynner med å programmere grensesnittet til appen skal vi først laste inn bildene som vi trenger. Merk begge filene i Finder og trykk Ctrl-C for å kopiere disse. Gå så inn i Android Studio, stå på drawable mappen og trykk Ctrl-V for å lime importere bildene til prosjektet. Klikk OK på begge meldingsuinduene som kommer opp for å spørre om hvor filene skal lagres. Sjekk til slutt at bildene har havnet i drawable mappen til prosjektet.

Kodefilen activity_main.xml er hvor vi programmerer brukergrensesnittet.

Vi endrer litt på denne koden slik at brukergrensesnittet består av en ScrollView som inneholder CardView elementer.
Først må vi legge til referansen fin CardView.

Så kan vi endre koden til selve brukergrensesnittet.

Use the "Kotlin Android Extensions"

Vi skal nå benytte oss av en av de store fordelene med å programmere Android apper i Kotlin. Nemlig å skrive enkel og ryddig kode. Vi skal programmere bildet og teksten som vises i brukergrensesnittet fra hovedprogrammet MainActivity.kt istedenfor direkte i brukergrensesnitt filen activity_main.xml.

Først legger vi til teksten som vi bruker for aktivitetens tittel og beskrivelse som nye strenger i resursfilen strings.xml.

Så programmerer vi i MainActivity.kt at disse verdiene skal vises i brukergrensesnitt.

What is a RecyclerView?

Vi skal nå splitte brukergrensesnittet opp i 2 kodefiler activity_main.xml og single_card.xml. Dette vil gjøre det mulig å programmere utfylling av listen med aktiviteter som kommer fra en database. Samtidig skal vi bytte ut ScrollView komponenten med en RecyclerView fordi denne er mer effektiv.

Vi starter med å legge inn avhengigheten til RecyclerView inn under dependencies i konfigurasjonsfilen app.

For å splitte opp grensesnittkoden i 2 filer, starter vi med å opprette en ny tom grensesnittfil single_card.xml.

Så flytter vi grensesnitt koden til CardView komponenten fra activity_main.xml og single_card.xml. Samtidig legger vi til et nytt bilde undefined.jpg til res/drawables som vi bruker som standard bilde. Vi legger også inn "Undefined" tekst inn som tittel og beskrivelse.

Vi bytte så ut ScrollView komponenten med en RecyclerView I grensesnitt filen activity_main.xml.

Create the Data Class "Habit"

Vi skal nå programmere dataklassen Habit. Vi lager også en funksjon getSampleHabits() som returnerer en liste av eksempelaktiviteter.

Implement the "HabitsAdapter" - Part 1-3

Vi oppretter en HabitsAdapter som er limen som binder sammen dataklassen Habit men brukergrensesnittet.

Til slutt må vi koble dette sammen i MainActivity.kt.

Add a Menu

Vi ønsker at brukerne skal få legge til sine egne aktiviteter i et eget menyvalg. Vi trenger derfor å programmere inn en meny i appen.

Først oppretter vi en Android resursmappe menu hvor koden til menyen vil ligge.

Så legger vi til en ny meny resurs main_menu hvor vi vil programmere hovedmenyen.

Når vi programmerer menyen er det lurt å lagre navnene på alle menyvalgene som tekstresurser.

Add a Second Activity

Selve menyen instansienres i hovedprogrammet MainActivity.kt. ved å overstyre onCreateOptionsMenu() funksjonen.

Use Intents to Switch Activities

Vi skal nå opprette et nytt skjermbilde hvor bruker kan legge til en ny aktivitet. Det vil da genereres opp 2 nye filer; CreateHabitActivity.kt for logikken og activity_create_habit.xml for brukergrensesnittet.

Vi bruker Intens funksjonen for å bytte skjermbilde når bruker trykker på menyvalget.

Build the Activity Layout

Vi skal nå programmere brukergrensesnittet som lar brukere opprette nye aktiviteter i appen.

For å velge farger anbefales det at du bruker nettsiden Material Design. Scroll et godt stykke ned på siden for fargekodene.

Let Users Choose an Image

Vi skal nå la brukeren velge et bilde når han legger til en ny aktivitet.

Vi må også legge til en onClick linje med kode i brukergrensesnittet som kaller denne funksjonen når brukeren trykker på Choose Image knappen.

Get the Selected Image Back

Nå skal vi få tak i bildet som brukeren velger for sin nye aktivitet og vise det på skjermen.

Kode	Beskrivelse
import android.util.Log private val TAG = CreateHabitActivity::class.java.simpleName Log.d(TAG,"Log message text.")	Send en DEBUG log melding. For ryddig kode er det anbefalt å deklarere en TAG variabel som inneholder navnet til klassen.
import android.provider.MediaStore MediaStore.Images.Media.getBitmap(contentResolver, data)	Henter et bilde for en gitt URL som en Bitmap.

For å se meldingene som vi logger fra appen må du åpne logcat vinduet. Her kan du velge emulatoren og appen som du kjører på denne. Du kan også velge kun å se på Debug meldingene.

Show Error Messages to the User

Vi skal nå vise en feilmelding på skjermen hvis bruker lagrer uten å velge et bilde. Vi legger til et onClick event i grensesnittet og programmerer funksjonen storeEvent().

Code Along: An Extension Function for "EditText"

Vi skal her forbedre koden vår ved bruk av Extension Functions i Kotlin. For å lage en slik funksjon, bruk nøkkelordet fun, prefiks klassen du ønsker å lage en Extension Function for og definer funksjonen.

Define the Contracts

Brukeren kan nå legge til en ny aktivitet i app'en. Vi skal nå lagre denne nye aktiviteten til en SQLite database. Databasen vil bli lagret som en lokal fil på Android telefonen. Vi skal definere skjemaet og kontrakten for denne databasen. Med Kotlin kan vi benytte Extension Functions og Higher Order Function for å programmere Clean Code.

Kontrakten til databasen lar oss ha hele skjemaet (tabeller og felter) for databasen definert én plass.

Lag en ny pakke db som vi skal lagre alle klassene som har noe med databasen å gjøre.

I pakken db lager vi nå kontraktsfilen Contracts.kt hvor vi definerer konstanter og variable for databasen.

Implementing the Database Helper

Vi oppretter en ny hjelpe klasse HabitTrainerDb.kt for databasen. Her programmerer vi hvordan databasen skal lages som ny og oppgraderes dersom databasen får et nytt versjonsnummer

Store a Habit to SQLite

Vi skal nå programmere koden som lagrer en ny vane ned i databasen.

Da lager vi en ny klasse HabitDbTable.kt som vil inneholde all koden som lagrer og leser vaner til og fra databasen. Denne filen legger vi også inn i db pakken.

ImplementingSecure Transactions

Det er nå på tide å transformere hvor db.insert() til en sikker database transaksjon.

Clean Code: Improving Transactions in Kotlin

Vi skal nå se på hvordan vi kan forenkle koden for lagring av vaner i databasen.

Først skal vi se hvordan mye av koden kan modularisere ved å lage en egen Extension Functions for database objektet.

Clean Code: Further Improving Transaction and Performance

Vi skal nå videre forbedre koden vår. Vi bruker <T> for at funksjonen som sendes inn til transaction() funksjonen kan returnere hvilken som helt type. Typen Unit i Kotlin representerer ingen verdi (void). Vi bruker så nøkkelordet inline for å effektivisere koden.

Store the Habit in "CreateHabitActivity"

Vi starter her med å endre koden litt til for å gjøre den litt enklere. Her bruker vi nøkkelordet with og referanser til konstantene i HabitEntry klassen for å gjøre koden mer lesbar.

Nå må vi kalle store() funksjonen fra hovedkoden til Create Habit skjermbildet for å binde alt sammen.

Read All Habits from SQLite

Nå som brukeren kan lagre nye vaner er vi klar til å hente alle vanene som brukeren har opprettet.

Først programmerer vi en ny funksjon readAllHabits() i database tabellfilen HabitDbTable.kt.

Så kaller vi funksjon readAllHabits() når setter adapteren i hovedprogrammet MainActivity.kt

Da ser vi at vi får hentet frem alle test-vanene som vi har lagt inn.

Bildet kommer ikke opp, men det har nok sammenheng med at kurset veksler mellom datatypene int, streng, Uri og Bitmap.

Dette videokurset på Udemy har gitt deg en praktisk innføring i programmering av en Android app med programmeringsspråket Kotlin. Programmet er ikke ikke helt ferdig. Brukeren kan f.eks. ikke endre på tidligere registrerte vaner eller slette dem. Dette er ting du må se videre på selv når du programmerer din egen app. Lykke til på ferden :-)

Oversikt over alle komponentene i koden

Resurser på Internett

Vi skal her se på noen nyttige resurser for programmering av Android apps.

På nettsidene til MATERIAL DESIGN finnes det et bibliotek over de fleste ikonene som du vil trenge for å designe din Android app.

material.io/tools/icons/?style=baseline

På nettsidene til MATERIAL DESIGN finner du også nyttige tips på hvordan brukergrensesnittet til din Android app bør se ut.

https://material.io/design/layout/understanding-layout.html#

Valg av farger er en viktig del av design jobben. Pass på at teksten blir lesbar. COLOR TOOL er et flott verktøy som hjelper deg å velge de riktige fargekombinasjonene.

Origami Studio er Facebook sin egen applikasjon for å designe apps for ulike mobiltelefoner.

På Google sine nettsidene Android Developer finner du veiledningen Kotlin style guide som inneholder nyttig informasjon om navngivning og formatering av Kotlin kode.

Android apps med Kotlin