CafeMobil Android aplikacija - 1.1 dio - osnove u Android programiranju

Prije nego krenemo na izradu Cafe Mobil aplikacije, mislim da bi bilo pametno da pokažem neke osnove oko Android programiranja. U ovom tutorialu ćemo dodati jedan gumb na zaslon, napraviti "listener" za njega i pokrenuti nešto na klik. Osim toga, dodat ćemo još jedan izbor u izborniku i pokazati kako se aplikacija može testirati i uklanjati bugove (debugging).

Dodavanje izbora u izbornik

Prvo i najlakše je dodavanje novog izbora u izbornik. Otvorimo resurse i pronađemo menu/acitivity_main.xml. Sada trenutno sadrži samo izbor "Settings" i cijeli kod izgleda ovako:

Code:

---

<menu xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools" tools:context=".MainActivity">
    <item android:id="@+id/action_settings" android:title="@string/action_settings"
        android:orderInCategory="100" app:showAsAction="never" />
</menu>

---

Da bi aplikacija pokazala novi izbor, trebamo dodati novi "item". Dodajmo samo običan "Test" item kojeg ćemo koristiti samo za testiranje:

Code:

---

<item android:id="@+id/action_test"
        android:title="Test"
        android:orderInCategory="99"
        app:showAsAction="ifRoom"
        android:icon="@mipmap/ic_launcher"/>

---

I možemo odma primijetiti da nam je Android Studio označio android:title="Test" i javlja da je string hardcoded, tj da bismo trebali koristiti Strings.xml. Za vježbu to sami napravite, nije teško :) .
S obzirom da je postavljeno app:showAsAction="ifRoom", ta akcija će biti postavljena na ActionBar ako ima mjesta na njemu i koristiti će se ikona od launchera.

http://i.imgur.com/kBpeOuj.jpg

Kako bi testirali klik na taj izbor, možemo napraviti Toast poruku kada se klikne na ikonu. Za to trebamo otvoriti MainActivity klasu. Unutar MainActivity pronađemo metodu onOptionsItemSelected(MenuItem item) koja obrađuje klikove na Options Menu i unutra provjeravamo dali se dogodio klik na našu novu ikonu sa android:id="action_test".
Unutra već vidimo da je generiran kod koji provjerava dali se kliknulo na "action_settings":

Code:

---

if (id == R.id.action_settings) {
            return true;
        }

---

Iz toga lako možemo zaključiti kako napraviti provjeru dali je bio drugi gumb "action_test" i nadodamo:

Code:

---

else if (id == R.id.action_test) {
            Toast.makeText(this, "Menu test", Toast.LENGTH_SHORT).show();
        }

---

Toast je poruka na Androidu koja se prikazuje pri dnu ekrana, kao npr. sa ovom trenutnom aplikacijom:

http://i.imgur.com/VlHVqAq.jpg

Parametri za metodu makeText su redom - Context, charSequence/String, int.
Context - služi kako bi metoda znaka koja aktivnost poziva funkciju (u ovom slučaju MainActivity)
charSequence/String - tekst koji prikazujemo u Toast poruci, može se također koristiti Strings.xml iz resursa.
int - broj koji označava vrijeme prikaza poruke, obično se koristi Toast.LENGTH_SHORT ili Toast.LENGTH_LONG


Dodavanje gumba

Otvorimo resurs layout/acitivity_main.xml i odvucimo Button iz palete na centar ekrana:

http://imgur.com/XBqmum8

S obzirom da ćemo ga koristiti samo za testiranje, nije potrebno mu mijenjati atribute, samo pogledamo njegov ID kako bi mu mogli pristupiti u kodu. ID najlakše pronađemo tako da otvorimo activity_main u text mode i pročitamo:

Code:

---

android:id="@+id/button"

---

Otvorimo MainActivity i unutra prvo napravimo instancu objekta Button (zove se isto kao i element u xml layoutu) i pridružimo mu gumb koji smo dodali u layout.

Code:

---

Button button = (Button) findViewById(R.id.button);

---

To postavimo u onCreate metodu da se odma prilikom pokretanja MainActivity izvrši.
Metoda findViewById služi za pronalaženje View objekata na layoutu, a Button (kao i ostali elementi layouta) spada pod View element, što vidimo iz službene dokumentacije. S obzirom da metoda findViewById vraća View objekt, moramo ga pretvoriti u Button tako da navedemo (Button) prije poziva.
Trenutno taj gumb nema nikakvu funkcionalnost, samo stoji na sredini ekrana i ako ga pritisnemo - ništa se ne događa. Da bi mu zadali neku funkcionalnost, potrebno je postaviti listener (osluškivač događaja) na njega koji bi čekao na pritisak gumba:

Code:

---

button.setOnClickListener();

---

Ali to nam javlja grešku, zato što metoda setOnClickListener treba parametar. Unutar zagrada napišemo "new " i kliknemo ctrl + space kako bi se otvorio autocomplete izbornik i u njemu odaberemo OnClickListener{...}. Klikom na OnClickListener Android Studio nam generira metodu onClick u koju upišemo naredbe koje želimo da se izvrše kada kliknemo na gumb.

Code:

---

button.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
               
            }
        });

---

Unutar te metode postavimo Log, koji također možemo koristiti za testiranje, najčešće se koristi pri programiranju da zapiše greške u "logcat" - logovi sa Android uređaja:

Code:

---

Log.d("Test log", "Klik na gumb");

---

Log.d je metoda koja prima 2 parametra, oba su stringovi. Prvi parametar je tag, a drugi je poruka. Sada pokrenemo program i testiramo:

http://i.imgur.com/PMAX7TF.png

Debug sa breakpointovima ću pokazati kasnije, kad bude materijala za testiranje :)
Također podsjećam da se cijeli kod nalazi na GitHub-u.