Skripta Dizajn I Programiranje Mobilnih Aplikacija PDF

Razvoj mobilnih aplikacija
Prirunik za edukaciju
Osijek, 2013
Ovaj projekt financira
Europska unija
Elektrotehniki
fakultet Osijek
Poduzetniki
inkubator Bios d.o.o.
IPA komponenta IV
Operativni program Razvoj ljudskih potencijala
Projekt
U korak s globalnim trendovima za usklaenost s aktivnom politikom trita rada
http://edumobi.etfos.hr/
Izdava:
Elektrotehniki fakultet Osijek
Za izdavaa
Prof. dr. sc. Radoslav Gali, dekan
Suradnici:
Poslovanje 2 d.o.o.
Centar za poduzetnitvo Osijek
Lektura:
Ivana Vrban, prof.
Dizajn i prijelom:
Biroprint d.o.o.
Tisak:
Biroprint d.o.o.
Projekt U korak s globalnim trendovima za usklaenost s aktivnom politikom trita rada provodi Elektrotehniki fakultet Osijek u partnerstvu s Poduzetnikim inkubatorom BIOS d.o.o.
Ova je publikacija izraena uz pomo Europske unije. Sadraj je ove publikacije iskljuiva odgovornost Elektrotehnikog fakulteta Osijek i Poduzetnikog inkubatora BIOS i ni na koji nain ne
odraava gledita Europske unije.
Europsku uniju ini 27 zemalja lanica koje nastoje povezivati svoja znanja, resurse i sudbine.
Tijekom svog su pedesetogodinjeg razdoblja proirenja izgradile zonu stabilnosti, demokracije
i odrivog razvoja, zadravajui pri tome kulturalnu raznolikost, toleranciju i osobne slobode.
Europska unija dijeli svoja postignua i vrijednosti sa zemljama i narodima izvan svojih granica.
Europska komisija izvrno je tijelo Europske unije.
Obrazovanje je odraslih osoba definirano kao cjelina procesa uenja koji su namijenjeni ostvarivanju prava na slobodan razvoj osobnosti, osposobljavanju za zapoljivanje i osposobljavanju za
aktivno graanstvo. Ljudski je kapital jedan od najvanijih resursa Hrvatske koja nastoji postati
najkonkurentnije drutvo temeljem znanja u regiji. Cjeloivotno obrazovanje ima vanu ulogu u
ovom procesu. Obzirom na ubrzan rast nezaposlenosti posljednjih nekoliko godina i prognoza
da e ona i dalje rasti, potrebno je reagirati i osigurati dodatno obrazovanje kako bi se unaprijedile kompetencije nezaposlenih osoba.
Elektrotehniki fakultet Osijek je javno znanstvena nastavna ustanova koja s projektnim partnerom Poduzetnikim inkubatorom BIOS provodi projekt U korak s globalnim trendovima za
usklaenost s aktivnom politikom trita rada kroz IPA komponentu IV, Operativni program Razvoj ljudskih potencijala.
Projekt je namijenjen visokoobrazovanim osobama koje su zavrile struni studij na nekom od
tehnikih fakulteta u Slavoniji i Baranji. Cilj je projekta poveanje broja zaposlenih visokoobrazovanih osoba u Osjeko-baranjskoj upaniji kroz edukaciju koja je zasnovana na poticanju samozapoljavanja. Uz pomo edukacije Razvoj mobilnih aplikacija polaznici e stei nova znanja
i vjetine, predstaviti svoje aplikacije javnosti, podii svoj poduzetniki duh i saznati sve mogunosti samozapoljavanja.
Cilj je prirunika polaznicima edukacije olakati praenje nastave i pomoi im u usvajanju novih
znanja i vjetina. Prirunik se sastoji iz tri dijela:
1.
2.
3.
Dizajn mobilnih aplikacija

Programiranje mobilnih aplikacija
Poduzetnitvo
Kroz navedene e nastavne cjeline polaznici edukacije nauiti samostalno dizajnirati i programirati mobilne aplikacije, razvijati osnovne poduzetnike vjetine i bit e potaknuti na pokretanje
vlastitog posla.
Elektrotehniki fakultet Osijek zahvaljuje tvrtki Poslovanje2 te Centru za poduzetnitvo Osijek
koji su pomogli u izradi ovog prirunika.
Polaznicima edukacije i svim ostalim korisnicima ove knjige elimo uspjeh u radu!
Projektni tim:
Doc.dr.sc. Nenadi Kreimir, dipl.ing.
Bonjak Sonja, dipl.iur.
Pekanov Tihana, mag.ing.comp. , Poduzetniki inkubator BIOS d.o.o.
Balen Josip, dipl.ing.
Doc.dr.sc. Baumgartner Alfonzo, dipl.ing.
Zori Bruno, mag.ing.comp.
Hanzer Mirta, dipl.oec.
Dekan Elektrotehnikog fakulteta Osijek
Prof.dr.sc. Radoslav Gali
SADRAJ
1. UVOD U DIZAJN.......................................................................................................... 2
1.1. Teorija boja........................................................................................................................... 2
1.2. Teorija dizajna....................................................................................................................... 3
1.3. Dizajn logotipa i identiteta................................................................................................... 4
1.4. Dizajn grafikih elemenata................................................................................................... 5
2. DIZAJN KORISNIKOG SUELJA..................................................................................7

2.1. Uvod u korisnika suelja..................................................................................................... 7
2.2. Odnos izmeu DP i PX.......................................................................................................... 7
2.3. Osnovna struktura suelja aplikacije.................................................................................... 8
2.4. Osnove uspjenog dizajna.................................................................................................... 9
2.5. Korisniki unos za mobilne ureaje i ekrane osjetljive na dodir........................................... 9
2.6. Dizajn prilagoen korisniku................................................................................................ 10
2.7. Trajnost dizajna................................................................................................................... 11
2.8. Prototipi, koncepti, proof of concept.................................................................................. 11
2.9. Utjecaj ogranienja mobilnih ureaja................................................................................ 13
2.10. Postupak dizajniranja aplikacije za mobilne ureaje........................................................ 14
2.11. Slubene platformske smjernice....................................................................................... 14
2.11.1. Slubene teme............................................................................................................... 14
2.11.2. Efekti koji se pojavljuju kod interakcije korisnika s nekim elementom.......................... 15
2.11.3. Minimalna veliina tipki i ostalih elemenata................................................................ 15
2.11.4. Veliine ekrana.............................................................................................................. 16
2.11.5. Fontovi . ........................................................................................................................ 16
2.11.6. Boje............................................................................................................................... 17
2.11.7. Ikone ............................................................................................................................. 17
2.12. Informacijske poruke........................................................................................................ 22
2.13. Uzorci................................................................................................................................ 23
2.14. Reusable UI....................................................................................................................... 25
2.15. Building blocks.................................................................................................................. 25
2.15.1. Kartice (engl. Tabs)........................................................................................................ 25
2.15.2. Liste .............................................................................................................................. 26
2.15.3. Reetke (engl. Grid List)................................................................................................. 27
2.15.4. Prelistavanje (engl. Scrolling)......................................................................................... 28
2.15.5. Spinners......................................................................................................................... 28
2.15.6. Gumb (engl. Button)...................................................................................................... 28

2.15.7. Polje za unos teksta (engl. Text fields)........................................................................... 29
2.15.8. Traka za pretragu (engl. Seek bar) i klizai (engl. Sliders)............................................... 30
2.15.9. Napredak i aktivnost (engl. Progress and Activity)........................................................ 30
2.15.10. Prekidai (engl. Switches)............................................................................................ 32
2.15.11. Dijalozi......................................................................................................................... 33
2.15.12. Pickers.......................................................................................................................... 34
2.16. Navigacija i widgeti........................................................................................................... 35
2.17. Geste i animacija.............................................................................................................. 36
2.17.1. Geste............................................................................................................................. 36
2.17.2. Animacija....................................................................................................................... 38
2.18. Skalabilni dizajn................................................................................................................ 38
2.19. Layout aplikacije............................................................................................................... 40
3. OSNOVE PROGRAMIRANJA...................................................................................... 46
3.1. Uvod u programski jezik Java.............................................................................................. 46
3.2. Varijable, operatori [6]....................................................................................................... 46
3.3. Kontrola toka programa [8]................................................................................................ 48
3.3.1. Grananja.......................................................................................................................... 48
3.3.2. Petlje................................................................................................................................ 50
3.4. Polja.................................................................................................................................... 51
3.5. Metode [8]......................................................................................................................... 52
3.6. Razine pristupa................................................................................................................... 56
4. OBJEKTNO ORIJENTIRANO PROGRAMIRANJE......................................................... 58

4.1. Klase, objekti i enkapsulacija.............................................................................................. 58
4.2. Konstruktori........................................................................................................................ 59
4.3. Nasljeivanje...................................................................................................................... 61
4.4. Apstraktne klase [10].......................................................................................................... 62
4.5. Polimorfizam...................................................................................................................... 63
5. RAZVOJ APLIKACIJA ZA ANDROID PLATFORMU....................................................66

5.1. Instalacija potrebnih alata................................................................................................... 66
5.2. Kreiranje Android projekta................................................................................................. 68
5.3. XML kao osnova Android korisnikog suelja (UI-a)........................................................... 72
5.4. Android Activity i UI XML.................................................................................................... 74
5.5. Pokretanje aktivnosti (engl. Intent).................................................................................... 78
5.6. ivotni ciklus Android aktivnosti [14]................................................................................. 81

5.7. Podravanje razliitih ureaja [11]..................................................................................... 85
5.8. Fragmenti........................................................................................................................... 88
5.9. Asinkroni pozivi.................................................................................................................. 92
5.10. Preference Activity........................................................................................................... 95
5.11. ListView i List Activity....................................................................................................... 98
5.12. Action Bar....................................................................................................................... 109
5.13. Android SQLite baza podataka....................................................................................... 117
5.14. Koritenje senzora.......................................................................................................... 125
5.15. Google mape.................................................................................................................. 127
5.16. Multitasking.................................................................................................................... 136
6. IZRADA ANDROID APLIKACIJE................................................................................ 138

7. PODUZETNITVO.................................................................................................... 158
7.1. to je to poduzetnitvo?................................................................................................... 136
7.2. Procjena poduzetnikih sposobnosti................................................................................ 158
7.3. Poslovni plan.................................................................................................................... 159
7.4. Marketing i marketing plan.............................................................................................. 163
7.5. E-marketing...................................................................................................................... 165
7.6. Financiranje poslovnog poduhvata................................................................................... 166
8. LITERATURA............................................................................................................ 170
9. POPIS SLIKA............................................................................................................. 171
10. POPIS TABLICA...................................................................................................... 175
11. POPIS PRIMJERA................................................................................................... 176
Dizajn
1
UVOD U DIZAJN
1. UVOD U DIZAJN
1.1. Teorija boja
Oko je ovjekov najsofisticiraniji alat. Razlikuje i do 7500000 boja i njihovih nijansi. Boje ne
bi postojale bez svjetla jer se boja reflektira s odreenog objekta u odreenoj valnoj duini u
obliku svjetla. Tako je primjerice duga bijelo sunevo svjetlo razlomljeno kroz kapljice vode u
zraku i predstavlja vidljiv spektar boja. Svaka boja ima vlastitu valnu duinu. Postoje tri primarne
boje: crvena, uta i plava. Iz tih se boja mijeanjem mogu dobiti ostale, sekundarne boje kao to
su zelena, naranasta i ljubiasta, ali i neogranien broj nijansi u raznim kombinacijama. Isaac
Newton je 1666. godine razvio tzv. kota boja (engl. the color wheel), tj. prvi kruni dijagram
boja (Slika 1.), a od tada brojni znanstvenici i umjetnici prouavaju i dizajniraju brojne varijacije
tog koncepta.
Slika 1. Newtonov kota boja
Iz ovih su osnova proizala dva sustava boja u raunalnom svijetu:

1.
RGB (engl. Red, Green, Blue) je sustav boja kojemu su primarne boje crvena, zelena i
plava. Primjenjuje se na raunalnim zaslonima i temelji se na prikazu svjetlom. Pozadina je zaslona crna pa tamo gdje nema svjetla, nema ni boje. Na taj se nain dobiva crna boja, a bijela se
boja dobiva jednakim omjerom svih triju primarnih boja.
2.
CMYK je sustav boja kojemu su svijetloplava (C - cyan), svijetlocrvena (M - magenta),
uta (Y - yellow) i crna (K Key - oznaka crne boje) primarne boje. CMYK sustav boja najvie se
koristi u tisku i pripremi za tisak.
Priprema se za tisak uvijek radi s CMYK setom boja kako bi ono to je prikazano na zaslonu bilo
najslinije onomu to se dobije u ispisu. Kako bi se lake odabrala paleta boja za dizajn (ukoliko
nije definirana vizualnim identitetom klijenta), koriste se brojni alati koji su besplatno dostupni na Internetu kao to su Color Scheme Designer (http://colorschemedesigner.com/) i Color
Wizard (http://www.colorsontheweb.com/colorwizard.asp) (Slika 2.).
UVOD U DIZAJN
Slika 2. Alati za izbor boja
1.2. Teorija dizajna

U dananjem je modernom dobu dizajn sve ono to je vidljivo i opipljivo. Dizajn se bavi oblikovanjem svih predmeta koji se koriste. Nastao je pojavom industrijske revolucije kojom se serijski
i automatizirano proizvodila roba za nepoznate potroae. Dizajn nastoji odrediti ukus razliitih
profila kupaca. Reklame i marketing odreuju modu i privlanost nekog proizvoda pa potranja
za nekim proizvodom postaje sve vea. Dobar dizajn treba ponuditi proizvod koji e se razlikovati od uobiajenih standarda i stereotipa, a da pri tome bude u granicama kako bi ga kupac
shvatio i kupio. Ako se dizajn previe odmakne od standarda, kupac nee kupiti proizvod jer nije
shvatio to je umjetnik htio rei. Dizajn nikako ne smije biti teak za uporabu i koritenje. Treba
biti ekonomski isplativ za proizvodnju.
Dizajn se dijeli na:
a)
grafiki dizajn (naljepnice, plakati, logotipi)
b)
industrijski dizajn (engl. product design) (strojevi, automobili, kuanski aparati)
c)
tekstilni dizajn (materijali i krojevi)
Dizajn koji se koristi u izradi mobilnih aplikacija jest digitalni dizajn. Digitalni je dizajn najraireniji i najtraeniji dizajn. Temelji se na dizajnu korisnikih suelja, a popularno se jo naziva i UI
dizajn (engl. User Interface design). Trendovi i standardi digitalnog dizajna mijenjaju se iz dana u
dan. Dananji se trend dizajna temelji na izgledu proizvoda iz davnih tridesetih godina prologa
stoljea pa se zbog toga naziva vintage dizajn (Slika 3.).
Slika 3. Primjeri vintage dizajna kod izrade UI-a i logotipa [1]
UVOD U DIZAJN
Alati koji se najvie koriste za dizajn i obradu fotografija su:
a)
Adobe Photoshop
Jedan je od najkvalitetnijih alata na tritu koji koristi svaki profesionalni i ozbiljni dizajner. Adobe Photoshop primarno je alat za obradu i retuiranje fotografija, no njegovi mu alati i funkcije
daju status jednog od najboljih alata za izradu UI-a za internetske ili mobilne aplikacije. Najnovija inaica ovog alata donosi 3D funkcije kao i timeline.
b)
CorelDraw alat
Vrlo je slian Photoshopu, ali ima kvalitetnije funkcije za pripremu sadraja za tisak. Jednostavan je za koritenje i posjeduje najmonije alate za obradu vektorske grafike (grafike koja ne
mijenja svoju kvalitetu promjenom veliine).
GIMP [5] (engl. GNU Image Manipulation Program)
c)
Besplatan je, brz i malen alat koji posjeduje veinu Photoshopovih funkcija i odlina je alternativa komercijalnim alatima.
1.3. Dizajn logotipa i identiteta

Logotip je unikatan, jednostavan i prepoznatljiv potpis neke tvrtke ili pojedinca. Trebao bi na
jednostavan nain u jednoj boji prikazati ono ime se tvrtka ili pojedinac bavi. Moe se pojaviti
samo u tekstualnom obliku ili u kombinaciji teksta i slikovnog prikaza. Pod utjecajem trendova, logotipi su sve rjee jednobojni, a ee praeni slikovnim prikazom. Kao i u dizajnu UI i u
logotipima se pojavljuje vintage dizajn. Tako se razvio oblik i dizajn logotipa koji preteno koristi kaligrafiju (grki , kaligraphia; kalos = lijepo, graphein = pisati) ili krasopis, tj.
umjetnost lijepog pisanja rukom uz pomo pera ili kista (Slika 4.).
Slika 4. Primjeri logotipa [1]
Slika 5. Primjer smjernica izvedenih iz imena tvrtke ili pojedinca
UVOD U DIZAJN
Prije samog dizajniranja i crtanja logotipa, zapisuju se svi pojmovi koji su povezani s podrujem
kojim se pojedinac ili tvrtka bavi ili proizvodom koji proizvodi. Na taj se nain odreuje smjer
logotipa. Svrha je logotipa ponuditi vizualni identitet odreenoj tvrtki. Izabrani se logotip ne
mijenja due vrijeme ili nikada. Ako je logotip kombinacija teksta i slike i ako se iz imena tvrtke
ne moe razaznati ime se tvrtka bavi, dobro bi bilo da to slika vizualno prikae. Klijent e uvijek
traiti vie primjera logotipa za svoje poslovanje. U veini se sluajeva klijenti ne odlue za jedan
osmiljeni logotip, ve kombiniraju elemente razliitih prijedloga i na osnovu njih sastavljaju
idealan logotip.
Slika 6. Nekoliko prijedloga logotipa za istu tvrtku [1]
Svaki bi logotip trebao biti napravljen u vektorskom obliku kako bi se lake tiskao na plakate,
posjetnice, zaglavlja dokumenata, majice, alice, kalendare itd. Stoga je uz svaki logotip nuna
izrada knjige standarda. Knjiga je standarda dokument u kojemu su definirane sve smjernice za
provoenje vizualnog identiteta. Sadri tone ifre boja i dimenzija logotipa, podatke o minimalnoj i maksimalnoj dimenziji logotipa koji se tiska na odreeni medij te podatke o odstupanjima u bojama nakon tiska.
ZADATAK 1
Dizajniraj vlastiti logotip (na papiru) na temelju navedenih principa izrade logotipa.
1.4. Dizajn grafikih elemenata

Dizajn je grafikih elemenata opsean i sloen zadatak koji ovisi iskljuivo o ukusu i zahtjevima
klijenata. Svaki grafiki element suelja mora biti precizan i jasno prikazivati ono za to je namijenjen. Kada to nije mogue, uz svaki se grafiki element dodaje i kratki tekstualni opis koji je
vidljiv samo kod interakcije s pojedinim elementom (engl. tooltip, hint).
UVOD U DIZAJN
Slika 7. Veze izmeu vizualnog identiteta i izgleda aplikacije [1]
Zbog raznolikosti se ureaja posebno mora paziti na skalabilnost grafikih elemenata, a da pri
tome ostanu nepromijenjene kvalitete. Taj se proces moderno naziva Responsive Design, tj.
osjetljiv, brz dizajn koji osigurava optimalan doivljaj gledanja sadraja. To su primjerice Facebook, Pinterest, MySpace itd. Platforma kojom se najtee prikazuju grafiki elementi jest Android
platforma. Razlog tomu je veliki broj razliitih modela mobilnih ureaja (u svibnju 2012. godine
bilo ih je priblino 3975) koji imaju razliite veliine dijagonala svojih ekrana, tj. razliite gustoe
piksela - DP (engl. Density-independent Pixel) (Slika 8.). Odreena se ikona treba jednako otro
i isto prikazivati na svim ureajima i zbog toga ju je nuno izraditi u najmanje etiri veliine
(Slika 9.).
Slika 8. Razne veliine Android ureaja [2]
Slika 9. Primjer veliine jedne ikone za razliite gustoe piksela [2]
DIZAJN KORISNIKOG SUELJA

2. DIZAJN KORISNIKOG SUELJA
2.1. Uvod u korisnika suelja
Kao to je ve reeno u prethodnom poglavlju, ureaji koji se temelje na Android platformi
trenutno su najraireniji, a postoji i veliki broj razliitih veliina i izvedbi. Upravo je ta rairenost
najvei problem svakog dizajnera korisnikih suelja. Osnovna je podjela Android ureaja podjela na mobilne telefone (manje od 600dp) i tablet raunala (vee od 600dp) kao to je prikazano na slici 10. DP se koristi jer pridonosi gustoi piksela na ekranu za svaki mobilni ureaj, a
na taj nain odreuje i tone mjere svakog elementa suelja kako bi se prikazivao to slinije na
razliitim ureajima.
Slika 10. Odnosi veliine ekrana mobilnog telefona i tablet raunala [2]
2.2. Odnos izmeu DP i PX

Ekranu srednje gustoe, tj. 160dp jedan DP odgovara jednom pikselu, a ekranu iznimno velike
gustoe, tj. 320dp jedan DP odgovara dvama pikselima itd. Radi lakeg snalaenja i konverzije iz
jednog oblika u drugi, dostupni su brojni alati poput Android DP/PX convertera koji je dostupan
na http://labs.skinkers.com/content/android_dp_px_calculator/.
Gustoe se piksela u svijetu Androida dijele u 4 kategorije: LDPI 120 (engl. Low Dots Per Inch),
MDPI 160 (Medium), HDPI 240 (High) i XHDPI 320 (Extra High), a veliina ekrana moe biti:
mala, normalna, velika i iznimno velika. Prilikom dizajniranja posebno se treba paziti na veliinu elemenata, tj. elementi ne smiju biti premaleni za dodir. Svaka osoba ima kaiprst razliite
veliine i stoga je nuno da element koji slui za tipkanje bude dovoljno velik jer e u protivnom
izazvati nezadovoljstvo korisnika. Optimalna veliina, odnosno minimalna irina i veliina nekog
klikabilnog elementa je otprilike 7mm ili 48dp. Ako se prilikom dizajniranja suelja u obzir
uzme ovo pravilo, zavrna e aplikacija biti prikladna za koritenje.
Slika 11. Optimalna veliina nekog klikabilnog elementa suelja [2]

2.3. Osnovna struktura suelja aplikacije
Svaka gotova aplikacija ima dva osnovna dijela, izbornik i sadraj (Slika 12.). Izbornik korisniku
omoguuje odabir podataka koje eli prikazati, poziv funkcija za unos novih podataka ili izlaz iz
aplikacije.
Slika 12. Primjeri izbornika i sadraja [1]
Cijeli se koncept aplikacija za mobilne ureaje temelji na izborniku. Mobilni je ureaj oduvijek
bio ureaj za razmjenu poziva i SMS poruka i iz tog je razloga bio jednostavan za upotrebu.
Danas su mobilni ureaji mnogo razvijeniji i nude mogunosti koje su se nekada mogle samo
zamiljati. Usprkos tome, i dalje stanu u dep, a slue za obavljanje zadataka u pokretu. Iz tog
su razloga aplikacije za mobilne ureaje napravljene na nain da osiguraju brz i jednostavan pristup informacijama u pokretu. Upravo je zbog toga izbornik mobilne aplikacije najvanija stavka
(Slika 13.). Izbornici se danas rade kao obine liste ili tablice sastavljene uglavnom od dva ili tri
stupca s neogranienim brojem redova. Svako polje tablice ili liste moe, ali i ne mora, imati
sliicu i tekst kao opis funkcije, ali se u pravilu koriste oba opisa. Pritiskom na odreeno polje
izbornika aplikacija korisnika vodi do detaljnijih informacija koje su zatraene.
Slika 13. Primjeri dviju vrsta izbornika [1]
Slika 14. Od skice na papiru do gotovog suelja [1]
2.4. Osnove uspjenog dizajna

Uspjenim se dizajnom smatra svaki dizajn koji sam za sebe govori i opisuje pojedine funkcije
proizvoda, ne zbunjuje korisnika i olakava upotrebu proizvoda. Izrada uspjenog dizajna zapoinje skiciranjem. Skiciranje je osnova i skrauje proizvodni tijek i do 50%. Sama je skica ujedno
i koncept kompletne aplikacije, a pokazuje i detaljno razrauje osnovne funkcije i ponaanje
aplikacije kod interakcije korisnika. Kada je skica na papiru gotova, dizajner ju kopira u digitalni
oblik (finalni koncept) koji se alje klijentu na pregled i odobrenje za nastavak rada. Sljedei je
korak dodavanje dubine i boje u koncept to dizajn aplikacije privodi kraju. To su principi kojih
se treba pridravati jer olakavaju proces dizajniranja.
Uspjean je dizajn onaj dizajn kod kojega aplikacija na 90% ureaja izgleda gotovo identino.
Zbog toga je vrlo vano da elementi suelja ne budu previe komplicirani i ne sadre previe
detalja. Meutim, Apple iPhone ureaji nisu raeni na ovakav nain i svako se suelje radi po
mjeri zbog postojanja dviju veliina ekrana i dviju vrsta DPI-a. Kod Androida se svaki element
radi u minimalno etiri veliine jer dizajn mora biti fleksibilan i kvalitetan.
2.5. Korisniki unos za mobilne ureaje i ekrane osjetljive na dodir

Dva su osnovna elementa za unos podataka i interakciju korisnika s aplikacijom na mobilnim
ureajima: prostor za unos teksta i jednostavni gumb. Ova su dva elementa gotovo uvijek prisutna zajedno, ali ih je mogue rabiti i odvojeno. Neizostavni su u svakoj aplikaciji i koliko god
jednostavna aplikacija bila, barem jedan od ova dva elementa nai e svoje mjesto u njoj. Svaki
gumb ima maksimalno pet stanja vlastitog prikaza ovisno o interakciji (Slika 15.): (i) normalno
stanje, (ii) aktivno ili pritisnuto stanje, (iii) fokusirano stanje (nije aktivno ili pritisnuto), (iv) onemogueno stanje i (v) onemogueno i fokusirano stanje. Svako navedeno stanje prikazuje gumb
ili polje za unos teksta na drugaiji nain kako bi korisnik znao da je neto napravio.
Slika 15. Primjer stanja gumba
Postoje jo mnogi elementi koji omoguuju korisniku unos informacija u aplikaciju, ali i elementi koji daju potvrdu da je uspjeno, tj. neuspjeno obavio neku operaciju. Takvi se elementi
nazivaju dijalozi, a prikazuju da je neka funkcija obavljena, da je u obradi ili da trai potvrdu za
obavljanje neke vanije operacije. Tzv. su obavijesti (engl. Notifications) suprotne dijalozima,
a daju kratku obavijest korisniku to se trenutno dogodilo. Koja je, dakle, razlika izmeu dijaloga
i obavijesti? Dijalozi obino obavjetavaju korisnika kada neto nije u redu ili kada se aplikacija
iznenada zaustavi. Takoer su i najei oblik potvrde kod brisanja podataka, a obavjetavaju
kratko i jasno korisnika da je neto izvreno.
2.6. Dizajn prilagoen korisniku
Slika 16. Primjer dizajna koji je prilagoen korisniku [2]
Svaki je korisnik u isto vrijeme i kritiar jer svojim kritikama moe pridonijeti, ali i odmoi uspjehu aplikacije. Svaku kritiku, pozitivnu ili negativnu, treba cijeniti. Negativna kritika pridonosi
unaprjeenju proizvoda. Dobar je dizajner onaj dizajner koji svoj rad pokazuje i trai miljenje
ljudi koji i nisu toliko struni u podruju kojim se bavi. Dakle, nakon svakog je veeg dizajniranog
djela poeljno upitati ljude to misle. Ako veina ljudi shvati koja je funkcija svakog pojedinog
dijela suelja bez prevelikog dodatnog objanjavanja, onda je dizajner napravio jako dobar po-
10

sao. Ako se proizvod dizajnira za velike mase, ne bi se trebao dizajnirati ukoliko se svia samo
dizajneru. Ako se proizvod dizajnira za odreenog klijenta, tvrtku ili korporaciju, sve se smjernice dobivaju od klijenata i tei se slijediti vizualni identitet to je vie mogue. Suelje bi trebalo
biti pregledno, jasnih boja, jasnog i loginog rasporeda, a ipak svjee i novo. To nije nimalo lak
zadatak.
2.7. Trajnost dizajna

Trajan ili bezvremenski dizajn je dizajn koji je uvijek moderan i nikada ne zastarijeva (Slika 17.).
Ne oslanja se na moderne trendove, nego se uklapa u njih bez nekih veih ili gotovo nikakvih
izmjena. Danas postoji veliki broj stilova i zadanih trendova koji e za odreeno vrijeme biti
zamijenjeni nekim novim. Da bi dizajn bio trajan i bezvremenski, najbolje je izraditi ga to jednostavnije i ie. Poeljno je koristiti to vie bijele, sive i crne boje kao i provjerene teksture koje
se koriste ve dugi niz godina (drvo, metal, crna koa, trava itd.). Kod izrade je bezvremenskog
dizajna vizualni identitet od velike koristi jer je sam po sebi napravljen da traje.
Slika 17. Primjeri nekih bezvremenskih inaica dizajna [2]
2.8. Prototipi, koncepti, proof of concept

Svaka aplikacija prije izlaska na trite mora proi veliki broj prototipa i testiranja. Prototipima se provjerava mogunost i funkcionalnost koncepta, tj. je li mogue napraviti ono to je
zamiljeno. Koncept nastaje tako da se ideje prvo zapiu na papir, a tek onda u digitalni oblik i
prvi prototip. Gruba skica na papiru znatno skrauje vrijeme izrade digitalnog oblika (Slika 18.).
Sljedei je korak biranje alata za obradu slike i izraivanje prvog digitalnog oblika koncepta. Na
praznom se dokumentu, koji je prethodno postavljen na eljene dimenzije i eljenu gustou
piksela, skiciraju smjernice koje e olakati crtanje grafikih elemenata. To su iste one smjernice
ili grube linije koje su povuene na papiru kako bi se predoio raspored grafikih elemenata, no
sada su postavljene tono na eljene dimenzije (Slika 19.).
Nakon to su smjernice postavljenje, kree se u postavljanje elemenata suelja. Za ovaj se dio
procesa koristi to manje boja jer se zapravo radi gruba skica, tj. wireframe. Nakon to su svi
11

elementi suelja grubo nacrtani, tj. precrtani s papira, prvi je koncept gotov. Ovakav koncept
klijent moe mijenjati i u veini sluajeva se na njemu provode odreene izmjene.
Slika 18: Primjeri digitalnog oblika koncepta, tj. wireframe
Slika 19: Primjer postavljanja smjernica
Slika 20. Koraci u izradi koncepta, tj. wireframea
12
ZADATAK 2
Kreiraj wireframe, tj. koncept za aplikaciju. Dozvoljeno je koritenje najvie pet boja i pravilnih oblika.
2.9. Utjecaj ogranienja mobilnih ureaja

Razliiti mobilni ureaji imaju razliite komponente: ekrane, procesore, memoriju itd. Ekrani
koji su osjetljivi na dodir postoje u mnogo dimenzija i otrina zbog ega boje u prikazu mogu
neprimjetno varirati. Najvea je prednost ekrana na dodir osjeaj koji korisnik ima kada ga koristi. Razni efekti i animacije stvaraju ugodno okruenje za rad. Efekti i animacije imaju svoja
ogranienja. Ne treba koristiti napredne grafike animacije ako se radi na primjer o aplikaciji
koja slui za itanje pote.
Slika 21. Animacija od prve do zadnje sliice [1]
Za takve i sline aplikacije koriste se jednostavne animacije koje se najee sastoje od: postepenog prikazivanja (engl. fade in), postepenog nestajanja (engl. fade out), pomaka sadraja u
lijevo, desno, gore, dolje itd. Takve animacije i efekti ne naruavaju rad ureaja i aplikacije jer su
jednostavne, a ne koriste ni previe resursa mobilnog telefona. Prednost im je to se prikazuju
na gotovo svim ureajima jednako. Za ovakav tip animacija nisu potrebni dodatni grafiki elementi, ve se animacija izvrava programski, kodom. Kompleksne animacije mogu koristiti niz
grafikih elemenata koji se izmjenjuju u odnosu na vrijeme, ali takve animacije nisu poeljne i
mogu dovesti do velikog pada brzine u izvravanju neke funkcije.
13

2.10. Postupak dizajniranja aplikacije za mobilne ureaje
Slika 22. Dizajn aplikacije
Aplikacije za mobilne ureaje moraju biti jednostavne, ali i ugodne za koritenje. Moraju pruati
brz pristup informacijama i olakavati svakodnevne zadatke. Postupak dizajna mobilne aplikacije nije lak zadatak, a voen je zahtjevima i eljama klijenata. Nakon to je razvijen koncept i
prvi prijedlog dizajna, potrebno je isjei ga na elemente, tj. izvaditi iz dizajna sve elemente
koji tvore korisniko suelje. Dakle, dizajn je samo jedna obina slika koja ne moe tvoriti neto
funkcionalno.
ZADATAK 3
Iz kreiranog wireframea iz prethodnog zadatka isjeci pojedine elemente i spremi ih kao zasebne uz
prilagoeni naziv svakog elementa.
2.11. Slubene platformske smjernice
Slika 23. Primjer ikona [2]
Platformske smjernice opisuju kako i na koji nain pojedini element treba izgledati i kako se
treba ponaati. Platformske smjernice postoje i zbog imida platforme. UI Android sustav je
jednostavan, pregledan i privlaan pa bi i aplikacije trebale biti takve kako ne bi previe vizualno
odstupale od izgleda sustava ili izgledale kao neki drugi operacijski sustav.
2.11.1. Slubene teme

Pomou slubenih tema aplikacija izgleda kao dio sustava (Slika 24.). Tema daje konzistentan
izgled aplikaciji i njene elemente ini istima kao i u operacijskom sustavu. Ako ne postoji vlastiti
dizajn za aplikaciju, neka e se od standardnih tema primijeniti automatski.
14
Slika 24. Primjer dviju standardnih tema Android sustava [2]
2.11.2. Efekti koji se pojavljuju kod interakcije korisnika s nekim elementom

Efekti korisniku daju do znanja da je napravio odreenu interakciju s nekim dijelom korisnikog
suelja. Ovakvi su efekti uobiajeni u interakciji s gumbima, listama, prekidaima i ostalim elementima. Ako se koristi slubena tema Android sustava za aplikaciju, efekti e biti naslijeeni
od te teme, a ako se koristi vlastiti dizajn, efekte e morati kreirati pojedinac sam. Obino se
za jednostavne efekte, npr. pritisak na neku tipku (Slika 25.), koriste .xml datoteke u kojima je
opisana animacija, tj. efekt.
Slika 25. Primjer efekta nakon dodira prstom [2]
2.11.3. Minimalna veliina tipki i ostalih elemenata

Android operacijski sustav odreuje preporuenu najmanju veliinu elemenata koji se klikaju, a
koja je priblino 7 mm ili 48dp-a. Minimalan je razmak izmeu elemenata 8dp. Ovaj se razmak izmeu pojedinih elemenata dodjeljuje automatski. U vlastitom dizajnu treba osobito voditi rauna
o razmacima izmeu elemenata jer e inae nastala suelja biti nepregledna i nefunkcionalna.
Slika 26. Primjer dimenzionalnih odredbi i raspored elemenata[2]
15

2.11.4. Veliine ekrana
Veliine ekrana ve su opisane prema razliitim rezolucijama i gustoama piksela. Standardne
smjernice sustava za razliite dimenzije zaslona su:
a)
Budite fleksibilni
Suelja se trebaju automatski prilagoavati bilo kojem zaslonu.

b)
Optimizirajte suelje
Korisnik e za dizajn za maleni zaslon morati uloiti vie truda da doe do razliitih informacija
jer sav sadraj nije mogue smjestiti na zaslon malih dimenzija. Veliki zasloni (npr. tablet raunala) imaju puno mjesta za raspored elemenata i sadraja. Dakle, ako aplikacija sadri pregrt
informacija, kod malih e zaslona imati jedno suelje, a kod velikih drugo suelje. Ovdje se ne
misli na drugaiji izgled suelja (boja, oblik itd.), nego na suelje koje e prikazivati vie informacija odjednom.
c)
Elementi suelja za sve
Potrebno je priloiti sve sliice/grafike, tj. elemente suelja u svim ponuenim razluivostima
(ldpi, mdpi, hdpi, xhdpi) kako bi svaki element suelja izgledao lijepo, otro i pravilne veliine na
razliitim dimenzijama zaslona.
2.11.5. Fontovi
Slubeni je font Android operativnog sustava od verzije Ice Cream Roboto (Slika 27.). Posebno je
kreiran za potrebe novog sustava i prilagoen je svim dimenzijama zaslona. Sav tekst koji postoji
u aplikaciji koristi SP (engl. Scale-Independent Pixels) kao mjernu jedinicu dimenzije. SP mjerna
jedinica osigurava jednako prikazan tekst na bilo kojem ureaju bilo kojih dimenzija zaslona, tj.
nee biti niti manji niti vei na razliitim rezolucijama zaslona.
Slika 27. Izgled Roboto slubenog fonta [2]
16
Slika 28. Predefinirane veliine teksta [2]
2.11.6. Boje
Slubena je boja Android platforme plava pa prema tome i veina elemenata suelja koristi tu
boju nakon korisnikove interakcije. Ne postoje odreena pravila kod odabira boja, bitno je da
boje odgovaraju vizualnom identitetu i da imaju dobar kontrast (Slika 29.). Ne smije se zaboraviti na osobe koje ne razlikuju boje, a posebno zelenu i crvenu. Alati poput ranije navedenog Color
Scheme Designera nude i pregled sheme boja kroz oi osobe koja ne razlikuje boje.
Slika 29. Primjeri raspona boja
2.11.7. Ikone
Ikone su malene sliice koje uglavnom grafiki opisuju neku funkciju (npr. simbol olovke govori
korisniku da moe promijeniti ili dodati neki tekst). Razlikujemo nekoliko vrsta ikona:
a)
Pokretaka ikona (engl. Launcher Icon) je vizualna prezentacija aplikacije i nalazi se na
poetnom zaslonu i izborniku aplikacija. Ikone se trebaju dizajnirati s posebnom panjom, trebaju izgledati lijepo i otro na svim pozadinskim slikama poetnog zaslona Android platforme.
Dimenzija je ovih ikona propisana, a iznosi 48x48dp. Moraju biti lagane dubine ili 3D izgleda s
gornje strane.
Slika 30. Primjer ikona, tj. dubine kod poetnog zaslona [2]
17

b)
Ikone na traci s alatima su vizualne prezentacije neke odreene funkcije. Tako je na
primjer u alatnima trakama mogue posjedovati ikone za brisanje, izmjenu podataka, snimanje
podataka, novi izbornik, dodavanje korisnika itd. Dimenzija je ovakvih ikona strogo propisana i
iznosi 32x32dp. Stil je takoer strogo propisan, tj. ikone ne bi trebale biti previe detaljne, nego
ravnog (engl. flat) izgleda. Ako ikona sadri tanku grafiku, potrebno je zakrenuti ju za 45 stupnjeva kako bi se ispunio prostor od 32x32dp.
Slika 31. Ikona za alatnu traku ima propisanu veliinu 32x32dp [2]
ZADATAK 4
Dizajniraj vlastitu pokretaku ikonu pomou GIMP alata za obradu fotografija.
RJEENJE ZADATKA
Za kreiranje se jednostavne pokretake ikone koristi GIMP, besplatan alat za obradu fotografije.
Najnovija je verziju GIMP-a dostupna na http://www.gimp.org. GIMP je malen i jednostavan
alat za obradu fotografije, crtanje i kreiranje razliitih elemenata. Vrlo je slian Photoshopu. Iako
nije napredan kao Photoshop, donosi vrlo zanimljive i napredne alate. (Slika 32.).
Slika 32. Korisniko suelje GIMP-a: 1. Traka s alatima; 2. Radna povrina; 3. Traka s bojama i slojevima
18

Nakon upoznavanja s GIMP-ovim sueljem, kree se u izradu pokretake ikone. Prvi je korak
kreiranje novog dokumenta tako da se u glavnoj alatnoj traci odabere File New. Zatim se unosi
veliina dokumenta, njegova rezolucija i boja pozadine (Slika 2.26.). Budui da postoje razliiti
Android ureaji s razliitim zaslonima, mora se izraditi najmanje tri razliite veliine pokretakih ikona. Postavlja se pitanje zato izraivati samo tri razliite veliine elemenata ako postoje
etiri gustoe piksela (XHDPI, HDPI, MDPI, LDPI)? Razlog tomu je injenica to se danas vie ne
proizvode zasloni s najmanjom gustoom piksela, odnosno zasloni LDPI rezolucije. Ako netko i
posjeduje takav ureaj, Android platforma e mu automatski dodijeliti grafike elemente MDPI
gustoe piksela koji su najblii LDPI rezoluciji.
Slika 33. Postavljanje novog dokumenta u GIMP-u
U prostor za unos irine i visine dokumenta unosi se 72px (piksela) (Slika 33.) jer dokument
treba biti kvadratnog oblika. Visina i irina od 72px je standardna veliina ikone za HDPI rezoluciju. Ove granice dokumenta osiguravaju tonu veliinu ikone koja je jednaka ostalim ikonama
na zaslonima s HDPI rezolucijom. Kada se kreira pokretaka ikona za XHDPI rezoluciju, veliina
dokumenta bit e za 24px vea, odnosno 96x96px, a za MDPI rezoluciju 24px manja u odnosu
na HDPI rezoluciju, tj. 48x48px. Kao rezolucija dokumenta navedena je rezolucija od 150dpi.
Ova rezolucija moe ostati i standardna 72dpi, no poveanjem se na 150dpi osigurava otrina i
vea koliina detalja ikone. Postavlja se pozadina ikone koja je prozirna. Pozadina ne mora nuno biti prozirna jer e biti kreirana pokretaka ikona koja ima sjenu pa je ovaj korak od iznimne
vanosti.
Nakon to je kreiran novi dokument, crta se osnovni oblik ikone koji je kvadratnog oblika sa zaobljenim rubovima. Na slici 34. prikazan je poloaj alata koji su potrebni. Ranije kreirani kvadrat
imat e zaobljen rub od 12px. Jednostavno se desnim klikom mia na radnu povrinu, povlaenjem ocrtava osnovni oblik ikone.
19
Slika 34. Postavljanje alata u GIMP-u: 1. oznaava se Rectangle selection tool; 2. u postavkama
Rectangle selection tool oznaava se da kvadrat ima zaobljen rub, a nakon toga se zadaje polumjer
od 12px; 3. dranjem lijevog klika na miu i povlaenjem mia preko radne povrine ocrtava se osnovni
oblik kvadrata sa zaobljenim rubom
Napravljeni se osnovni oblik mora obojiti. Na slici 35. prikazan je poloaj alata za bojanje i njegove postavke. Kada se odabere boja u dijalogu za odabir boje, boja se objekt unutar okvira oblika
(iscrtani okvir).
Slika 35. Postavljanje alata za bojenje u GIMP-u: 1. oznaava se Bucket fill tool i otvara se dijalog za izmjenu boje ispune; 2. u otvorenom dijalogu odabire se boja za ispunu objekta; 3. klikom unutar granica
objekta (iscrtan dio) nanosi se boja ispune ime zavrava bojanje objekta
Nakon bojanja objekta dodaje se sjena na objekt tako da se napravi kopija postojeeg objekta
(Slika 36.). Kopiju koja je kreirana sakriva se od pogleda, a original e se obojiti (istim postupkom
kao i prvi puta) u crnu boju.
20
Slika 36. Kopiranje objekta u GIMP-u: 1. klikom na tipku za kopiranje Layera, odnosno sloja radi se
kopija objekta; 2. klikom na tipku (simbol oka) pored kopiranog sloja skriva se kopija od pogleda
Kada je originalni objekt obojan, kreira se sjena pomou Gaussian blur filtera. GIMP podrava
mnotvo filtara koji omoguuju razliite efekte i manipulacije objekata i fotografija. Prije primjenjivanja blur efekta potrebno je maknuti oznake s objekta. Ako objekt ostane obiljeen, blur
efekt e se primjenjivati unutar granica objekta (iscrtani dio) pa e se dobiti otar rub unutar
kojeg e objekt biti zamuen. Oznake se uklanjaju istovremenim pritiskom tipaka SHIFT+CTRL+A
na tipkovnici.
Slika 37. Blur filter u GIMP-u: 1. u glavnom se izborniku bira Filters; 2. u padajuem se izborniku obiljeava Blur i klika se na Gaussian Blur
21
Slika 38. Blur filter u GIMP-u: 1. u novootvorenom dijalogu postavljaju se vrijednosti blur po horizontalnoj i vertikalnoj osi; 2. pritiskom na tipku OK dodajemo efekt na na objekt
Nakon primijenjenog blur filtra na objekt, kopija objekta koji je skriven od pogleda dobit e se
ponovnim pritiskom na tipku pokraj sloja sa simbolom oka. Ovim se postupkom pravi osnovni
oblik ikone. Daljnjim modificiranjem i dodavanjem sadraja na osnovni oblik moe se dobiti
veliki broj varijanti ikone.
Kada se zavri s kreiranjem ikone i kada se doe do zadovoljavajueg izgleda, ikonu se pohranjuje sa eljenim imenom u *.png format. PNG (engl. Portable Network Graphics) format podrava
prozirnost tako da e se sjena i zaobljeni rubovi vidjeti na Android ureaju. Postupak izrade
ikone odreene gustoe piksela uvijek je isti. Razlika je samo u veliini dokumenta kao to je ve
objanjeno prije.
Slika 39. Izgled jedne gotove ikone sa zaobljenim rubovima i sjenom na Android ureaju s odreenom
pozadinskom slikom.
2.12. Informacijske poruke

Operacijski sustav Android temelji se na jednostavnosti i ugodnom koritenju. Postoje odreene
smjernice koje jednostavno i jasno obavjetavaju korisnika da se neto dogodilo ili da se izvrava:
a)
Budite kratki. Obavijestite korisnika o nekoj radnji sa to manje rijei.
b)
Budite jednostavni. Nije potrebno korisniku postavljati duge upite kao na primjer: Jeste li sigurni da elite obrisati ovu datoteku?. Dovoljni su jednostavni upiti: Obrisati?.
22

c)
Obraajte se korisniku koristei zamjenicu Ti. Tekst poruke ili upita koji se postavlja
korisniku treba zvuati kao oputeni razgovor kojim se i inae sluite u slobodno vrijeme.
d)
Vane stvari stavljajte na prvo mjesto.
e)
Opiite samo to je nuno.
f)
Izbjegavajte ponavljanja.
2.13. Uzorci
Uzorci su na Android platformi elementi suelja. Ako za takve elemente nije predvien poseban
dizajn, onda se koriste neke od slubenih Android tema. Uzorci dolaze u velikom broju, a najvaniji su:
a)
Obavijesti
Obavijesti informiraju i obavjetavaju korisnike. To su: nove dolazne poruke, elektronika pota,
proputeni telefonski pozivi itd.
Slika 40. Primjer obavijesti dolazne poruke
b)
Traka alata
Traka alata slui za brz pristup pojedinim funkcijama aplikacija i ubrzava korisnikov rad s aplikacijom (Slika 41.).
Slika 41. Primjer jedne alatne trake koja sadri osnovne alate: pretraga, opcije itd. [2]
c)
Swipe Views
Swipe Views predstavlja brzu navigaciju kroz sadraj aplikacije lijevim i desnim pokretima prsta
po zaslonu. Na taj se nain postie efekt listanja stranica.
23
Slika 42. Primjer Swipe View navigacije pokretom u lijevo [2]
d)
Potvrivanje i informiranje (Slika 43.)
Potvrivanje (engl. Confirming) je maleni dijalog kojim se potvruju radnje, npr. brisanje i sl.
e)
Informiranje (engl. Acknowledging)
Informiranje podrazumijeva informaciju koja je upuena korisniku da je neto uspjeno obavljeno.
Slika 43. Confirming & Acknowledging [2]
f)
Widgets
Widgeti predstavljaju produeno suelje neke aplikacije (Slika 44.). Nalaze se na poetnom zaslonu i obavljaju svoje funkcije ak i kada je aplikacija ugaena. Obino widgeti nemaju sve
funkcije normalne aplikacije i pritiskom se na njih otvara normalna aplikacija.
Slika 44. Najpopularniji primjeri widgeta [2]
Android aplikacija ima stroga pravila o tome kako elementi suelja i ikone za pojedini dio suelja
trebaju izgledati. Ako se kreira multiplatformska aplikacija, ne bi se trebao koristiti isti stil, tj.
isti skup ikona na svim platformama. Ta pravila ne vrijede ukoliko postoji kompletno dizajnirano
suelje koje ne koristi niti jednu slubenu temu Android platforme.
24

2.14. Reusable UI
Reusable UI je korisniko suelje iji se elementi mogu iskoristiti za neke druge projekte (Slika
45.). Elementi korisnikog suelja (ikone, izgled tipki, pozadinska tekstura) koji su raeni za
nekog klijenta mogu se ponovno iskoristiti u nekom drugom projektu. Zbog toga je potrebno
napraviti skup ikona koje se mogu koristiti vie puta, a da se ne primijeti da su preuzete iz neke
druge aplikacije. Ikone na alatnoj traci jedne aplikacije ne razlikuju se mnogo u stilu i veliini od
ikona neke druge aplikacije. Isto vrijedi i za pozadine i neke druge elemente UI-a. Ako se uestalo koriste isti elementi, korisno bi bilo organizirati ih po direktorijima kako bi se proces izrade
suelja jo vie ubrzao.
Slika 45. Primjeri Reusable UI elemenata [1]
ZADATAK 5
Iz isjeenih elemenata u prethodnom zadatku stiliziraj svaki element i spremi ga pod odgovarajuim
nazivom.
2.15. Building blocks

Building blocks su gotovi grafiki elementi koji se mogu koristiti odmah (engl. out of the box),
a nalaze se u svakoj aplikaciji. Slue za prikaz i organizaciju podataka i omoguavaju interakciju
korisnika s aplikacijom. Izgled im varira ovisno o osnovnoj temi odreenog mobilnog ureaja na
koji nije primijenjen niti jedan drugi grafiki element.
2.15.1. Kartice (engl. Tabs)

Kartice slue za brzu navigaciju kroz aplikaciju. Obino se nalaze na vrhu aplikacije, a postoje
u razliitim izvedbama. Promjena sadraja ovakvim nainom navigacije odvija se pritiskom na
odreenu karticu ili pomicanjem prsta preko ekrana u desno ili lijevo (engl. swipe).
a)
Pomine kartice (engl. Scrollable tabs)
Najpoznatiji je primjer pominih kartica Google Play aplikacija (Slika 46.). Kartice se nalaze pri
samom vrhu aplikacije i reagiraju na dodir i pokret. Ovaj nain navigacije podrava Android
operacijski sustav 3.0. Moe sadravati velik broj naslova (engl. Item), ali uvijek prikazuje samo
tri tako da izmjenjuje naslove tijekom korisnikog kretanja kroz izbornik. Obine, fiksne kartice
to ne mogu.
25
Slika 46. Google Play i Scrollable tabs
b)
Fiksne kartice (engl. Fixed tabs)
Fiksne se kartice takoer najee nalaze na samom vrhu ekrana i slue za brzu navigaciju kroz
sadraj aplikacije. Za razliku od pominih kartica mogu sadravati samo mali broj naslova. Navigacija se vri dodirom na naslov ili pomicanjem prsta po ekranu. Svaki naslov je jednake irine,
a irina je odreena najveom karticom, odnosno karticom koja ima najdui tekst. U sluaju da
nema dovoljno mjesta, kartice postaju pomine. Iz tog se razloga preporuuje koristiti samo tri
kartice sa to kraim tekstom.
Slika 47. Primjer fiksnih kartica (Fixed tabs)
2.15.2. Liste
Liste prikazuju podatke koji su organizirani jedan ispod drugoga to omoguava njihov laki pregled. Navigacija se kroz listu provodi pomicanjem prsta prema gore ili dolje. Svaki je podatak u
listi odvojen od drugog tankom linijom zbog preglednosti, a takav se podatak naziva element
liste. Liste podravaju interakciju korisnika s pojedinim naslovim.
Liste se mogu pojaviti u vie oblika:
a)
Liste s naslovom koji ima samo jedan red podataka jesu primitivne liste. Korisne su kod
lakih suelja i kratkih podataka.
b)
Liste s naslovom koji ima dva reda podataka koriste se u reprodukciji glazbe, imenika
itd. Jedan naslov ili polje liste sadri vie redova od kojih je jedan red naslov, a drugi opis.
c)
Liste s vie redova podataka mogu sadravati tekst, slike, gumbe i ostale elemente za
prikazivanje podataka.
Liste sadre i razdjelnik sekcija koji olakava organizaciju podataka i poveava preglednost.
26
Slika 48. Liste s jednim i vie redova podataka
2.15.3. Reetke (engl. Grid List)

Tablice su alternativa listama, a najee prikazuju neki podatak koji sam sebe opisuje slikom. Za
razliku od obinih lista pomine su u svim smjerovima, a dolaze u dva oblika:
a)
Generike reetke (engl. Generic grids)
Redoslijed sadraja odreuje smjer u kojem se pomie prst (kod obinih lista sadraj je jedan
ispod drugoga) to moe zbuniti korisnika jer su reetke pomine u svim smjerovima. Kako ne
bi dolo do zabune, ograniavaju se ili na vertikalan (Slika 49.) ili na horizontalan smjer. Kod
horizontalnog se smjera pomicanja ne bi trebala koristi pomina kartica jer se kod horizontalne
interakcije prstom mijenja sadraj.
Slika 49. Primjer reetke s vertikalnim pomakom
b)
Reetke s naslovima
Reetke se s naslovima po svojoj funkcionalnosti ne razlikuju od generikih reetki. Jedina je

razlika to uz sliku posjeduju i tekst koji opisuje pojedinu reetku (Slika 50.).
27
Slika 50. Reetke sa slikom i naslovima
2.15.4. Prelistavanje (engl. Scrolling)

Prelistavanje je funkcija koja se koristi kada postoji velika koliina sadraja koji se ne nalazi niti u
listi niti u reetci. Obino se nalazi u raznim prozorima opcija. Za pomak se koristi prst u smjeru
gore, dolje, a ponekad i lijevo, desno. Brzina prelistavanja ovisi o brzini pomaka prsta. Aplikacija
omoguuje ovu funkciju ako je sadraj prevelik za ekran ureaja. Na lijevu stranu ekrana dodaje
indikator (engl. scrollbar) da je pomak omoguen.
2.15.5. Spinners
Spinneri omoguuju brz odabir pojedinog podatka. U nefokusiranom stanju spinner prikazuje
zadnju odabranu stavku. Dodirom na spinner otvara se padajua lista s ponuenim podatcima
za odabir koji se nalaze u formama ili alatnim trakama (Slika 51.). Ako se nalaze u formama,
pogodni su za odabir raznih informacija prilikom registracije korisnika na neki servis (spol, kuna adresa, adresa na poslu). Ako se nalaze u alatnim trakama, uglavnom slue za promjenu ili
pregled podataka. Ako se promjena ili pregled podataka vri esto, preporuuje se koritenje
kartica.
Slika 51. Primjer spinnera u formi ili alatnoj traci
2.15.6. Gumb (engl. Button)

Gumb je osnovni i najpoznatiji element svakog suelja. Koristi se za potvrivanje podataka,
izvravanje neke akcije itd. Moe sadravati i sliku i tekst. Android podrava dva tipa gumba:
standardni gumb i gumb bez ruba.
a)
Standardni gumb
Standardni je gumb osnova svakog suelja. Pojavljuje se s obrubom i pozadinom, a moe biti
veliki i mali. Mali se koristi kako bi se uklopilo u sadraj aplikacije, a veliki u dijalozima. Razlikuju
se veliinom gumba i veliinom teksta u njima.
28
Slika 52. Primjer malog i velikog gumba
b)
Gumb bez ruba
Gumb bez ruba sadri sve funkcije standardnog gumba, ali nema pozadinu i rub zbog ega se
lake uklapa u moderan izgled novijih verzija Android sustava. Ovim svojstvom izgleda kao obina sliica koja je podlona interakciji korisnika
Slika 53. Primjer gumba bez ruba
ZADATAK 6
Gotove stilizirane elemente suelja iz prethodnog zadatka primjeni na jednom gumbu u Eclipse razvojnom okruenju.
2.15.7. Polje za unos teksta (engl. Text fields)

Polje za unos teksta omoguava korisniku unos teksta u aplikaciju. Kada korisnik dodirne polje
za unos teksta, Android automatski prikazuje tipkovnicu i omoguuje korisniku unos. Polja za
unos podravaju odabir teksta, ali i kopiranje i lijepljenje u neko drugo polje za unos. Mogu biti
jednoredna ili vieredna. Ako su polja jednoredna, tekst se pri unosu pomie u lijevo i uvijek
prikazuje zadnju rije ili slovo koje je korisnik upisao, a vieredna polja tekst na kraju unosa
prebacuju u sljedei red. Polja za unos mogu biti i kategorijski opredijeljena. Postoje polja koja
omoguuju unos lozinke, broja telefona, adrese elektronike pote i sl. Kategorija prilagoava
tipkovnicu za laki i bri unos teksta: ako postoji polje za unos broja telefona, tipkovnica je automatski postavljena na numeriku verziju, a ako postoji polje za unos lozinke, unos e prikazivati
samo zvjezdice (*). Polja se za unos teksta mogu i sama zavravati, tj. davati prijedloge na osnovi
teksta koji upisujemo (engl. auto-complete). Ovakav je tip pogodan za unose adresa elektronike pote ili telefonskih brojeva jer se ponaaju kao jednostavna pretraga.
29
Slika
54. Primjer
tekstualnog
unosa Sliders)
(engl.
Seek bar)
i klizai (engl.
2.15.8.Traka za pretragu
Klizai Traka
daju brz
jednostavan
odabir
ili vrijednosti.
Sastoje se od trake
tra i gumba
2.15.8.
za ipretragu
(engl.
Seekneke
bar)razine
i klizai
(engl. Sliders)
koji klize po traci. Najmanja je vrijednost na lijevoj strani, a najvea na desnoj. Najee se
Klizai
daju
i jednostavan
odabir
neke razine
ili vrijednosti.
koriste
kodbrz
promjene
ili otrine,
kontrasta,
intenzitetaSastoje
itd. se od trake i gumba koji
glasnoe
klize po traci. Najmanja je vrijednost na lijevoj strani, a najvea na desnoj. Najee se koriste
kod promjene glasnoe ili otrine, kontrasta, intenziteta itd.
Slika 2.46.Primjer
Primjer klizaa u standardnim Android 4.0 temama
Slika 55. Primjer klizaa u standardnim Android 4.0 temama
2.15.9.Napredak
Napredak i aktivnost (engl. Progress and Activity)
2.15.9.
Napredak
i aktivnost
(engl.
Progress
Activity)
Napredak
i aktivnost
ukazuju da
se neki
proces and
izvrava
te obavjetavaju korisnika da prieka
dok se aktivnost
u potpunosti
nese
izvri.
Napredak
i aktivnost
ukazuju da
neki proces izvrava te obavjetavaju korisnika da prieka
dok se aktivnost u potpunosti ne izvri.
Traka napretka
a)
Traka napretka
Traka se napretka koristi za one aktivnosti za koje se zna koliko tono traju te obavjetava
Traka se napretka koristi za one aktivnosti za koje se zna koliko tono traju te obavjetava korisnikorisnika koliko je vremena potrebno da se zadatak izvri. Traka se napretka uvijek ispunjava
ka koliko je vremena potrebno da se zadatak izvri. Traka se napretka uvijek ispunjava od 0% do
od 0% do 100% i nikada se ne vraa na niu vrijednost. Ako se u pozadini izvrava vie od
100% i nikada se ne vraa na niu vrijednost. Ako se u pozadini izvrava vie od jedne aktivnosti,
jedne aktivnosti, traka napretka prikazuje ukupno stanje izvrenosti svih aktivnosti.
aktivnosti Kada
traka napretka prikazuje ukupno stanje izvrenosti svih aktivnosti. Kada doe na 100% oznaava
doe na 100% oznaava kraj svih aktivnosti. Na primjer
primjer, ako postoji samo jedan zadatak koji
kraj svih aktivnosti. Na primjer, ako postoji samo jedan zadatak koji se trenutno izvrava, traka
se trenutno izvrava, traka napretka pokazuje proces od 0% do 100% izvrenosti. Ako postoji
napretka pokazuje proces od 0% do 100% izvrenosti. Ako postoji vie procesa u pozadini, oni
vie procesa u pozadini, oni se zbrajaju i njihov se zbroj dijeli sa 100 i tako se dobiva postotak
se zbrajaju i njihov se zbroj dijeli sa 100 i tako se dobiva postotak izvrenja pojedinog procesa:
izvrenja pojedinog procesa:

1 2 3
100
Kada je dobiven iznos u postotcima pojedinog procesa

procesa, poveava se iznos trake napretka za
jednu
Dakle, ako postoje etiri procesa koji se izvravaju u pozadini,
30 vrijednost postotka. Dakle
svaki daje postotak od 25%. Pri izvrenju prvog procesa traka napretka je na 25%, pri
izvrenju drugog procesa traka se napretka uveava za jo 25% , tj. ukupno 50% i tako redom

Kada je dobiven iznos u postotcima pojedinog procesa, poveava se iznos trake napretka za
jednu vrijednost postotka. Dakle, ako postoje etiri procesa koji se izvravaju u pozadini, svaki
daje postotak od 25%. Pri izvrenju prvog procesa traka napretka je na 25%, pri izvrenju drugog
procesa traka se napretka uveava za jo 25% , tj. ukupno 50% i tako redom dok se ne doe do
100% napretka.
Slika 56. Traka napretka sa standardnom temom Android 4.0 sustava
b)
Aktivnost
Indikator aktivnosti obavjetava korisnika da se proces izvrava, ali ne i kada e zavriti. Obino
se koristi za procese za koje se ne zna kada e zavriti i kojima treba due vrijeme da se izvre.
Moe se pojaviti u dva standardna oblika: kao traka ili kao kruni indikator.
Slika 57. Traka aktivnosti sa standardnom temom Android 4.0 sustava
Kruni indikator ne dozvoljava pruanje dodatnih informacija korisniku i uvijek se prikazuje sam.
Trake indikatora doputaju takve tekstualne informacije.
Slika 58. Lijevo je prikazan neispravan, a desno ispravan nain prikazivanja krunog indikatora
c)
Unikatni indikatori napretka (engl. Custom progress indicators)
Elementi koji su opisani za prikaz napretka nekog procesa obino su dovoljni za svaku aplikaciju,
no ponekad se mora posezati za vlastitim rjeenjima. Unikatni indikatori mogu prikazivati tok
pojedinog procesa na razne naine. Za to se koriste razliite sliice i boje kako bi se korisniku dao
uvid u ono to se trenutno dogaa, to se dogodilo, a to nije. Slika 59. prikazuje jedan unikatni
indikator procesa koji koristi aplikacija Google Play. Plavi krug indicira stanje, tj. da se proces
izvrava, a bijela pribadaa informira korisnika to se dogodilo s datotekom koju je pokuao
spremiti na svoj mobilni telefon.
31
Slika 59. Unikatni indikator napretka
Ako standardni indikatori korisniku ne pruaju dovoljno informacija, uvijek se moe kreirati vlastiti indikator koji e nastojati to bolje uklopiti se u temu ili UI koji se koristi.
2.15.10. Prekidai (engl. Switches)

Prekidai korisniku pruaju mogunost izbora odreene funkcionalnosti. Postoje tri vrste prekidaa: checkbox, radio button i on/off prekidai.
a)
Checkbox
Checkbox se sastoji od okvira i kvaice, a korisniku prua mogunost izbora: hoe li omoguiti
ili onemoguiti vie opcija odjednom. Koritenje se checkboxa izbjegava ako je samo jedan izbor. Tada se prednost daje on/off prekidau. Checkbox ima dva stanja: unchecked ili neoznaeno
i checked ili oznaeno.
Slika 60 Prikaz checkboxa i izgled svih njegovih stanja
b)
Radio button
Radio button ili kruni gumb vrlo je slian checkboxu, a razlikuje se u radu s izbornikom. Kod
checkboxa je mogue odabrati vie ponuenih izbora, a kod radio buttona samo jedan izbor iz
ponuene liste. Od korisnika trai da odabere samo jednu opciju iz liste, a pri tome moe vidjeti
sve ponuene opcije. Ako nije bitno da korisnik vidi sve ponuene opcije, preporua se koritenje spinera jer zauzima manje mjesta.
Slika 61. Prikaz radio buttona i izgled svih njegovih stanja
32

c)
On/Off gumb
Ovaj gumb omoguuje promjenu stanja jedne funkcije. Stanja su: istinito (engl. True) ili neistinito (engl. False).
Slika 62. Prikaz on/off gumba i izgled svih njegovih stanja
ZADATAK 7
Gotove stilizirane elemente suelja iz zadatka 4 primijeni na jednom on/off gumbu u Eclipse razvojnom
okruenju putem XML layouta.
2.15.11. Dijalozi
Dijalozi su maleni prozori koji od korisnika oekuju donoenje odluka kako bi proces mogao
nastaviti s radom. Obino se sastoje od poruke s dva gumba, tj. da ili ne gumba, ali im sadraj
moe biti i kompleksniji, na primjer unos teksta ili postavka neke opcije.
Slika 63. Primjer dijaloga
Dijalog se sastoji od tri glavna podruja: naslova, sadraja dijaloga i gumba.

a)
Naslov
Naslov bi trebao u to kraem obliku prenijeti korisniku ono to se od njega trai. Primjerice, ako
je potrebno da korisnik promijeni kontrast zaslona, u naslovu e pisati kontrast zaslona. Treba
biti kratak, jednostavan i govoriti sam za sebe.
b)
Sadraj dijaloga
U sadraj se dijaloga postavljaju svi eljeni elementi teksta, spinera, ili seek bara. Sadraj dijaloga moe biti i prazan ako korisnik treba samo potvrditi neku radnju. U tom sluaju je dovoljno
napisati to se trai u naslovu.
33

c)
Gumbi
Gumbi predstavljaju zadnji dio dijaloga. Obino su prisutni gumbi koji oznaavaju potvrdan i
gumbi koji oznaavaju negativan odgovor i u skladu s njima se izvrava odreena operacija.
Slika 64. Nekoliko razliitih verzija dijaloga
2.15.12. Pickers
Picker prua mogunost izbora jedne vrijednosti iz cijelog kompleta. Odabir se vri uz pomo
strelica u smjeru gore/dolje, dodira ili unosa pomou tipkovnice. Picker je najbolje postaviti u
dijalog zbog njegove veliine.
Slika 65. Prikaz standardnog Pickera koji je smjeten u dijalogu
Android operacijski sustav prua specijalne pickere kao to je picker za odabir datuma i vremena. Takvi se pickeri nalaze u samom dijalogu, a omoguuju jednostavan i toan odabir datuma
ili vremena po postavkama vremenske zone telefona. Ovakvim je nainom pogreka kod unosa
svedena na minimum.
Slika 66. Prikaz specijalnog pickera: vrijeme i datum
34

2.16. Navigacija i widgeti
Navigacija Android aplikacija mijenjala se iz verzije u verziju jer su se uklanjale postojee pogreke. Prijanje su se verzije sustava oslanjale na fiziku tipku Back (nazad) kojom se vraala
aplikacija na prethodni sadraj. Pojavom novih tehnologija fizika se tipka rjee koristi za navigaciju. U alatnu se traku aplikacije sada dodaje tipka za povratak na prijanji sadraj. Ta tipka
obino predstavlja ikonu aplikacije sa strjelicom prema nazad. Strjelica je vidljiva samo ako je
korisnik napredovao naprijed kroz aplikaciju.
Slika 67. Back ili tipka za povratak na prijanji sadraj
Iako tipka za povratak, koja se nalazi u traci alata, slui za povratak na prijanji sadraj, prvenstveno je namijenjena za navigaciju unutar aplikacije. Fizika se tipka za povratak na ureaju
koristi samo za povratak na prethodni sadraj. Tipkom za povratak moe se i izii iz aplikacije, a
u nekim sluajevima moe posluiti kao navigacija na prijanju aplikaciju ako je ostala u funkciji
u pozadini sustava. Fizika tipka ureaja takoer sakriva ili odbacuje razne dijaloge i upozorenja
koji se prikazuju korisniku, uklanja obiljeeni tekst i skriva virtualnu tipkovnicu.
Slika 68. Primjer rada Back tipke kao dijela aplikacije i kao dijela ureaja
Ako aplikacija posjeduje widget, navigacija se na neki sadraj aplikacije moe izvravati i putem poetnog zaslona. Widget je maleno korisniko suelje koje se nalazi na poetnom ekranu
Android sustava, a korisniku omoguava brzi pregled pojedinog vanog sadraja i obavljanje
najosnovnijih funkcija. Widgeti uglavnom prikazuju informacije u kratkom obliku, a za izvravanje operacija koriste tipku koja otvara glavnu aplikaciju i nudi korisniku mogunost interakcije.
Te bi se tipke na widgetima mogle nazvati i preacima. Zahvaljujui widgetima nije potrebno
navigirati cijelom aplikacijom kako bi se dolo do odreene funkcije. Funkcija se od njih dobiva
automatski samo jednim dodirom.
35
Slika 69. Primjer navigacije kroz suelje widgeta
Navigacija se na odreeni sadraj aplikacije moe izvravati i putem notifikacija. Notifikacije

obavjetavaju korisnika da se neka funkcija izvrila, da je korisnik dobio novu poruku, da je propustio poziv itd. Pritiskom na notifikaciju korisniku se prikazuje glavna aplikacija s detaljnijim
pojanjenjem, tj. sadrajem notifikacije i tipka za dodatnu interakciju ili upravljanje sadrajem.
Primjer je ovakve navigacije Gmail. Korisniku dolazi notifikacija da je stigla nova elektronika pota. Pritiskom na notifikaciju otvara se prozor Gmail aplikacije s cijelom porukom koju je korisnik
primio. Ako korisnik ne eli odgovoriti na poruku, pritiskom fizike tipke Back na ureaju dolazi
na poetni zaslon Android operacijskog sustava, a pritiskom Back tipke u aplikaciji koja se nalazi
u alatnoj traci navigira unutar Gmail aplikacije i odlazi na prozor koji prikazuje svu elektroniku
potu.
ZADATAK 8
Dizajniraj jednostavnu, ali unikatnu navigaciju koja se temelji na smjernicama za navigaciju koje su
opisane u ovom poglavlju.
2.17. Geste i animacija

2.17.1. Geste
Pomou gesta korisnik moe manipulirati sadrajem koji mu je ponuen: moe obiljeavati
tekst, otvarati novi sadraj, poveavati slike itd. Ispod su prikazane sve geste koje su mogue u
Android operacijskom sustavu i koje se mogu koristiti u aplikacijama.
Dodir je gesta kojom korisnik pokree odreene funkcije pritiskom gumba ili ostalih
sadraja.
36

Dug dodir je gesta kojom korisnik, kao i kod kratkog dodira, pokree odreene
funkcije pritiskom gumba ili ostalih sadraja. Koristi se kada neki objekt (tipka,
polje za unos teksta itd.) ima vie funkcija. Tipian je primjer polje za unos teksta.
Kratkim se dodirom otvara virtualna tipkovnica, a dugim se dodirom (u trajanju od
jedne do dvije sekunde) prikazuju funkcije za kopiranje ili lijepljenje teksta.
Pomak (engl. Swipe) je gesta brzog pomicanja prsta lijevo ili desno po ekranu. Efekt
je slian listanju stranica. Ovakva je gesta postala uobiajena na Android operativnom sustavu koji ima verziju veu od 3.0, a koristi se za navigaciju kroz sadraj.
Povlaenje (engl. Drag) je gesta koja se koristi za pomicanje odreenih objekata

po zaslonu. Nalazi se u raznim igricama i jedna je od osnovnih funkcija poetnog
zaslona (premjetanje ikona i widgeta).
Dupli dodir (engl. Double touch) se koristi kod centriranja i brzog pribliavanja slika
ili mapa. Moe se koristiti i na gumbima i ostalim dijelovima suelja.
Rairivanje prstiju (engl. Pinch open) je gesta koja se koristi kod pribliavanja (engl.
zoom in) sadraja (dokumenata, slika i mapa). Ne preporua se koritenje u druge
svrhe.
37

Spajanje prstiju (engl. Pinch close) je gesta koja se koristi kod udaljavanja (engl.
zoom out) sadraja (dokumenata, slika i mapa). Ne preporua se koritenje u druge svrhe.
2.17.2. Animacija
Animacija je standard koji je prisutan u gotovo svim elementima Android operacijskog sustava i
njegovim aplikacijama. Animacije korisniku pruaju vizualnu informaciju o onome to se dogaa
ili se dogodilo. Aplikaciji daju profesionalni izgled i kvalitetu. S koritenjem animacija ipak treba
pripaziti. Ne smije ih biti previe niti smiju usporavati rad aplikacije. Ako ih ima previe, rad s
aplikacijom bi se oduio, a to bi moglo dovesti do nezadovoljstva korisnika.
2.18. Skalabilni dizajn

Skalabilni je dizajn dizajn koji se prilagoava veliini zaslona mobilnog ureaja. Budui da se
Android mobilni ureaji pojavljuju u velikom broju razliitih dimenzija zaslona, dizajniranje je
UI-a veoma teko. Kao to je ve reeno, uz razliite se veliine zaslona vezuju i razliite gustoe
piksela na zaslonima. Prema tome, crtanje jednog gumba s odreenim dimenzijama jednostavno nije mogue jer takav gumb ne bi bio istih dimenzija na razliitim ureajima. Zbog razliitih
bi gustoa piksela i razliitih dimenzija zaslona takav gumb bio distorziran i vrlo loe kvalitete
(Slika 70.).
Slika 70. Primjer distorzije na gumbu s unikatnom grafikom
Android razvojno okruenje nudi jednostavno rjeenje ovog problema. U razvoju aplikacije
stvorene su etiri mape: ldpi, mdpi, hdpi i xhdpi u koje se smjetaju sliice za razliite gustoe
zaslona. Na taj nain ureaj trai i prepoznaje sliicu koja mu najbolje odgovara i koja e se najpravilnije prikazivati na korisnikovom zaslonu (Slika 71.). Ova varijanta ima najvei uinak kod
otrine i boja grafike.
Slika 71. Izgled datoteka za razliite gustoe zaslona
38

Ovakav se nain ne moe primijeniti na gumb i njegovu pozadinu koja je prilagoena (engl. custom) grafika jer tone dimenzije sliice nisu prihvatljive. Tada u obzir dolaze skalabilne grafike
koje razvlaenjem ne gube na kvaliteti, a koje posjeduju prijelomne toke koje omoguavaju da
se pojedini elementi grafike razvlae, a pojedini ne razvlae. Ovo je mogue koritenjem .9.png
formata.
*.9png format je jedinstven grafiki format, a do njega se dolazi pomou aplikacije koja dolazi s
Eclipse razvojnim sustavom (..\sdk\tools\draw9patch.bat) (Slika 72.).
Slika 72. Izgled poetnog zaslona aplikacije za izradu 9.png grafika
Otvaranjem aplikacije za izradu .9.png grafike otvara se prozor (Slika 73.) koji trai unos slike od
koje se grafika .9.png eli kreirati. Nakon to je slika ubaena u program, automatski se generira
prikaz izgleda grafika za odreeni element ako na nju nisu primijenjena pravila kontroliranog
rastezanja ili ako .9.png grafika nije izraena (Slika 73. desno). Na lijevoj se strani aplikacije
nalazi prostor za ureivanje, tj. prostor za dodavanje toaka irenja.
Slika 73. Izgled zaslona aplikacije za izradu 9.png grafika nakon dodavanja grafike
U prostoru za ureivanje, tj. dodavanje toaka irenja nalazi se grafika. Toke koje se zadaju
odreuju granice, tj. mjesta gdje se slika smije rairivati, a gdje ne. Postoji etiri razliita prostora na kojima se toke mogu dodavati. Svaki se od njih nalazi na jednoj strani slike. Na slici 74.
vidljivo je da se crvene strjelice nalaze gore i lijevo od slike. Ove dvije strane slue za postavljanje toaka koje odreuju granice do kojih se slika smije iriti. Dodavanjem toke na gornju i
lijevu stranu uz sam rub slike pojavljuje se zeleni marker koji pomae u uoavanju zadane toke.
39
Slika 74. Dodavanje toaka koje kontroliraju irenje slike
Ako se krene od gornje toke, sve to se nalazi lijevo i desno od zelene linije nee se rairivati, a
toka e se, tj. prostor unutar zelene linije, iriti horizontalno. Isto vrijedi i za toku koja se nalazi
na lijevoj strani slike. Sav se prostor od zelene linije prema gore i prostor ispod zelene linije nee
iriti, a prostor e se unutar zelene linije iriti vertikalno. Ovakvim se nainom ne gubi kvaliteta
slike i ne dolazi do distorzije rubova koji su na navedenom primjeru kompliciranog oblika. Na
desnoj je strani aplikacije za kreiranje .9.png grafike (Slika 74.) vidljiv rezultat: kako bi slika izgledala da se rairi vertikalno, a kako da se rairi horizontalno. Kao to se vidi, sve ostaje na svome
mjestu bez distorzije, a na desnoj je strani aplikacije u pregledu prikazan plavi prostor koji je
oznaen na razliitim dimenzijama slike. Taj plavi prostor oznaava podruje do kojeg e biti
smjeten sadraj koji e se nalaziti unutar slike, tj. pozadine nekog elementa suelja (npr. tekst
gumba). Prostor se odreuje istom metodom kao i dodavanje toaka za ograniavanje irenja
odreenih dijelova slike. Na slici 74. te su toke oznaene plavim strjelicama. Slike formata
.9.png mogu biti i bez oznaenog prostora za sadraj. Ako je rije o gumbu, aplikacija e postaviti
tekst u centar slike, tj. pozadine.
Napomena: Ako se oznaava prostor za sadraj, postavljanje margina ili paddinga na gumb ili
neki drugi element u svrhu centriranja sadraja nee imati nikakvog efekta.
Grafika formata .9.png nezaobilazan je dio svakog suelja i postavlja se u direktorije za razliite
gustoe piksela na isti nain kao i klasina grafika. Pruaju otrinu i istou zavrnog proizvoda
bez obzira na veliinu i orijentaciju mobilnog ureaja, automatski se ire i prilagoavaju zaslonu.
ZADATAK 9
Dizajniraj pet razliitih izgleda gumba i pretvori ih u *.9.png format, a da pri tome niti jedan gumb ne
izgubi na kvaliteti.
2.19. Layout aplikacije

Layout je osnova svake aplikacije, a definira strukturu korisnikog suelja. Postoje dva naina
deklariranja layouta: XML dokumentom i direktno (za vrijeme prirodnog rada aplikacije). Ispod
je prikazan XML nain deklariranja layouta. XML nain definiranja layouta vrlo je slian definira-
40
Ispod je prikazan XML nain deklariranja layouta. XML nain definiranja layouta vrlo je slian
Ispod je prikazan XML nain deklariranja layouta. XML nain definiranja layouta vrlo je slian
definiranju
elemenata
u izradi
internetskih
stranica.
Ako se
dobro poznaje
naziv
KORISNIKOG
SUELJA
Ispod
je prikazan
XML nain
deklariranja
layouta.
XML DIZAJN
nain
definiranja
layouta
vrlo jesvakog
slian
definiranju
elemenata
u izradi
internetskih
stranica.
Ako se
dobro poznaje
naziv
svakog
objekta
suelja,
mogue
je
vrlo
brzo
napisati
vlastiti
layout.
Eclipse
razvojno
okruenje
Ispod
je
prikazan
XML
nain
deklariranja
layouta.
XML
nain
definiranja
layouta
vrlo
je
slian
definiranju
elemenata
u je
izradi
stranica.
se dobro
poznaje
naziv
svakog
objekta
suelja,
mogue
vrlointernetskih
brzo napisati
vlastitiAko
layout.
Eclipse
razvojno
okruenje
sadri
grafiki
editor
za
kreiranje
layouta
to
jo
vie
ubrzava
rad,
a
ujedno
omoguuje
prikaz
definiranju
elemenata
u je
izradi
stranica.
Ako
se
dobro
poznaje
naziv
svakog
objekta
suelja,
mogue
vrlointernetskih
brzo napisati
vlastiti
layout.
Eclipse
razvojno
okruenje
sadri grafiki
editor
za kreiranje
layouta
to jo
vie
ubrzava
rad,
a ujedno
omoguuje
prikaz
nju
elemenata
u
izradi
internetskih
stranica.
Ako
se
dobro
poznaje
naziv
svakog
objekta
suelja,
rezultata
u
realnom
vremenu.
Bit
e
prikazan
izgled
vrlo
jednostavnog
layouta
koji
posjeduje
objekta
suelja,
mogue
je
vrlo
brzo
napisati
vlastiti
layout.
Eclipse
razvojno
okruenje
sadri
grafiki
editor
za
kreiranje
layouta
to
jo
vie
ubrzava
rad,
a
ujedno
omoguuje
prikaz
rezultata
realnom
vremenu.
Bit layout.
e prikazan
izgled
vrlookruenje
jednostavnog
layouta
koji posjeduje
mogue
je u
vrlo
brzo
napisati
vlastiti
Eclipse
razvojno
sadri
grafiki
editor
za
TextView,
a
koji
je
zapravo
naljepnica
s
nekim
tekstom
i
gumbom.
Ovi
se
elementi
nalaze
u
sadri
grafiki
editor
za
kreiranje
layouta
to
jo
vie
ubrzava
rad,
a
ujedno
omoguuje
prikaz
rezultata uarealnom
vremenu.
Bit e prikazan
izgled
vrlo jednostavnog
koji posjeduje
TextView,
koji to
je zapravo
naljepnica
s nekim
tekstom
iprikaz
gumbom.
Ovilayouta
elementi
nalaze
u
kreiranje
layouta
jo vie
ubrzava
rad,
apojanjen
ujedno
omoguuje
rezultata
userealnom
vreLinearLayoutu
(kasnije
e
detaljno
biti
svaki
tip
layouta).
rezultata
u
realnom
vremenu.
Bit
e
prikazan
izgled
vrlo
jednostavnog
layouta
koji
posjeduje
TextView,
a
koji
je
zapravo
naljepnica
s
nekim
tekstom
i
gumbom.
Ovi
se
elementi
nalaze
u
LinearLayoutu
(kasnije
e vrlo
detaljno
biti pojanjen
tip layouta).
menu.
Bit e prikazan
izgled
jednostavnog
layoutasvaki
koji posjeduje
TextView, a koji je zapravo
TextView, a skoji
je zapravo
naljepnica
s nekim
tekstom
gumbom.
Ovi se elementi
nalaze u
LinearLayoutu
(kasnije
e detaljno
biti pojanjen
svaki nalaze
tip ilayouta).
naljepnica
nekim
tekstom
i gumbom.
Ovi
se elementi
u LinearLayoutu
(kasnije e
<?xml version="1.0"
encoding="utf-8"?>
LinearLayoutu
(kasnije
e
detaljno
biti
pojanjen
svaki
tip
layouta).
<?xml
version="1.0"
encoding="utf-8"?>
detaljno biti pojanjen svaki tip layouta).
<LinearLayoutxmlns:android="http://schemas.android.com/apk/res/android"
<?xml
version="1.0" encoding="utf-8"?>
android:layout_width="fill_parent"
<?xml
version="1.0"
encoding="utf-8"?>
android:layout_height="fill_parent"
android:orientation="vertical">
<TextViewandroid:id="@+id/text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Hello,
I am a TextView"/>
I am a TextView"/>
<Buttonandroid:id="@+id/button"
I am a TextView"/>
I am a TextView"/>
I am a Button"/>
android:text="Hello, I am a Button"/>
</LinearLayout>
I am a Button"/>
</LinearLayout>
</LinearLayout>
Da
bi se tekst (naljepnica) definirao, prvo se navodi ime objekta koji se eli postaviti na
</LinearLayout>
Da
bi se tekst (naljepnica) definirao, prvo se navodi ime objekta koji se eli postaviti na
layout,
je TextView.
Imedefinirao,
objekta seprvo
navodi
dodavanjem
XML vora
/>. Unutar
Da bi sea to
tekst
(naljepnica)
se navodi
ime objekta
koji<textview
se eli postaviti
na
layout,
atekst
to je
TextView.definirao,
Ime objekta
navodiime
dodavanjem
XML
vora
<textview
/>. Unutar
Da
bibise
(naljepnica)
prvo se
seprvo
navodi
objekta
se eli
postaviti
na
layout,
toga
vora
naveden
je ID Ime
(identifikacija)
naljepnice,
irina
i koji
visina
naljepnice
i eli
eljeni
tekst
koji
Da
se
tekst
(naljepnica)
definirao,
se
navodi
ime
objekta
koji
se
postaviti
na
layout,
a
to
je
TextView.
objekta
se
navodi
dodavanjem
XML
vora
<textview
/>.
Unutar
vora
naveden
je ID (identifikacija)
naljepnice,
irina
i visina naljepnice
i toga
eljeni
tekst
koji
atoga
to
je
TextView.
Ime
objekta
se
navodi
dodavanjem
XML
vora
<textview
/>.
Unutar
vora
e
se
prikazivati.
ID
naljepnica
mora
biti
unikatna,
tj.
ne
mogu
postojati
dva
ili
vie
elemenata
layout,
a tonaveden
je TextView.
objekta
se naljepnice,
navodi dodavanjem
XML
voradva
<textview
/>.
Unutar
toga
je ID Ime
(identifikacija)
i ivisina
naljepnice
i se
eljeni
tekst
koji
e sevora
prikazivati.
ID naljepnica
mora biti
unikatna,
tj.irina
ne mogu
postojati
vie
elemenata
naveden
je ID (identifikacija)
naljepnice,
irina
i visina naljepnice
eljeni
tekst
koji eili
prikaziseistim
ID-om.
ID
slui
za
identifikaciju
pojedinog
objekta
kroz
kod
aplikacije.
toga
vora
naveden
je
ID
(identifikacija)
naljepnice,
irina
i
visina
naljepnice
i
eljeni
tekst
koji
seIDprikazivati.
ID naljepnica
mora
unikatna,
tj. ne
postojati
dva
ili vie
elemenata
s istim
ID-om. IDmora
slui
za identifikaciju
objekta
kroz
kod
aplikacije.
vati.
naljepnica
biti
unikatna,
tj. biti
nepojedinog
mogu
postojati
dvamogu
ili vie
elemenata
s istim
ID-om.
se prikazivati.
ID naljepnica
mora
biti
unikatna,
tj. ne mogu
postojati
dva ili vie elemenata
seistim
ID-om.
ID slui
za identifikaciju
pojedinog
objekta
kroz kod
aplikacije.
ID
slui
za
identifikaciju
pojedinog
objekta
kroz
kod aplikacije.
s<TextViewandroid:id="@+id/text"
istim ID-om. ID slui za identifikaciju pojedinog objekta kroz kod aplikacije.
I am a TextView"/>
I am a TextView"/>
I am a TextView"/>
Za gumb
vrijedi isti postupak.
Prvo
se dodaje XML vor <button /> unutar kojega su navedeni
I amPrvo
a TextView"/>
Za gumb
vrijedi isti postupak.
se dodaje XML vor <button /> unutar kojega su navedeni
osnovni
parametri
kao
to
su:
ID,
visina,
irina
tekst
koji
e/>seunutar
prikazivati
Za
gumb
vrijedi
isti
postupak.
Prvo
se
dodaje
XML ivor
<button
kojegana
sugumbu.
navedeni
Za
gumb
vrijedi
isti
postupak.
Prvo
se dodaje
vor
<button
/> unutar
kojega
su navedeni
osnovni parametri kao to su: ID, visina,
irinaXML
i tekst
koji
e se prikazivati
na
gumbu.
osnovni
parametri
kao
to
su:
ID,
visina,
irina
i
tekst
koji
e
se
prikazivati
na
gumbu.
Za gumbparametri
vrijedi istikao
postupak.
se dodaje
vor
<button
/> unutar na
kojega
su navedeni
osnovni
to su: Prvo
ID, visina,
irinaXML
i tekst
koji
e se prikazivati
gumbu.
osnovni
parametri
kao
to
su:
ID,
visina,
irina
i
tekst
koji
e
se
prikazivati
na
gumbu.
I am a Button"/>
I am a Button"/>
Ako seandroid:text="Hello,
bolje pogleda prijanji
kod, moe se uoiti da se spominju dvije stavke za irinu i
I am
a Button"/>
Akosesebolje
bolje
pogleda
prijanji
kod, moe
sedauoiti
da se spominju
stavke
za irinu i
Ako
pogleda
prijanji
kod,
moe
se uoiti
se spominju
dvije stavkedvije
za irinu
i visinu,
visinu,
abolje
one su
opisaneprijanji
nekom kod,
varijablom.
Ako
se
pogleda
moe
se
uoiti
da
se
spominju
dvije
stavke
za irinu i
avisinu,
one suaopisane
varijablom.
one su nekom
opisane
nekom varijablom.
Ako
seabolje
pogleda
moe se uoiti da se spominju dvije stavke za irinu i
visinu,
one su
opisaneprijanji
nekom kod,
varijablom.
visinu, a one su opisane nekom varijablom.
irina
i visina su u ovom sluaju opisane varijablom koja odreuje do koje e se pozicije i do
irina
i visina su u ovom sluaju opisane varijablom koja odreuje do koje e se pozicije i do
koje
mjere
pojedini
element
rairiti.
irina
i visina
su u ovom
sluaju
opisane varijablom koja odreuje do koje e se pozicije
i do
41
koje mjere
pojedini
element
rairiti.
irina
i
visina
su
u
ovom
sluaju
opisane
varijablom
koja
odreuje
do
koje
e
se
pozicije
i do
koje mjere pojedini element rairiti.
DIZAJNandroid:layout_height="wrap_content"
KORISNIKOG SUELJA
Ako se bolje pogleda prijanji kod, moe se uoiti da se spominju dvije stavke za irinu i
irina i visina su u ovom sluaju opisane varijablom koja odreuje do koje e se pozicije i do koje
visinu, a one su opisane nekom varijablom.
mjere pojedini element rairiti.
"wrap_content"
"wrap_content"
wrap_content varijabla govori elementu da bude irok ili visok kao i sadraj koji se nalazi u
wrap_content
govori
elementu
da bude
irok ili visok
i sadrajdokoji
se nalazi
nje- i do
irina i visinavarijabla
su u ovom
sluaju
opisane
varijablom
koja kao
odreuje
koje
e se upozicije
njemu.
mu.
"fill_parent"
"fill_parent"
fill_parent
govori
elementu
da bude
irok iliirok
visokilikao
i glavni
u kojem
fill_parentvarijabla
varijabla
layoutseuelekojem se
la
govori
elementu
da bude
visok
kao layout
i glavni
ment
nalazi.
element nalazi.
irina i visina objekta ne moraju biti zadani ovim varijablama, ve se mogu koristiti i standardne
irina i visina
objekta
ne mora
zadani ovim varijablama, ve se mogu
moraju
mog koristiti i
numerike
vrijednosti
uz mjernu
jedinicubiti
DP.
standardne numerike vrijednosti uz mjernu jedinicu DP.
U svijetu Android aplikacija postoje dva najpopularnija layouta: Linear layout i Relative layout.
a)
Linear
layout aplikacija postoje dva najpopularnija layouta: Linear layout i Relative
U svijetu
Android
layout.layout je veinom osnova svake aplikacije, a dijeli se na horizontalni i vertikalni. Kod horiLinear
zontalnog su layouta svi elementi smjeteni jedan pored drugog. Ukoliko prelaze irinu zaslona,
automatski
Linear layout
sustav
dodaje pominu traku kako bi se s lakoom moglo doi do onih elemenata
koji se ne vide. Kod vertikalnog su layouta svi elementi smjeteni jedan ispod drugog. Ukoliko
Linear visinu
layoutzaslona,
je veinom
a traku
dijeli za
sepristup
na horizontalni
svake
aplikacije,
ntalni i koji
vertikalni.
prelaze
sustavosnova
automatski
dodaje
pominu
elementima
nisu Kod
horizontalnog su layouta svi elementi smjeteni jedan
edan pored drugog. Ukoliko prelaze irinu
vidljivi.
zaslona, sustav
ustav automatski dodaje pominu traku kako bi sse
e s lakoom moglo doi do onih
elemenata koji se ne vide. Kod vertikalnog su layouta svi elementi smjeteni jedan ispod
drugog. Ukoliko prelaze visinu zaslona
zaslona, sustav automatski dodaje pominu traku za pristup
elementima koji nisu vidljivi.
Slika 75. Raspored elemenata u horizontalnom layoutu
Relative Layout
b)
Relative layout predstavlja raspored elemenata jedan nasuprot drugome. Primjerice, mogue
je imati gumb A i gumb B

i mogue
je narediti gumbu A da bude pored, ispod ili iznad gumba B.
Relative Layout
Relative layout predstavlja raspored elemenata jedan nasuprot drugome. Primjerice,
mogue je imati gumb A i gumb B i mogue je narediti gumbu A da bude pored,
pored ispod ili
iznad gumba B.
42
Slika 76. Raspored elemenata u Relative layoutu
ZADATAK 10
Kreiraj jedan Linear layout i u njega smjesti <TextView /> i dva <button /> te na svaki element primijeni
unikatan izgled pomou *.9.png grafika.
ZADATAK 11
Kreiraj jedan Relative layout i u njega smjesti dva <TextView /> i etiri <button /> te na svaki element
primijeni unikatan izgled pomou *.9.png grafika.
43
44
Programiranje
45
OSNOVE PROGRAMIRANJA
3. OSNOVE PROGRAMIRANJA
3.1. Uvod u programski jezik Java
Java je programski jezik koji je osmislio James Gosling iz Sun Microsystems 1991. godine,
a prva se verzija u javnosti pojavila 1995. godine. Razlikuje se od ostalih programskih
jezika jer se kod izvrava u Java virtualnom stroju (engl. Java Virtual Machine, JVM). JVM
se razvija posebno za svaku platformu. Dakle, jedna je implementacija JVM za Linux, a
druga za Windows operacijski sustav. Java je kao programski jezik neovisna o platformi
na kojoj se izvodi jer se uvijek izvodi na svom JVM. Java prevoditelji (engl. compiler)
prevode Javu u tzv. bytecode koji interpretira JVM i izvrava Java program. Java se javlja
u dva paketa: Java Runtime Environment (JRE) i Java Development Kit (JDK). JRE sadri
JVM, biblioteke Java klasa i potrebnu funkcionalnost za pokretanje Java programa. JDK
sadri sve sastavnice kao i JRE, ali i razvojne alate za razvoj Java programa. Dakle, za
pokretanje je Java programa dovoljno instalirati JRE paket, a za razvoj Java programa
JDK paket. Java je pisana s namjerom da se programski kod napie samo jednom, a
program se izvrava na vie razliitih operacijskih sustava. Kao to je ve spomenuto,
Java se programi izvravaju na JVM. Zbog toga Java ne mora pristupati direktno operacijskom sustavu, tj. neovisna je o operacijskom sustavu na kojem se izvrava. Programsko
rjeenje koje je napisano jednom moe se bez ikakvih izmjena odvijati na Linuxu, Windowsima i sl.
Java je objektno orijentiran programski jezik (engl. ObjectOriented Programming language: OOP) to znai da se kod predstavlja kao stvarni objekt u svijetu. Svi su elementi
u Javi objekti, a izuzetak su primitivni tipovi (int, long, float, boolean itd.). Java je vrlo
striktan programski jezik. Svaki tip varijable mora biti predefiniran, tj. varijabli se ne
moe dodijeliti tip koji nije prethodno definiran, koji nema pripadajuu klasu. Java ima
automatski menadment memorije to znai da programer ne mora voditi brigu o alokaciji i dealokaciji memorije za kreiranje novih objekata. Program nema direktni pristup
memoriji. Automatsko je skupljanje smea (engl. Garbage Collector) implementacija
automatskog menadmenta memorije, a vodi brigu o oslobaanju memorije kada instancirani objekti nemaju aktivne pokazivae na memoriju.
3.2. Varijable, operatori [6]
Java programski jezik razlikuje sljedee vrste varijabli:
a)
Varijable objekata (instanci) se definiraju izvan svih metoda i izvan konstruktora klase.
Sve one varijable koje ispred sebe nemaju kljunu rije static jesu varijable objekta. Izmjenom
se tih varijabli mijenja stanje objekta koji se kreira u programskom kodu pomou kljune rijei
new.
Automobil automobil = new Automobil();
Svaki put kada se kreira novi objekt, kompajler kreira i kopiju svih varijabli koje ispred sebe nemaju kljunu rije static. Dakle, svaki objekt sadrava svoj skup nestatinih varijabli.
46
b)
Varijable klasa su sve varijable koje ispred sebe sadravaju kljunu rije static. Za kompajler to znai da postoji samo jedna kopija te varijable neovisno o tome koliko se objekata iz te
klase stvorilo. U primjeru automobil statina bi varijabla mogla biti:
static brojKotaca = 4;
Ta vrijednost vrijedi za sve automobile i stoga se ne bi trebala mijenjati za niti jedan automobil.
c)
Lokalne varijable su varijable koje se nalaze u metodama objekata. Te su varijable uglavc)
varijable
varijable
koje
metodama
objekata.
Te
uglavnom
nom pomone
i koriste
se su
prilikom
sl. Ne postoji
posebna
kljuna
rije kojom
c) Lokalne
Lokalne
varijable
su
varijableizraunavanja
koje se
se nalaze
nalaze u
u ili
metodama
objekata.
Te su
su varijable
varijable
uglavnom
pomone
i
koriste
se
prilikom
izraunavanja
ili
sl.
Ne
postoji
posebna
kljuna
rije
se
i koristelokalna,
se prilikom
izraunavanja
ili sl.izNelokacije
postoji posebna
kljuna
rije kojom
kojom
se
se oznaavapomone
je li varijabla
nego
se zakljuuje
u kojoj je
varijabla
deklarirana,
oznaava
je
li
varijabla
lokalna,
nego
se
zakljuuje
iz
lokacije
u
kojoj
je
varijabla
deklarirana,
oznaava
je
li
varijabla
lokalna,
nego
se
zakljuuje
iz
lokacije
u
kojoj
je
varijabla
deklarirana,
tj. izmeu vitiastih
zagrada koje
oznaavaju
metodu. Lokalne
su varijable
vidljive samo
metodi
tj.
tj. izmeu
izmeu vitiastih
vitiastih zagrada
zagrada koje
koje oznaavaju
oznaavaju metodu.
metodu. Lokalne
Lokalne su
su varijable
varijable vidljive
vidljive samo
samo
koja ju sadrava,
ali
ne
i
ostatku
klase.
metodi
koja
ju
sadrava,
ali
ne
i
ostatku
klase.
metodi koja ju sadrava, ali ne i ostatku klase.
d)
Parametri
su varijable
koje se
se koristeu deklaraciji
u deklaraciji metode.
Metodazahtijevati
moe zahtijevati
d)
d) Parametri
Parametri su
su varijable
varijable koje
koje se koriste
koriste u deklaraciji metode.
metode. Metoda
Metoda moe
moe zahtijevati neki
neki odreeni
parametar
kao
ulaz
tako
da
obradom
ulaznog
parametra,
moe
kreiratineki
izlaznu
odreeni
odreeni parametar
parametar kao
kao ulaz
ulaz tako
tako da
da obradom
obradom ulaznog
ulaznog parametra,
parametra, moe
moe kreirati
kreirati izlaznu
izlaznu
vrijednost. vrijednost.
vrijednost.
private
int int
zbrajanje
(int
a,a,int
b){
private
zbrajanje
int
private int
zbrajanje (int
(int a,
int b){
b){
c
=
a
+
b;
int int
c
=
a
+
b;
int c = a + b;
return
return
c; c;
return
c;
}
}
}
Primjer
Primjer 1.2.1.Parametri
1.2.1.Parametri metode
metode
Primjer 1. Parametri metode
Metoda
zbrajanje
sadri
dva
parametra
tipa
int.
Varijabla
cc je
varijabla.
U
Metoda
zbrajanje
sadri
kojisu
tipa
Varijabla
c je lokalna
varijabla.
Metoda
zbrajanje
sadridva
dvaparametra
parametra a
aaii ib
bbkoji
koji
susu
tipa
int.int.
Varijabla
je lokalna
lokalna
varijabla.
U Javi
Javi se
seU Javi
razlikuju
sljedee
vrste
operatora:
razlikujusljedee
sljedee vrste
se razlikuju
vrsteoperatora:
operatora:
e)
operatori
[2]
e)
Aritmetiki
operatori
e) Aritmetiki
Aritmetiki
operatori [2]
[2]
Pretpostavimo
10,
Pretpostavimo
sljedee: sljedee:
a = 10, baa ===20.
Pretpostavimo
sljedee:
10, b
b =20.
=20.
Operator
Operator
++
-**
//
%
%
++
++
---
Opis
Opis
Zbrajanje
Zbrajanje
Oduzimanje
Oduzimanje
Mnoenje
Mnoenje
Dijeljenje
Dijeljenje
Modul
Modul vraa
vraa ostatak
ostatak cjelobrojnog
cjelobrojnog dijeljenja
dijeljenja
Increment
poveava
vrijednost
Increment poveava vrijednost za
za 1
1
Decrement
Decrement smanjuje
smanjuje vrijednost
vrijednost za
za 1
1
Tablica
Tablica 1.2.1.
1.2.1. Aritmetiki
Aritmetiki operatori
operatori
f)
f) Relacijski
Relacijski operatori
operatori
Primjer
Primjer
aa ++ b
=
b = 30
30
aa b
b == -10
-10
aa ** b
b == 200
200
b
/
a
b / a == 2
2
b
b%
% aa == 0
0
a++
a++ == 11
11
a-a-- == 9
9
Tablica 1. Aritmetiki operatori
f)
Pretpostavimo
sljedee: a
= 10, b
= 20.
Pretpostavimo
Pretpostavimo
sljedee: sljedee:
a = 10, ba == 10,
20.b = 20.
Operator
Operator
==
==
!=
!=
>>
<<
>=
>=
<=
<=
Opis
Opis
Provjerava
da
li
su
2
vrijednosti
Provjerava da li su 2 vrijednosti jednake
jednake
Provjerava
Provjerava da
da lili su
su 2
2 vrijednosti
vrijednosti razliite
razliite
Provjerava
Provjerava da
da lili je
je lijevi
lijevi operand
operand vei
vei od
od desnog
desnog
Provjerava
da
li
je
lijevi
operand
manji
Provjerava da li je lijevi operand manji od
od desnog
desnog
Provjerava
Provjerava da
da lili je
je lijevi
lijevi operand
operand vei
vei ili
ili jednak
jednak desnom
desnom
Provjerava
Provjerava da
da lili je
je lijevi
lijevi operand
operand manji
manji ili
ili jednak
jednak desnom
desnom
Tablica
Tablica 1.2.2.
1.2.2. Relacijski
operatori
g)
g) Logiki
Logiki operatori
operatori
Primjer
Primjer
aa ==
b
== b false
false
aa !=
!= b
b true
true
aa >> b
b false
false
aa << b
b true
true
aa >=
>= b
b false
false
aa <=
<= b
b true
true
Tablica 2. Relacijski operatori
Pretpostavimo
Pretpostavimo sljedee
sljedee a
a == true,
true, b
b == false.
false.
47
g)
Logiki operatori
Pretpostavimo sljedee a = true, b = false.

Operator
&&
||
!
Opis
Logiki AND operator. Ako oba operanda
vraaju true onda je rezultat true
Logiki OR operator. Ako bar jedan
operand vraa vrijednost true onda je
rezultat true
Logiki NOT operand. Slui za
dodjeljivanje suprotne vrijednosti
operandu.
Tablica 1.2.3. Logiki operatori
Primjer
a && b false
a || b true
!a false
!b true
Tablica 3. Logiki operatori
Izvoenje programa tee od smjera gore prema dolje, tj. redoslijedom kako je kod napisan. Taj se niz
Izvoenje
programa
tee
odprekinuti
smjera primjenom
gore prema
dolje, tj.
redoslijedom
kako je kod
napisan. Taj
izvoenja
programa
moe
odreenih
kontrola
toka: if naredbama,
for petljama,
se nizgrananjem,
izvoenjaizvoenjem
programadijela
moe
prekinuti
primjenom
odreenih
kontrola
toka:
if
naredbama,
koda ovisno o odreenom stanju i sl.
for petljama, grananjem, izvoenjem dijela koda ovisno o odreenom stanju i sl.
Zadatak 1.2.1
ZADATAK
12

Unesi realni broj i pohrani unesenu vrijednost u varijablu. Ispii poruku na ekran ovisno o tome je li
broj negativan, 0 ili pozitivan.
3.3. Kontrola toka programa [8]

1.3.
Kontrola toka programa [3]
3.3.1. Grananja
1.3.1. Grananja
Java
razlikuje
sljedee
vrstegrananja
grananja koje
koriste
ovisno
o situaciji:
Java razlikuje
sljedee
vrste
kojesese
koriste
ovisno
o situaciji:
a) If-then
kontrolaje
je najosnovnija
najosnovnija kontrola
toka programa.
Govori programu
izvri odreeni
a)
If-then
kontrola
kontrola
toka programa.
Govori da
programu
da izvri
dio koda ovisno o tome je li odreeni uvjetni izraz istinit. Npr. automobil bi mogao koiti
odreeni diosamo
koda
ovisno o tome je li odreeni uvjetni izraz istinit. Npr. automobil bi mogao
ako je ve u pokretu. Jedna je od moguih implementacija ovog algoritma:
koiti samo ako je ve u pokretu. Jedna je od moguih implementacija ovog algoritma:
private void koci (){
private void
koci (){
if(jeUPokretu){
if(jeUPokretu){
brzina--;
} brzina--;
} }
}
Primjer 1.3.1. If-then naredba
Primjer
If-then
naredba
Ako varijabla jeUPokretu ima vrijednost
false,2.brzina
se nee
smanjivati to znai da i sam automobil
stoji.
Ako
postoji
samo
jedan
redak
koda,
ova
se
if-then
naredba
moe
napisati i bez
varijabla jeUPokretu ima vrijednost false, brzina se nee
smanjivati
tovitiastih
znai da i sam
zagrada. Dakle:
Ako
automobil stoji. Ako postoji samo jedan redak koda, ova se if-then naredba moe napisati i bez
private
void Dakle:
koci (){
vitiastih
zagrada.
if(jeUPokretu)
private void kocibrzina--;

(){
} if(jeUPokretu)
brzina--;
Primjer 1.3.2. If-then naredba u jednom retku
}
Primjer 3. If-then naredba u jednom retku
b) If-then-else kontrola omoguuje izvravanje drugih dijelova koda u sluaju da je if izraz false.
If-then-else
kontrola
omoguuje
izvravanje
drugih
u sluaju da je if izraz
Npr. ako je
automobil
u stanju mirovanja,
moe se
izvritidijelova
neki drugikoda
dio koda.
b)
false. Npr. ako je automobil u stanju mirovanja, moe se izvriti neki drugi dio koda.
48
private void koci (){

if(jeUPokretu){
brzina--;
} else {
System.out.println(Automobil je u stanju mirovanja);
}
}
Primjer 4. If-then-else naredba
If-then-else naredbom mogu se raditi i viestruke provjere nekog uvjeta. To se moe vidjeti na
primjeru rezultata testa i dodijeljene ocjene.
private int izraunajOcjenu(int brojBodova){
int ocjena = 1;
if(brojBodova >= 90){
ocjena = 5;
} else if(brojBodova >= 80){
ocjena = 4;
ocjena = 3;
ocjena = 2;
}
return ocjena;
}
Primjer 5. If-the-else grananje
Primjer 5. pokazuje da ako uenik ima rezultat vei od 90, svi su izrazi ispunjeni. Meutim, naredba radi tako da im se jedan uvjet zadovolji, ostali se uvjeti zanemaruju.
c)
Switch kontrola je slina if-then-else naredbi. Podrava byte, short, char i int primitivne
tipove podataka, ali i enumerirane i String tipove podataka.
private String odrediNazivMjeseca(int mjesec){
String nazivMjeseca = ;
switch(mjesec){
case 1:
nazivMjeseca = Sijeanj;
break;
case 2:
nazivMjeseca = Veljaa;
break;
...
case 12:
nazivMjeseca = Prosinac;
break;
default:
System.out.println(Nevaei mjesec);
break;
}
return nazivMjeseca;
}
Primjer 6. Switch naredba
49
Hoe li se koristiti if-then-else ili switch naredba ovisi o itljivosti koda, ali i o izrazu koji treba
provjeravati. If-then-else naredba testira izraze koji se temelje na udaljenosti nekih vrijednosti
ili za provjeru nekog stanja, a switch naredba provjerava izraz koji se temelji na jednoj int, enum
vrijednosti ili String objektu. Izvoenje se kod switch naredbe ne prekida iako je uvjet i prvi put
ispunjen. Zbog toga je nakon svakog izraza nuno staviti kljunu rije break kako bi prevoditelj
izaao iz petlje ukoliko je uvjet prvi put zadovoljen.
3.3.2. Petlje
Java razlikuje sljedee vrste petlji koje se koriste ovisno o situaciji:
a)
While petlja neprekidno izvrava blok koda sve dok je odreeni izraz istinit.
int i = 1;
while(i < 10){
System.out.println(Petlja se izvrila + i puta);
i ++;
}
Primjer 7. While petlja
Moe se implementirati i beskonana petlja ako u while petlju stavimo true.

while(true){
// kod
}
Primjer 8. Neograniena while petlja
b)
Do-while petlja provjerava izraz tek na kraju petlje i to ju razlikuje od while petlje. Kod se
unutar do-while petlje izvodi najmanje jedanput, a u while petlji se ne mora izvesti niti jednom.
do{
// kod
} while(izraz);
Primjer 9. Do-while petlja
c)
For petlja omoguuje kompaktan nain iteracije kroz skup vrijednosti. Opi se oblik for
petlje moe zapisati na sljedei nain:
for(inicijalizacija; uvjetni izraz; inkrement){
// kod
}
Primjer 10. Opi oblik for petlje
Inicijalizacija inicijalizira petlju. Izvrava se samo jednom, tj. kada petlja zapoinje. Petlja se izvrava sve dok je uvjetni izraz istinit. Kada uvjetni izraz poprimi vrijednost false, petlja se prekida.
Inkrement je izraz koji se izvrava prilikom svake iteracije petlje. Najee je to inkrement (uveanje) ili dekrement (umanjenje) neke vrijednosti.
for(int i = 0; i < 10; i++){
System.out.println(Broj iteracije: + i);
}
Primjer 11. For petlja
50
ZADATAK 13
Uz pomo do-while petlje ispii sve brojeve koji su vei od 500 a manji od 700, a koji su djeljivi sa 17.
Ispii koliko takvih brojeva ima. Rijei zadatak uz pomo for petlje.
3.4. Polja
Polje je kontejner objekata koji sadri fiksni broj vrijednosti istog tipa. Veliina se polja odreuje
kada se kreira polje.
Slika 77. Opi oblik jednodimenzionalnog polja
Na slici 77. prikazano je polje veliine 10. Svaki element u polju ima svoj indeks, odnosno redni
broj na kojem se nalazi u polju. Indeksiranje elemenata u polju kree od broja 0 i stoga je indeks
zadnjeg elementa u polju 9, a ne 10.
private void primjerPolja(){
int[] polje = new int[10];
int[0] = 100;
int[1] = 200;
int[2] = 300;
int[3] = 400;
int[4] = 500;
int[5] = 600;
int[6] = 700;
int[7] = 800;
int[8] = 900;
int[9] = 1000;
System.out.println(Vrijednost na indeksu 0 je : + polje[0]);
}
OUTPUT:
Vrijednost na indeksu 0 je : 100
Primjer 12. Popunjavanje i indeksiranje polja
Polja se deklariraju slino kao i varijable, a poslije tipa slijedi uglata zagrada. Polje se moe inicijalizirati i skraenom sintaksom.
int polje[] = {100, 200, 300, 400, 500, 600, 700, 800, 900, 1000}
Primjer 13. Popunjavanje polja u deklaraciji
Veliina se polja u primjeru 11. odreuje brojem elemenata izmeu vitiastih zagrada. Mogue je
definirati i polje polja, tj. viedimenzionalno polje koritenjem dva ili vie skupova vitiastih zagrada.
U Javi je viedimenzionalno polje jednostavno polje koje u sebi sadrava polja, a ne tip podataka.
51
String[][] imena = {
{Pero, Marko, Ivan},
{Peri, Markovi, Ivi}
};
System.out.println(imena[0][0] + +
System.out.println(imena[0][2] + +
imena[1][0]);
imena[1][2]);
OUTPUT:
Pero Peri
Ivan Ivi
Primjer 14. Polje u polju (dvodimenzionalno polje)
Sljedea slika pokazuje indeksiranje elemenata u viedimenzionalnom polju.
Primjer 15. Opi oblik dvodimenzionalnog polja
ZADATAK 14
Napii program koji e uitati 5 realnih brojeva u polje i ispisati najmanji element u polju.
3.5. Metode [8]

Metode se mogu zamisliti kao mehanizam koji pretvara ulazne jedinice u izlazne. Npr. ulazne su
jedinice tvornice papira stabla i drugi sastojci, a izlazna je jedinica papir. Dakle, tvornica papira
iz nekih ulaznih vrijednosti stvara izlaznu vrijednost. Na takvom principu rade i metode u programiranju.
private Papir kreirajPapir(Stablo stablo, Sastojci ostaliSastojci){
//kod kreiranja papira
return papir;
}
Primjer 16. Pretvaranje ulaznih jedinica u izlazne
Neophodni dijelovi deklaracije metode su: tip koji metoda vraa, naziv, zagrade i tijelo izmeu
vitiastih zagrada. Deklaracija se metode sastoji od 6 komponenti:
1.
Vidljivost: private, protected, public vidljivost metoda
2.
Vrijednost koju metoda vraa: tip varijable koju metoda vraa (ako metoda ne vraa
vrijednost, onda je void)
3.
Naziv metode: treba izbjegavati kljune rijei kao nazive metoda
4.
Lista parametara: lista parametara je u zagradama i metoda ih prima kao ulazne podatke. Mora se navesti tip i naziv parametra. Ako parametri nisu potrebni, koristi se prazna zagrada ().
52
5.
List iznimaka: ponekad odreeni kod baca iznimke, a iznimke se mogu vezati na deklaraciju metode tako da se navede lista svih moguih iznimaka koje se mogu dogoditi prilikom
izvoenja metode.
6.
Tijelo metode: sadri sav potreban kod za metodu zajedno s deklaracijom lokalnih varijabli.
Slijedi primjer jedne metode.

public double zbroji(double a, double b){
//kod
}
Primjer 17. Metoda s dva parametra
Svaka metoda ima svoj potpis (engl. signature) koji metodu ini jedinstvenom. Potpis je gore
napisane metode sljedei:
public double zbroji(double a, double b);
Primjer 18. Potpis metode
Preporua se da se metode imenuju s glagolom koji je napisan malim slovima, a ako se sastoji
od vie rijei, prva rije treba biti glagol, a druga imenica, pridjev i sl.
tri
triBrzo
koi
dohvatiPodatkeIzBaze
Primjer 19. Primjeri naziva metoda
Java omoguava preoptereivanje (engl. overloading) metoda. Moe razlikovati metode s razliitim potpisom. To znai da metode u istoj klasi mogu imati jednake nazive ako imaju razliitu
listu parametara.
public class MojaKlasa{
private int zbroj(int a, int b){};
private int zbroj (int a, int b, int c){};
private double zbroj(double a, double b){};
}
Primjer 20. Preoptereivanje metoda
Dakle, java razlikuje sve tri gore navedene metode. Preoptereene metode razlikuje po broju i
tipu argumenata u listi parametara.
NAPOMENA: Ne smije se zamijeniti preoptereivanje metoda s prepisivanje (engl. override)
metodom jer se ne odnose na isto. Prepisivanje metode se koriste kada jedna klasa nasljeuje
drugu, ali nema isto ponaanje u metodama. Metode se prepisuju, a klasi se moe opisati ponaanje koje se razlikuje od ponaanja klase roditelja kojeg je naslijedila. U svakodnevnom ivotu
objekti imaju odreene atribute kao to npr. ormar ima visinu, irinu i duinu. Ormaru se mogu
mijenjati stanja pomou akcija kao to su otvaranje i zatvaranje ormara. Kao to s varijablama
definiramo atribute objekta, tako s metodama definiramo akcije koje se mogu raditi na objektu.
Dakle, metode omoguuju promjenu stanja objekta. U ovom se sluaju moe mijenjati stanje
ormara iz zatvorenog u otvoreno i obrnuto.
53
package org.gauss.toturial;
public class Ormar {
private int visina;
private int irina;
private int duina;
private boolean otvoren = false;
public Ormar(int visina, int irina, int duina) {
this.visina = visina;
this.irina = irina;
this.duina = duina;
}
public void otvoriOrmar() {
this.otvoren = true;
}
public void zatvoriOrmar(){
this.otvoren = false;
}
public boolean jeOtvoren() {
return this.otvoren;
}
}
Primjer 21. Klasa ormar
Primjeri metoda ve zahvaaju granicu objektno orijentiranog programiranja, ali je lake razumjeti koncepte metoda kroz takve primjere. Ako se u ulazu u program kreira objekt ormar,
njegovo je poetno stanje zatvoren. To je zato to je varijabla otvoren definirana kao false:
private boolean otvoren = false
Ako se na tom objektu pokrene metoda otvoriOrmar(), vrijednost otvoren e se promijeniti u
true to znai da je tom objektu promijenjeno stanje. Stanje se ormara moe provjeriti s metodom jeOtvoren(). Isto tako, ako se pokrene metoda zatvoriOrmar(), varijabla otvoren e se
promijeniti u false to znai da je ormar zatvoren.
public class Main {
public static void main(String[] args) {
Ormar ormar = new Ormar(5,5,5);
System.out.println("Ormar instanciran - Ormar je otvoren : " +
ormar.jeOtvoren());
ormar.otvoriOrmar();
System.out.println("Pokrenuta metoda otvoriOrmar() - Ormar je otvoren :
" + ormar.jeOtvoren());
ormar.zatvoriOrmar();
System.out.println("Pokrenuta metoda zatvoriOrmar() - Ormar je otvoren :
" + ormar.jeOtvoren());
}
}
Primjer 22. Izmjena stanja objekta kroz metode
Program u primjeru 20. kreira objekt tipa Ormar koji je visine 5, irine 5 i duine 5 i nakon toga se
na njemu izvode akcije otvaranja i zatvaranja ormara. Program ispisuje sljedei tekst u konzolu:
54
Slika 78. Ispis stanja objekta ormar u konzoli
Pomou metoda mogu se raditi i neki sloeniji postupci kao npr. raunanje opsega krunice.
Takva metoda ne mijenja stanje objekta, ali vraa informacije o objektu koje se mogu dobiti iz
njegovih svojstava. Ako je zadan polumjer krunice, iz tog se svojstva moe dobiti informacija o
opsegu krunice. Prvo se kreira objekt Krunica u kojem se definira metoda izraunajOpseg(). Ta
metoda e vraati broj tipa double.
public class Krunica{
private double x, y;
private double r;
public Krunica(int x, int y, int r) {
this.x = x;
this.y = y;
this.r = r;
}
public double izraunajOpseg(){
return 2 * 3.14159 * r;
}
}
Primjer 23. Klasa krunica s metodom izraunajOpseg()
Instanciranjem objekta tipa Krunica i pozivanjem metode izraunajOpseg() program bi trebao

ispisati opseg krunice u konzolu.
public class Main {
public static void main(String[] args) {
Krunica krunica1 = new Krunica(5, 5, 10);
System.out.println("Opseg krunice 1 je: " +
krunica1.izraunajOpseg());
Krunica krunica2 = new Krunica(10, 10, 20);
System.out.println("Opseg krunice 2 je: " +
krunica2.izraunajOpseg());
}
}
Primjer 24. Raunanje opsega dviju razliitih krunica
U primjeru 1.4.8. kreiraju se dvije razliite krunice. Prva krunica ima centar u toki (5, 5) i polumjer 10, a druga u toki (10, 10) i polumjer 20. U konzolu se ispisuje sljedee:
55
Slika 79. Ispis opsega dviju krunica u konzoli
ZADATAK 15
Napii program koji uitava cijeli broj n (2 n 30), a zatim poziva metode:
unesiElemente za uitavanje n elemenata u polje
sortirajPolje za sortiranje polja uzlazno po veliini
getMin za dohvaanje najmanjeg elementa
getMax za dohvaanje najveeg elementa polja
getSrvr za dohvaanje srednje vrijednosti svih elemenata
okreniPolje za mijenjanje mjesta elementima zadnje na prvo mjesto, predzadnje na
drugo itd.
toString koji kreira string od elemenata polja razdvojenih zarezom ili razmakom
3.6. Razine pristupa

Postoje razliite kljune rijei ispred metoda kao to su private i public. Predstavljaju razinu pristupa metodama ili varijablama u klasi. Postoje 4 vrste razina pristupa:
a)
private
b)
package
c)
protected
d)
public
Najee se u programiranju koriste samo private i public razine pristupa. Razina pristupa opisuje kojim e klasama metode biti vidljive. Ako je razina pristupa private, samo klasa u kojoj se
nalazi ta metoda ima pristup toj metodi i samo ju ona moe koristiti. Package razina pristupa
oznaava da metodi moe pristupati klasa u kojoj se nalazi, ali i sve klase koje se nalaze u istom
pakovanju (engl. package). Ako je razina pristupa protected, metodi moe pristupiti klasa u kojoj
se metoda nalazi, ali i klase koje se nalaze u istom pakovanju i sve podklase. Ako je pak razina
pristupa public, metodi moe pristupiti bilo koja klasa. Malom se izmjenom klase Krunica moe
pokazati primjer utjecaja razine pristupa na pozivanje metoda.
56
private double x, y;
private double r;
public Krunica(int x, int y, int r) {
this.x = x;
this.y = y;
this.r = r;
}
public double izraunajOpseg(){
return 2 * 3.14159 * r;
}
private double izraunajPovrinu(){
return r*r*3.14159;
}
}
Primjer 25. Private i public metode Krunice
Ako se instancira objekt Krunica, moe se pozvati samo metoda izraunajOpseg(), ali ne i metoda izraunajPovrinu() jer je metoda izraunajOpseg() razina pristupa public to znai da metodu moe pozvati bilo koja klasa. To se moe primijetit i prilikom pisanja samog koda gdje Eclipse
alat ne doputa pozivanje metode izraunajPovrinu() jer je ona private, tj. ne moe se pozvati
u nekoj drugoj klasi.
Slika 80. U drugoj klasi nije mogue pozvati private metode
57
OBJEKTNO ORIJENTIRANO PROGRAMIRANJE

4. OBJEKTNO ORIJENTIRANO PROGRAMIRANJE
4.1. Klase, objekti i enkapsulacija
Klase se mogu opisati kao shematski plan (engl. blueprint) objekta. Klasa je specifikacija kako
konstruirati objekt. Svaki put kada u programskom kodu stvaramo objekt, taj objekt nastaje iz
napisane klase, tj. instancira se objekt iz klase. Klasa je i kolekcija podataka i metoda koje rukuju
tim podatcima. Podatci i metode zajedno slue za definiranje sadraja i ponaanja nekog objekta. Npr. krunica se moe opisati s x, y koordinatama koje odreuju njezin centar i polumjer.
Postoji mnogo operacija koje se mogu raditi s krunicama: izraunati njen opseg, povrinu, provjeriti jesu li zadane toke unutar krunice itd. Svaka je krunica drugaija, ima razliite toke
sredita i razliite polumjere, ali ako krunicu opisujemo kao klasu, ima svojstva koje moemo
postaviti kao definiciju same krunice.
private double x, y //koordinate centra krunice
private double r; // polumjer krunice
// metode krunice
public double izraunajOpseg(){ return 2 * 3.14159 * r}
public double izraunaj Povrinu(){ return 3.14159 * r * r}
Primjer 26. Klasa krunica
Kada je napravljena klasa za krunicu, neto se eli i raditi s njom. Ali sa samom se klasom ne
moe raditi nita. Prvo se mora stvoriti objekt iz te klase kako bi se s njim moglo manipulirati.
Definiranjem klase stvorio se vlastiti tip podatka. Dakle, kao to postoji int, float, double, String,
sada postoji i tip podataka Krunica koji je neto sloeniji od tih osnovnih tipova podataka. On
se sastoji od vie jednostavnih tipova podataka. Kao to se nekoj varijabli dodijelio neki tip podataka, i nekoj se varijabli moe dodijeliti tip Krunica.
int broj;
float drugiBroj;
String tekst;
Primjer 27. Dodjeljivanje jednostavnog tipa podataka
Na ovaj se nain varijablama dodjeljuje jednostavan tip podataka. Ako se varijabli eli dodijeliti
tip Krunica, mora se koristiti kljuna rije new.
Krunica mojaKrunica = new Krunica();
Primjer 28. Dodjeljivanje vlastitog tipa podataka
Ovakvom se linijom koda kae programu da iz klase Krunica konstruira objekt krunica koji se
sprema u varijablu mojaKrunica. Sada se koritenjem objekta mojaKrunica moe raunati opseg i povrina krunice postavljanjem polumjera krunice. Polumjer se krunice moe postaviti
direktnim pristupom varijabli u objektu ili pomou metoda enkapsulacije.
U pisanju klasa preporua se postaviti sve varijable na to niu razinu pristupa (engl. access level).
To se odnosi na private, public i protected kljune rijei ispred varijable:
58

a)
public varijabla je vidljiva svim klasama
b)
private varijabla je vidljiva samo klasi u kojoj se varijabla nalazi
c)
protected varijabla je vidljiva klasi u kojoj se nalazi i svim podklasama
Metoda kojom se moe postaviti polumjer krunice jest postavljanje varijable r kao public i direktno pristupanje varijabli.
mojaKrunica.r = 5;
Primjer 29. Direktni pristup varijabli
Ova se metoda ne preporua jer varijabla nepotrebno postaje vidljiva svim klasama. Druga i
bolja metoda je metoda enkapsulacije kojom se razina pristupa varijable postavlja na private, a
metodama se omoguava manipulacija tom varijablom.
}
}
public double getR(){

return r;
public void setR(double r){
this.r = r;
// metode krunice
public double izraunajOpseg(){ return 2 * 3.14159 * r}
public double izraunaj Povrinu(){ return 3.14159 * r * r}
Primjer 30. Enkapsulacija varijabli
S get i set metodama omoguava se dohvaanje i postavljanje varijable r, a takve se metode jo

nazivaju pristupnim metodama (engl. accessor methods). Nakon toga se postavlja vrijednost te
varijable preko metode void setR (double r);
mojaKrunica.setR(5);
Primjer 31. Pristup varijabli preko set metode
4.2. Konstruktori
Klasa sadri konstruktore koji se pozivaju prilikom kreiranja objekta. Deklaracije su konstruktora
sline metodama, a razlikuju se po tome to naziv mora biti isti kao i naziv klase i ne vraa nikakav tip podataka (ak ni void). Konstruktori se koriste kada je potrebno postaviti stanje objekta (inicijalizirati objekt) prilikom njegovog stvaranja (instanciranja). Na primjeru klase Krunica
mogu se postavljati varijable nakon inicijalizacije pozivanjem set metoda ili prilikom inicijalizacije slanjem koordinata i polumjera u konstruktor.
59

//Konstruktor
public Krunica (double x, double y, double r){
this.x = x;
this.y = y;
this.r = r;
}
Primjer 32. Konstruktor krunice s parametrima koordinata i polumjerom
Sada je mogue kreirati objekt i odmah mu postaviti stanje.

Krunica mojaKrunica = new Krunica(0, 0, 5);
Primjer 33. Konstruiranje objekta pomou vlastitog konstruktora
Tako kreiran objekt imat e centar u koordinatama (0, 0) s polumjerom 5. Klasa moe imati proizvoljan broj konstruktora.
public Krunica (double x, double y, double r){
this.x = x;
this.y = y;
this.r = r;
}
public Krunica (double r){
this.x = 0;
this.y = 0;
this.r = r;
}
public Krunica (double x, double y){
this.x = x;
this.y = y;
this.r = 5;
}
Primjer 34. Klasa s veim brojem konstruktora
Svaka klasa sadri osnovni konstruktor bez parametara koji se ne mora definirati.
Primjer 35. Kreiranje objekta s osnovnim konstruktorom
60
ZADATAK 16
Napii klasu Zarulja koja ima: atribut bool tipa Stanje, podrazumijevani i parametarski
konstruktor, jedinstvenu metodu za paljenje i gaenje arulje i metodu koja provjerava svijetli li
arulja. Kreiraj objekt klase Zarulja, upali i ugasi arulju nekoliko puta i provjeri svijetli li arulja.
4.3. Nasljeivanje
Klasa moe naslijediti drugu klasu i tada se naziva podklasa (engl. subclass, derived class, extended class, child class). Klasa koja je naslijeena naziva se nadklasa (engl. superclass, base class,
parent class). Svaka klasa moe naslijediti samo jednu nadklasu (u sluaju potrebe za viestrukim nasljeivanjem koriste se suelja (engl. interface). Kada se kreira nova klasa, a ve postoji
klasa koja sadri dio koda koji je potreban, moe se naslijediti tu klasu i iskoristiti ve gotove
dijelove koda, tj. nije potrebno pisati cijelu klasu ispoetka. Ipak, nasljeivanje slui da bi se
kreirao is-a odnos koji je nuan prilikom implementacije nasljeivanja. Podklasa nasljeuje sva
polja, metode i ugnijeene klase od svoje nadklase. Konstruktori se ne nasljeuju, ali se moe
pozvati konstruktor nadklase u podklasi.
public class Zaposlenik {
// klasa Zaposlenik sadri 3 varijable
public String ime;
public String prezime;
public String adresa;
// klasa Zaposlenik ima jedan konstruktor
public Zaposlenik (String ime, , String prezime, String adresa) {
this. ime = ime;
this. prezime = prezime;
this.adresa = adresa;
}
// klasa Zaposlenik sadri 4 metode

public void setIme(String ime) {
this.ime = ime;
}
public void setPrezime(String prezime) {
this. prezime = prezime;
}
public void setAdresa(String adresa){
this.adresa = adresa;
}
public void obavljajRad() {
//kod
}
public void uzmiGodinji() {
//kod
}
Primjer 36.Klasa Zaposlenik
61

Klasa Inenjer koja nasljeuje klasu Zaposlenik mogla bi ovako izgledati:
public class Inenjer extends Zaposlenik {
// Inenjer podklasa dodaje jo jednu varijablu
public int brojNadziranihObjekata;
// Inenjer podklasa ima jedan konstruktor
public Inenjer(String ime, String prezime, String adresa, int
brojNadziranihObjekata){
super(ime, prezime, adresa);
this. brojNadziranihObjekata = brojNadziranihObjekata;
}
// Inenjer podklasa dodaje jo jednu metodu
public void nadziriNoviObjekt () {
this.brojNadziranihObjekata++;
}
Primjer 37. Klasa Inenjer nasljeuje klasu Zaposlenik
Inenjer klasa nasljeuje sve varijable i metode od klase Zaposlenik i dodaje jo polje brojNadziranihObjekata i metodu nadziriNoviObjekt. Dakle, kao da je napisana klasa Zaposlenik ispoetka
s etiri varijable i pet metoda. Podklasa ne nasljeuje varijable s razinom pristupa private, tj.
naslijedit e samo varijable koje su public i protected i u istom paketu.
4.4. Apstraktne klase [10]

Apstraktna klasa je klasa koja se deklarira s kljunom rijeju abstract i moe, ali i ne mora, sadravati apstraktne metode. Apstraktne se klase mogu instancirati, tj. mogu se naslijediti iako
nije mogue kreirati objekte takvih klasa. Apstraktna metoda je metoda koja ima deklaraciju, ali
nema implementaciju.
abstract void pomakni (double pomakX, double pomakY);
Primjer 38. Apstraktna klasa pomakni
Ako klasa sadri apstraktnu metodu, i klasa mora biti apstraktna.

public abstract Zaposlenik{
abstract void obavljajRad();
}
Primjer 39. Apstraktna klasa s apstraktnom metodom
Zaposlenik je klasa koja se moe naslijediti i mogua je nadklasa za Inenjer, Radnik, Menader,
Programer i sl. Ti zaposlenici imaju neka zajednika svojstva kao to je npr. obavljanje posla i
zato se moe odrediti apstraktna nadklasa Zaposlenik.
public abstract Zaposlenik{
abstract void obavljajRad();
abstract void uzmiGodinji();
}
Primjer 40. Klasa Zaposlenik koja e sluiti kao nadklasa
62

Klasa moe sadravati jednu ili vie apstraktnih metoda. Klase koje nasljeuju takvu klasu moraju imati implementaciju za svaku od apstraktnih metoda nadklase jer e inae i same biti apstraktne. Tako svaka klasa koja naslijedi klasu Zaposlenik, mora imati implementaciju za metode
obavljajRad() i uzmiGodinji().
public Inenjer extends Zaposlenik{
void obavljajRad(){
//kod
}
void uzmiGodinji(){
//kod
}
}
Primjer 41. Klasa Inenjer mora implementirati apstraktne metode
ZADATAK 17
Napii apstraktnu klasu Rukometas koja ima atribute za ime, starost i teinu. Napii
podrazumijevani konstruktor, parametarski konstruktor i apstraktnu metodu double
igraj(). Izvedi klasu Napadac koja ima atribut za snagu uta (1-100) i postotak
realizacije (0-100). Prepii metodu igraj tako da se rauna mogunost gola prema
formuli (1). Izvedi klasu Golman koja ima atribute refleksi (1-100) i postotak obrana (0100). Prepii metodu igraj tako da rauna mogunost obrane prema formuli (2).
Kreiraj jednog golmana i jednog napadaa, pozovi na obojici metode igraj i ispii na
ekran je li postignut gol. To odredi na temelju izraunatih mogunosti obrane i gola
(ako je vea, dogodilo se).
Snaga * Realizacija - 10 * Starost
(1)
Refleksi * Postotak Obrana - 2 * Starost (2)
4.5. Polimorfizam
Polimorfizam je u rjeniku definiran kao princip u biologiji prema kojemu organizam ili vrsta
moe imati vie razliitih oblika ili razina razvoja. Taj se princip moe primijeniti i u Java programskom jeziku. Podklase neke klase sadre vlastito ponaanje, ali i dio ponaanja koji dijeli sa
svojom nadklasom. Polimorfizam se moe demonstrirati manjom izmjenom klase Zaposlenik.
Moe se dodati metoda ispiiOpis koja e ispisivati sve trenutne podatke o zaposleniku.
public void printDescription(){
System.out.println("Zaposlenik " + this.ime + " " + this.prezime +
adresi " + this.adresa);
}
" ivi na
Primjer 42. Metoda printDescription()
63

Kako bi demonstrirali polimorfizme, naslijedit emo klase Zaposlenik s klasama Inenjer i Arhitekt.
public class Inenjer extends Zaposlenik {
public int brojNadziranihObjekata;
public Inenjer(String ime, String prezime, String adresa, int
brojNadziranihObjekata){
super(ime, prezime, adresa);
this. brojNadziranihObjekata = brojNadziranihObjekata;
}
public void nadziriNoviObjekt () {
this.brojNadziranihObjekata++;
}
public void printDescription(){
super.ispiiOpis();
System.out.println("Inenjer " + this.ime + " " + this.prezime +
nadzire " + this. brojNadziranihObjekata + " objekata");
}
"
Primjer 43.Klasa Inenjer
Arhitekt je isto zaposlenik, ali se njegov rad razlikuje od rada Inenjera.

public class Arhitekt extends Zaposlenik{
private intbrojNacrta;
Arhitekt(Stringime,String prezime,String adresa,intbrojNacrta){
super(ime,prezime,adresa);
this.brojNacrta = brojNacrta;
}
private void izradi NoviNacrt(){
this.brojNacrta++;
}
public void ispiiOpis() {
super.ispiiOpis();
System.out.println("Arhitekt " + this.ime + "" + this.prezime + " je
izradio " + this.brojNacrta + " nacrta");
}
Primjer 44. Klasa Arhitekt
Sada je mogue testirati polimorfizam u par primjera.
64
public static void main (String[] args){

Zaposlenik zaposlenik01, zaposlenik02, zaposlenik03;
zaposlenik01= new Zaposlenik("Pero", "Peri", "Kralja Zvonimira 1A");
zaposlenik02= new Inenjer("Marko","Mari","Kralja Tomislava 2B", 10);
zaposlenik03= new Arhitekt("Ivan", "Ivi", "Kravlja Kreimira 3A", 23);
zaposlenik01.printDescription();
Primjer 45. Polimorfizam:sva su tri zaposlenika istog tipa, ali su instancirani kao razliiti objekti
U testnom se programu moe vidjeti da se varijablama zaposlenik01, zaposlenik02 i zaposlenik03 dodijelio tip varijable Zaposlenik, ali se svaka varijabla instancirala kao drugaiji tip objekta. To je mogue zbog polimorfizma. Dakle, zaposlenik01 je instanciran kao new Zaposlenik(), a
zaposlenik02 kao new Inenjer(). Budui da je klasa Inenjer naslijedila klasu Zaposlenik, a zaposlenik02 je zapravo i Zaposlenik i Inenjer, moe mu se dodijeliti tip Zaposlenik. Isto vrijedi i za
zaposlenik03. Arhitekt je Arhitekt, ali je i Zaposlenik. No ako bi se instancirao objekt Zaposlenik
u neku varijablu, ta bi varijabla mogla biti samo tipa Zaposlenik, ali ne i Inenjer ili Arhitekt jer je
taj objekt samo Zaposlenik, ali nije Inenjer ili Arhitekt. Slina situacija moe postojati i kod parametara metoda u kojima se moe definirati parametar tipa Zaposlenik to znai da e metoda
primati parametre tipa Zaposlenik, ali i Inenjer i Arhitekt.
public void metoda(Zaposlenik zaposlenik){
//kod
}
Primjer 46. Metoda kao parametar prima tip Zaposlenik
Ova se metoda moe pozivati na sljedee naine i sva su tri naina ispravna.
metoda(zaposlenik01);
Primjer 47. U metodu se mogu slati sve podklase klase Zaposlenik
65
RAZVOJ APLIKACIJA ZA ANDROID PLATFORMU

5. RAZVOJ APLIKACIJA ZA ANDROID PLATFORMU
5.1. Instalacija potrebnih alata
Kako bi se zapoelo s razvojem Android aplikacija, prvo se izrauje instalacija potrebnih alata,
prije svega JDK. JDK je dostupan na sljedeoj internetskoj stranici:
http://www.oracle.com/technetwork/java/javase/downloads/jdk7-downloads-1880260.html
JDK mora biti kompatibilan s operacijskim sustavom na kojemu e se aplikacije razvijati. Android aplikacije se razvijaju u Eclipse IDE (engl. Intergrated Development Environment) razvojnom
alatu. Eclipse je dostupan na:
http://www.eclipse.org/downloads/
Odabire se verzija Eclipse alata. Uz ovu se skriptu preporuuje koritenje Eclipse IDE for Java
EE Developers, ali je mogua i druga verzija, ovisno o vlastitim preferencijama. Primjeri koji su
navedeni u ovoj skripti, pisani su u Eclipse verziji Indigo koja je nia verzija od trenutne Juno.
Stoga e izgled samog Eclipsea biti neto drugaiji u primjerima. Osim ovih dviju instalacija, potrebno je instalirati i Android SDK, tj. klase i razvojno okruenje koje se koristi za razvoj Android
aplikacija. Android SDK se instalira preko Eclipse plugina i to na sljedei nain. U Eclipse menu
se klikne na Help -> Install New Software. Otvoriti e se prozor Install u kojem se klikne na Add.
U Name se stavi proizvoljan naziv npr. ADT plugin te se kopira sljedea adresa u Location:
https://dl-ssl.google.com/android/eclipse/
Slika 81. Instalacija Android SDK plugina
Nakon toga se oznai Developer Tools, prihvaaju se licence, klikne se na Finish i eka se izvrenje instalacija. Nakon instalacije restartira se Eclipse i pokree se u Eclipse menu Window -> Android SDK Manager. Ako se koristi verzija Juno, prvo se dodaje AndroidSDK manager u izbornik
Window tako da se pokrene Window -> Customize Perspective... te se oznai Android SDK and
AVD Manager nakon ega se manageri pokreu na prethodno navedeni nain.
U Android SDK alatu odreuje se za koje se platforme Androida eli razvijati. Trenutno se podrava od verzije 1.5 (API 3), tj. Cupcake do verzije 4.2 (API 17), tj. Jelly Bean. Novije verzije Androida imaju vee i bolje mogunosti i programer bira verziju platforme kojom eli razvijati aplikaciju. Ovdje su trenutno dostupne sve verzije SDK-ova te Tools folder. Za SDK-ove se odabire samo
SDK platform, a ako se ele razvijati aplikacije s Google mapama, oznauje se i Google APIs.
Ostalo je proizvoljno. Odabiru se i System Image datoteke za kreiranje i pokretanje emulatora.
66
Slika 82. Android SDK Manager
Zatim se izrauje emulator u kojem e se testirati izraene aplikacije. Emulatori se ureuju klikom na meni Window -> AVD Manager u kojem se bira New i postavljaju se sljedei parametri:
a)
AVD Name - postavlja se naziv emulatora.
b)
Devic AVD manager sadri ve gotove konfiguracije ureaja. Moe se odabrati jedna
od ve postojeih konfiguracija. Ne mora se postavljati ukoliko se eli napraviti vlastita konfiguracija.
c)
Target programer odabire za koju verziju Androida eli raditi aplikaciju i koju minimalnu verziju eli podravati. Sve novije verzije Androida podravaju i starije verzije tako da je
najbolje postaviti najnoviju verziju Androida.
d)
CPU/ABI Android ureaji koriste razliite arhitekture procesora. Bira se arhitektura
koju e emulator koristiti. Postoje razliite prednosti i nedostatci ovakvog izbora. Npr. Intelova
arhitektura podrava GPU akceleraciju to znai da e emulator koristiti grafiku karticu raunala kako bi se ubrzao rad emulatora.
e)
Memory Option emulator za svoj rad koristi RAM memoriju raunala. Postavlja se
koliko e RAM memorije emulator imati na raspolaganju. to je vie RAM memorije, bolje je za
emulator.
f)
Internal Storage Android ureaji imaju odreenu koliinu unutarnje memorije u koju
se spremaju brojevi kontakata, aplikacije, razne datoteke i sl.
g)
SD Card u neke se Android ureaje moe ubaciti SD kartica s dodatnom memorijom
kako bi se poveao njegov kapacitet. Moe se odrediti koliko e vanjske memorije emulator imati.
67
Slika 83. Kreiranje Android emulatora
Kada se ispune svi potrebni elementi, klikne se na OK i emulator je spreman za koritenje.
5.2. Kreiranje Android projekta

Android projekt sadri sve potrebne datoteke koje obuhvaaju izvorni kod Android aplikacije.
Android SDK alati omoguavaju jednostavan nain kreiranja Android projekta sa skupom osnovnih direktorija i datoteka. Android projekt se kreira na sljedei nain: File -> New -> Other ->
Android -> Android Application Project.
Slika 84. Kreiranje Android projekta
68

a)
Application Name naziv aplikacije koja e se prikazati korisnicima.
b)
Project Name naziv projekta vidljivog u Eclipse IDE
c)
Package Name namespace paket u kojem se nalaze Java klase (pravila su ista kao i u
Javi). Naziv paketa mora biti unikatan u cijelom Android sustavu. Postoje razne preporuke kako
imenovati paket.
d)
Minimum Required SDK najmanja verzija Android OS-a na kojoj e se pokretati aplikacija. Ako je minimalna verzija 2.2., aplikaciju nee podravati ureaji s 2.1. OS-om
e)
Target SDK ciljani Android OS za koji se eli razvijati aplikacija. Ako je ciljani SDK 4.1.,
aplikaciju nee podravati ureaji s 4.2. OS-om.
f)
Compile With verzija operacijskog sustava za koji se aplikacija kompilira. Inae se
ostavlja ista kao Target SDK.
g)
cije.
Theme odreuje se Android tema koja odreuje izgled odreenih komponenti aplika-
Na sljedeem se prozoru ugasi opcija Create custom launcher. Ako je ova opcija upaljena, nudi
se izrada Launcher ikona. Launcher ikona je ikona koju korisnici vide na Home screenu Android
ureaja, tj. klikom na tu ikonu ulazi se u aplikaciju. Ona se moe i kasnije izraditi.
Zatim se moe kreirati:
a)
Blank Activity
Blank Activity je prazna aktivnost koja sadri samo osnovne komponente prozora. To je najee
Title bar traka na vrhu na kojoj pie naziv aplikacije ili sl.
b)
Fullscreen Activity
Fullscreen Activity je takoer prazna aktivnost, ali su osnovne komponente skrivene. Dakle, ova
je aktivnost u potpunosti prazna.
c)
Master Detail Flow Activity
Master Detail Flow Activity je aktivnost koja se najee koristi u tabletima. Zahtijeva da najmanja verzija OS-a bude 3.0. jer koristi fragmente koji su podrani od te verzije. Sastoji se od liste
stavki s lijeve strane i detaljnog opisa stavki s desne strane.
Najbolje je odabrati Blank Activity. Sljedei je korak odabir naziva aktivnosti, naziv Java klase i
naziv layouta to je XML datoteka u kojoj se kreira UI, tj. izgled aktivnosti. Tip se navigacije moe
ostaviti na None.
69
Slika 85.Arhitektura Android projekta
Android projekt sastoji se od vie datoteka i direktorija, a pojanjeni su sljedei:

a)
AndroidManifest.xml
Manifest datoteka opisuje osnovne karakteristike aplikacije i definira njene komponente. Jedan
je od najvanijih elemenata manifesta <uses-sdk> element kojim se deklarira kompatibilnost
aplikacije za razliite verzije Android operacijskog sustava. Kada se Android projekt kreira, odabire se najmanja i najvia podrana verzija OS-a koja je zabiljeena ovim elementom:
<uses-sdk
android:minSdkVersion="8"
android:targetSdkVersion="17" />
Primjer 48 Najmanja i najvia podrana verzija OS-a u manifestu
U manifestu se takoer moraju definirati sve aktivnosti koje aplikacija sadri.

<application
android:icon="@drawable/ic_launcher"
android:label="@string/app_name"
android:theme="@style/AppTheme" >
<activity
android:name="android.gauss.androidtutorial.MainActivity"
android:label="@string/app_name">
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
</application>
Primjer 49. Definiranje aktivnosti u manifestu
U Activity se elementu pomou Name atributa definira putanja do Activity klase. Label atribu-
70

tom se oznaava string koji e se koristiti kao naziv aktivnosti, a prikazat e se u Title Baru. U
intent-filter elementu MainActivity aktivnost se oznaava kao Home aktivnost, tj. kao glavna
ulazna aktivnost aplikacije android.intent.action.Main. Oznaava se i da e ova aktivnost biti prikazana kao ikona na Android application launcher ekranu android.intent.category.LAUNCHER.
b)
src
U src se direktoriju nalaze glavne Java klase. Kreiraju se nove klase potrebne za razvoj razliitih
komponenti aplikacije.
c)
res
U res se direktoriju nalaze razne dodatne komponente za razvoj aplikacije kao to su slike, XML
datoteke za definiranje UI-a, datoteke za definirane nekih vrijednosti, lokalizacija i sl.
d)
drawable-hdpi
Predstavlja direktorij za slike koje su dizajnirane za ureaje s HDPI ekranima. Postoje i direktoriji
za vrste ekrana druge gustoe piksela (LDPI, MDPI, XHDPI).
e)
Layout
Layout je direktorij za XML datoteke kojima definiramo UI.

f)
Values
Values je direktorij za ostale XML datoteke koje sadre skup resursa kao to su string vrijednosti,
definicije boja i sl.
Kreiranjem projekta SDK je ve stvorio testnu Hello world! aplikaciju. Aplikacija se moe testirati
tako da se napravi desni klik na projekt -> Run As -> Android Application. Nakon to se emulator
uitao, pokree se Android Tutorial aplikacija.
Slika 86. Hello World aplikacija
Nakon uspjeno prevedenog Android projekta, u gen se direktoriju moe nai R.java
71

klasa. Tu klasu generira sam kompajler, a slui za referenciranje svih resursa koji se koriste u projektu. Android svakom resursu dodjeljuje identifikator pomou kojeg pristupa
resursu, a programer tim resursima pristupa R.java klasom. Kada se kreirao projekt,
kreirala se i XML layout datoteka. Ona se nalazi u resursima u direktoriju res->layout
kojemu je prevoenjem dodan identifikator u R.java klasu.
public static final class layout {
public static final int activity_main=0x7f030000;
}
Primjer 50. Identifikator activity_main layouta
Rasursima se razliito pristupa u kodu to ovisi o tome gdje se nalaze:

a) R.layout.activity_main pristupa se layout-u activity_main koji se nalazi u direktoriju
layout
b) R.drawable.ic_launcher pristupa se slici ic_launcher koja se nalazi u direktoriju drawable
c)
R.string.app_name pristupa se string varijabli koja se nalazi u direktoriju values u
datoteci strings.xml
d) R.id.helloText pristupa se elementu u XML layout datoteci.
Postoji jo nekolicina resursa koji se mogu i ne moraju koristiti i svima se pristupa preko R.java
klase.
5.3. XML kao osnova Android korisnikog suelja (UI-a)

XML (engl. eXtensible Markup Language) se veoma esto koristi kao format prikaza, strukture i
prenoenja podataka i upravo je zbog toga poznavanje strukture XML formata od iznimne vanosti. XML je striktan dokument u kojemu svi elementi moraju biti pravilno otvoreni i zatvoreni.
Element podrazumijeva zapis koji poinje izmeu znaka manje od(<) i vee od(>). Izmeu se
nalazi naziv elementa, a zavrava s manje od + kosa crta (</) i vee od(>). Element izgleda ovako:
<krunica>Moja krunica</kruica>
Primjer 51. osnovni XML element
<krunica> se na engleskom jo naziva opening tag ili otvarajua oznaka, a </krunica> closing
tag ili zatvarajua oznaka. Razlika je u kosoj crti kada se element zatvara. U primjeru ispred
nalazi se element iji je naziv (engl. name) krunica, a vrijednost (engl. value) je Moja krunica. Vano je da svaki element bude otvoren, a na kraju zatvoren. Svaki element osim naziva i
vrijednosti moe sadravati i atribute. Atributi su vrijednosti koje se nalaze u otvorenom dijelu
elementa u stilu klju vrijednost. Npr.
<krunica polumjer = "10">Moja Krunica</krunica>
Primjer 52. XML atribut elementa
Dakle, atribut elementa krunica je polumjer, a njegova je vrijednost 10. Elementi mogu imati i vie od
jednog atributa. Ne postoji granica koja odreuje maksimalan broj atributa koji element moe imati.
72
<krunica polumjer = "10" x = "5" y = "5">Moja Krunica</krunica>
Primjer 51. XML element podrava vei broja atributa
Ako element nema vrijednost, a ima npr. samo atribute, moe se odmah zatvoriti tako da se
definira slino kao i element zatvaranja, ali je kosa crta na kraju.
<krunica polumjer = "10" x = "5" y = "5" />
Primjer 53. XML element koji je istovremeno otvoren i zatvoren
Kao to je ve reeno, XML se koristi za prikaz strukture podataka. Tako se moe prikazati struktura kue i vlasnika na sljedei nain:
<kua>
<adresa>Kralja Zvonimira</adresa>
<kuni_broj>10</kuni_broj>
<vlasnik>
<ime>Pero</ime>
<prezime>Peri</prezime>
<dob>30</dob>
<spol>Muko</spol>
</vlasnik>
</kua>
Primjer 54. XML prikaz strukture podataka
Kua sadri nekoliko elemenata: adresu, kuni broj i vlasnik. Za vlasnika se takoer mogu definirati i njegovi elementi, tj. ime, prezime, dob, spol. Moe se ii jo dublje u strukturu pa se tako za
vlasnika koji ima ivotinju definiraju elementi za ivotinju. Postoji uska poveznica i s objektima
u OOP. Ako postoji klasa Kua, ima varijable: adresa tipa String, kuniBroj tipa int, vlasnik tipa
Vlasnik. Tada bi se kreirala jo jedna klasa Vlasnik koja ima varijable: ime tipa String, prezime
tipa String, dob tipa int i spol tipa String.
Slika 87. Odnos strukture objekata i XML strukture
U definiranju se korisnikog suelja za Android ne koriste vrijednosti elemenata nego samo atri-
73

buti. Svaki View definira svoja svojstva kroz atribute elementa. Npr. ako se eli u XML-u kreirati
gumb, kreira se element <Button> kojemu se dodjeljuju svojstva kroz atribute na sljedei nain:
<Button
android:id="@+id/myButton"
android:text="OK" />
Primjer 55. Button View u Android XML-u
Atributom id gumbu se dodjeljuje jedinstveni identifikator kako bi se kasnije mogao programski

referencirati i manipulirati. Atributi layout_width i layout_height su atributi koji odreuju visinu
i irinu gumba. U ovom je sluaju postavljena vrijednost wrap_content to znai da e visina i
irina biti jednake veliini teksta unutar gumba, u ovom sluaju veliine teksta OK. Atributom
text postavlja se koji e tekst biti prikazan unutar gumba.
5.4. Android Activity i UI XML

Android Activity se moe zamisliti kao prazno platno kojem programer daje izgled koji definira
u XML layout datoteci. Vrlo se esto pojam Activity izjednauje s pojmom Context. Context je,
kao to mu i sam naziv govori, kontekst trenutnog stanja aplikacije/objekta. Novokreiranim objektima omoguava razumjeti to se zapravo dogaa. Osnovno je svojstvo konteksta da se moe
pozivati kada je potrebna informacija o nekom drugom dijelu programa (aktivnosti, aplikacije).
Context je suelje za globalne informacije o okruenju aplikacije. Veoma esto kod programiranja Android aplikacija neki objekti prilikom instanciranja zahtijevaju da se u konstruktor alje
Context. Zato je vano znati da je aktivnost Context.
Slika 88. Spajanje XML layouta u aktivnost
74

Kada se kreirao Android projekt, odabrana je Blank Activity koja sadri Title Bar traku na vrhu
(traka u kojoj pie Android Tutorial). Ova traka nije direktni dio aktivnosti i zbog toga se u layoutu definira izgled za prazan dio aktivnosti ispod Title Bara. Title Bar se moe maknuti programski
ili u manifestu. Ako se Title Bar makne, layout se rairi po cijeloj aktivnosti. U manifestu se
dodijeli android: theme atribut s vrijednou:
@android:style/Theme.NoTitleBar
<activity
android:theme="@android:style/Theme.NoTitleBar" >
<intent-filter>
</intent-filter>
</activity>
Primjer 56. Micanje Title Bara u manifestu
Programski se Title Bar odstranjuje tako da se u onCreate() metodi napie sljedei kod:
requestWindowFeature(Window.FEATURE_NO_TITLE);
Slika 89. Micanje Title Bar programski
Layout definira vizualnu strukturu korisnikog suelja kao to je UI za aktivnost. Layouti se mogu
definirati na dva naina: deklaracijom UI elemenata u XML-u ili instanciranjem layout elemenata u kodu. Android prua mogunost kreiranja elemenata preko XML datoteke tako to se
pozivanjem elemenata u XML datoteci referencira na View i ViewGroup klase i podklase. Isto
tako, programer moe i u samoj aktivnosti kreirati i slagati View i VewGroup objekte. Prednost
je deklariranja UI-a u XML-u to se postie razdvajanje koda od prezentacijskog dijela aplikacije.
Tako je UI neovisan o programskom kodu to znai da se svojstva elemenata mogu mijenjati
bez utjecaja na programski kod. Deklariranje UI elemenata strukturno vrlo blisko prati nazive
njihovih klasa i metoda: nazivi su elemenata vrlo slini nazivima klasa, a nazivi atributa nazivima metoda. Npr. Button element u XML-u se odnosi na Button klasu, a njegov atribut text na
metodu Button.setText().
Kao to je ve reeno, UI aktivnost se definira u layout XML datoteci. U takvoj se datoteci koriste dvije vrste objekata: View i ViewGroup. ViewGroup u sebi moe sadravati vie Viewova i
ViewGroupa, a View ne moe sadravati niti jedan element. Dakle, ViewGroup je kontejner za
Viewove koji se u njemu hijerarhijski razliito slau to ovisi o tipu ViewGroupa.
ViewGroup je nadklasa sljedeih klasa [5]:
a) LinearLayout pozicionira elemente u jedan redak ili stupac ovisno o orijentaciji.
b) TableLayout pozicionira elemente u obliku tablice po redovima i stupcima.
c) FrameLayout uglavnom dodjeljuje pozicije jednom elementu. Ako sadri vie elemenata, slau se jedan na drugi po zamiljenoj Z osi.
d)
RelativeLayout vjerojatno najmoniji od svih ViewGroupova. Omoguava pozicioni-
75

ranje elemenata relativno u odnosu na druge elemente i u odnosu na sam layout.
e) AbsoluteLayout elementi se pozicioniraju na specificirane X i Y koordinate unutar
layouta. Koritenje se ovog layouta ne preporua jer nee biti ispravno prikazan na razliitim
veliinama ekrana i kod razliitih orijentacija.
Viewovi su elementi koji se slau u ViewGroupu. Viewovi mogu biti: Button, TextView, EditText,
ImageView, VideoView i sl. Za kreiranje se UI layouta ne preporua grafiki editor jer najee
ne prikazuje dobro sadraj. Preporua se koritenje XML editora za slaganje elemenata. Slijedi
primjer layouta kao na slici iznad.
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity" >
<TextView
android:id="@+id/textView1"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:text="Top Left" />
<TextView
android:layout_centerInParent="true"
android:text="Middle" />
<TextView
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:text="Bottom Right" />
</RelativeLayout>
Primjer 57. Definiranje XML layouta
Prvom TextViewu se dodjeljuje ID preko kojeg se u kodu moe dohvatiti. S @+id/textView1 je reeno da u R.java klasu zapie ovaj ID kako bi se kasnije mogao koristiti. AlignParentTop i AlignParentLeft govore TextViewu da se smjesti na vrh i lijevo u odnosu na
roditelja, tj. ViewGrupu u kojoj se nalazi, a u ovom sluaju RelativeLayout. Width i Height
su atributi koji odreuju irinu i duinu za ovaj TextView, tj. koliko e prostora zauzimati. Text oznaava koji e tekst biti prikazan. Moe se uoiti da se editor buni kod napisanog
teksta. Razlog tomu je to bi svi stringovi trebali biti zapisani u posebnu datoteku i referencirani u atributu text. Dakle, treba otvoriti datoteku strings.xml i upisati sljedei kod:
76
<?xml version="1.0" encoding="utf-8"?>

<resources>
<string name="top_left">Top Left</string>
<string name="middle">Middle</string>
<string name="bottom_right">Bottom Right</string>
</resources>
Primjer 58 Definiranje string resursa u string.xml datoteci
Nakon toga se u text atributu taj string referencira na sljedei nain:

<TextView
android:layout_centerInParent="true"
android:text="@string/middle" />
Primjer 59. Referenciranje string resursa u TextViewu
Najee se provodi na ovakav nain zbog lokalizacije.
ZADATAK 18
Kreiraj aktivnost i dodijeli joj XML layout datoteku kao na slici:
77

5.5. Pokretanje aktivnosti (engl. Intent)
Android aplikacije najee imaju vei broj ekrana zbog aktivnosti koje prikazuju razliite stavke.
To zahtjeva pozivanje razliitih aktivnosti kojima se alju odreeni podatci koji se ele prikazati.
Zbog toga se postavlja EditText u koji se upisuje neka vrijednosti i Button kojim se poziva druga
aktivnosti. Vrijednost koja je upisana u EditTextu alje se u aktivnost. Dakle, potrebno je promijeniti main_activity.xml.
tools:context=".MainActivity" >
<EditText
android:id="@+id/myEditText"
android:layout_width="100dp"
android:textSize="20sp"/>
<Button
android:id="@+id/buttonOk"
android:layout_below="@id/myEditText"
android:text="@string/button_ok"/>
</RelativeLayout>
Primjer 60. XMl layout datoteka s Buttonom
Izgled Activity klase:
78
public class MainActivity extends Activity {

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
//Dohvaa se referenca na element EditText kojega smo postavili u layout
XMLu sa ID-em R.id.myEditText
final EditText editText = (EditText)findViewById(R.id.myEditText);
//Dohvaa se referenca na element Button kojega smo postavili u layout
XMLu sa ID-em R.id.buttonOk
Button button = (Button) findViewById(R.id.buttonOk);
//Registrira se onClick listener na button. Listener "slua" kada
//korisnik klikne na button i u tom sluaju
//pokree metodu OnClick(View v)
button.setOnClickListener(new OnClickListener() {
//Metoda koje se pokree kada korisnik klikne na button
@Override
public void onClick(View v) {
//Iz EditTexta dohvaamo upisanu vrijednost
String myValue = editText.getText().toString();
});
Intent intent = new Intent(MainActivity.this,

SecondActivity.class);
//U intent objekt se stavlja vrijednost dohvaena iz
//EditText-a i postavlja joj se
//identifikator "editTextValue" kako bi se preko tog
//identifikatora kasnije mogla dohvatiti ta vrijednost
intent.putExtra("editTextValue", myValue);
startActivity(intent);
Primjer 61. Pokretanje aktivnosti pomoi Intent objekta
View se uz pomo metode findViewById(R.id.my_edit_text) dohvati u layout XML-u s ID-em

my_edit_text. Ova metoda vraa objekt tipa View i casta ga u tip EditText. String se sprema
u myValue varijablu koja se nalazi u EditTextu, tj. predstavlja vrijednost koju korisnik upie u
EditText. Kao to se dohvaa EditText, dohvaa se i button iz XML-a. Njemu se postavlja OnClickListener. OnClickListener je interface koji slua, tj. eka klik na button. Kada se klikne na button,
pokree se metoda onClick(View v). U toj je metodi kreiran Intent objekt koji se moe prevesti
kao namjera. Predstavlja klasu kojom programer izvrava neku namjeru, a koja je u ovom sluaju pokretanje nove aktivnosti. Intent se moe zamislit kao ljepilo izmeu dviju aktivnosti. U
konstruktor Intent klase alje se prvo Context, a zatim i naziv Activity klase koja se eli pokrenuti.
U Intent je postavljena i vrijednost koja se alje u sljedeu aktivnost metodom putExtra. Pomou
startActivity(intent) pokree se druga aktivnost.
79

Sljedei je korak kreiranje klase za drugu aktivnost, tj. SecondActivity. Prvo se mora kreirati XML
layout datoteka.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" >
<TextView
android:id="@+id/textView"
android:textSize="20sp"/>
</LinearLayout>
Primjer 62. XML layout datoteka druge aktivnosti
Nakon toga se kreira aktivnost SecondActivity.

package android.gauss.androidtutorial;
import android.app.Activity;
import android.os.Bundle;
import android.widget.TextView;
public class SecondActivity extends Activity{
@Override
setContentView(R.layout.activity_second);
//Kada se iz prole aktivnosti poslao objekt intent, ovdje ga se
//dohvaa i iz njega izvlai string preko identifikatora
final String myValue=getIntent().getStringExtra("editTextValue");
//Iz layout XML-a se dohvaa TextView i kao vrijednost mu se //postavlja

string iz intenta
TextView textView=(TextView) findViewById(R.id.textView);
textView.setText(myValue);
Primjer 63. Aktivnost koja se pokree pomou Intent objekta
Nova se aktivnost mora registrirati u manifestu jer inae aplikacija nee raditi, tj. javljat e greku da ne moe nai aktivnost.
80
<application
...
<activity
android:name="android.gauss.androidtutorial.SecondActivity"
android:theme="@android:style/Theme.NoTitleBar">
</activity>
</application>
Primjer 64 Definiranje aktivnosti u manifestu
Nakon svih se koraka aplikacija pokree i trebao bi se dobiti sljedei rezultat:
Slika 89. Pokretanje aktivnosti u emulatoru
Klikom na OK gumb trebala bi se pokrenuti druga aktivnost u kojoj pie vrijednost koja
je napisana u prvoj aktivnost u EditTextu.
5.6. ivotni ciklus Android aktivnosti [14]
Od pokretanja, rada s aplikacijom pa sve do izlaska instance aktivnosti u aplikaciji prelaze u
razliita stanja svog ivotnog ciklusa. Npr. kada se aktivnost pokree prvi put, dolazi u prednji
plan sustava i dobiva fokus. Kroz taj proces Android sustav poziva niz metoda ivotnog ciklusa
aktivnosti. Ako korisnik pokree akciju koja zapoinje neku drugu aktivnost ili pokree neku
drugu aplikaciju, sustav opet poziva niz metoda u aktivnosti dok ju stavlja u pozadinu. Ponaanje
se aktivnosti unutar tih metoda ivotnog ciklusa moe odrediti kada korisnik ulazi i izlazi iz aktivnosti. Npr. ako se izvodi streaming nekog videa, pauzira se streaming ako korisnik izlazi iz
aplikacije. Kada se korisnik vrati u aplikaciju, klikom na Play nastavlja streaming video na onom
mjestu gdje je stao.
Temeljne programske paradigme pokreu aplikacije iz neke main aktivnosti, a Android pokree
kod u Activity instanci pokretanjem odreene callback metode koja odgovara stanjima ivotnog
ciklusa aktivnosti.
Postoji slijed callback metoda koje se izvode kada se aktivnost pokree i slijed callback metoda
kada se aktivnost zaustavlja. Tijekom ivota aktivnosti sustav poziva metode njenog ivotnog
ciklusa u obliku piramide i korak po korak se kree po stanjima ivotnog ciklusa. Dakle, svako je
stanje ivotnog ciklusa sljedei korak u toj piramidi. Vrh piramide je stanje aktivnosti u kojem
je aktivnost prikazana na ekranu, a korisnik je u interakciji s aktivnou. Kako korisnik izlazi iz
aktivnosti, sustav poziva drugi niz metoda, tj. kree se niz piramidu kako bi se rastavio i pravilno
iziao iz aktivnosti. U nekim se sluajevima stanje aktivnosti u izlazu nee obaviti do kraja, tj. stat
81

e na nekom odreenom stanju (npr. kada korisnik pokrene drugu aktivnost). S tog se stanja aktivnost kasnije moe vratiti na stanje u vrhu piramide i nastaviti rad tamo gdje je zadnji put stala.
Slika 90. ivotni ciklus aktivnosti [15]
Nije potrebno implementirati sva stanja ivotnog ciklusa. Meutim, potrebno je razumjeti svaki
od njih i implementirati ih tako da se aplikacija ponaa onako kako korisnik to oekuje. Pravilna
implementacija metoda ivotnog ciklusa aktivnosti osigurava da se aplikacija pravilno ponaa i
da:

se aplikacija ne rui ako korisnik primi poziv ili pokrene neku drugu aplikaciju
aplikacija ne koristi dragocjene sistemske resurse ako je korisnik ne koristi aktivno
se ne izgubi stanje aplikacije ako korisnik izae iz nje i kasnije se vrati
se aplikacija ne srui ili izgubi stanje prilikom tranzicije ekrana iz Portrait i Landscape
Od est moguih stanja, samo su tri stanja statina, tj. aplikacija moe ivjeti samo u tri stanja:
a) Resumed
U ovom je stanju aktivnost vidljiva na ekranu i korisnik moe biti u interakciji s njom. U ovom je
stanju aktivnost najee.
b) Paused
U ovom je stanju aktivnost pomraena, djelomino vidljiva zbog druge aktivnosti. Kada npr.
neka druga aktivnost ne prikriva cijeli ekran, prva se aktivnost samo djelomino vidi. Pauzirana
aktivnosti ne moe prihvatiti unos korisnika ili pokretati neki kod.
c) Stopped
U ovom je stanju aktivnost u potpunosti skrivena iza neke druge aktivnosti i nije vidljiva korisniku. Smatra se da je aktivnost u pozadini. Instanca aktivnosti i njeno stanje (npr. varijable) su
ouvani, ali se ne moe izvravati nikakav kod.
Druga stanja (Created i Started) su stanja tranzicije u kojima se aktivnost ne zadrava, nego se
brzo kree iz jednog stanja u sljedee pozivanjem sljedee callback metode. Kada sustav pozove
82

onCreate() metodu, ubrzo nakon toga poziva i onStart() metodu koja zatim brzo poziva onResume() metodu. Da bi se vidio redoslijed pokretanja tih metoda stanja, moe se napraviti primjer
u kojem e se u svakoj od tih metoda ispisivat neto u Log.
import android.util.Log;
private static final String TAG = MainActivity.class.getName();
@Override
Log.d(TAG, "POKRENUT CREATE");
}
@Override
protected void onStart() {
super.onStart();
Log.d(TAG, "POKRENUT START");
}
@Override
protected void onResume() {
super.onResume();
Log.d(TAG, "POKRENUT RESUME");
}
@Override
protected void onPause() {
super.onPause();
Log.d(TAG, "POKRENUT PAUSE");
}
@Override
protected void onStop() {
super.onStop();
Log.d(TAG, "POKRENUT STOP");
}
@Override
protected void onDestroy() {
super.onDestroy();
Log.d(TAG, "POKRENUT DESTROY");
}
Primjer 65. Ispis stanja ivotnog ciklusa aktivnosti u Log
Ispis se moe vidjeti u alatu LogCat koji se skida zajedno s Android SDK. Ako nije prikazan u Eclipseu, moe se nai u Window -> ShowView -> LogCat.
83
Slika 91. Android Log s prikazom ispisanih vrijednosti u svakom stanju ivotnog ciklusa
Crvenim su pravokutnicima oznaene poruke koje su postavljene u aktivnosti da se ispiu.

Pokretanjem aktivnosti pokrenule su se metode: onCreate(), onStart() i onResume() Ako korisnik stisne gumb Back nakon to se prikazao ekran, pokrenut e se sljedee metode: onPause(),
onStop() i onDestroy(). Kada se aplikacija normalno koristi, aktivnosti mogu preprijeiti neke
druge vizualne komponente koje uzrokuju odlazak aktivnosti u Pause stanje. Npr. ako se otvori
neka polutransparentna aktivnost u obliku nekog Dialog prozora, aktivnost se pauzira. Kada
aktivnost jednom postane potpuno nevidljiva, prelazi u stanje Stop. Kada aktivnost ue u Pause
stanje, sustav poziva onPause() metodu aktivnosti kako bi programer mogao zaustaviti neke
akcije koje traju kao to su: izvoenje video sadraja ili spremanje onih informacije koje e
kasnije biti potrebne ukoliko korisnik nastavi izlazak iz aplikacije. Ako se korisnik vrati iz pauzirane aktivnosti, sustav poziva onResume() metodu. Ako aktivnost ode u Pause stanje, aktivnost
e se na trenutak zaustaviti i korisnik e nastaviti svoj rad ili u potpunosti izai iz aplikacije. U
onPause() treba izbjegavati one radnje koje zahtijevaju puno procesiranja jer usporavaju tranziciju aktivnosti iz jednog stanja u drugo. Takve se radnje obavljaju u onStop() metodi. Kada se
aktivnost pauzira, Activity instanca je u memoriji i poziva se kada aktivnost prelazi u Resume
stanje. Nije potrebno ponovno inicijalizirati komponente koje su kreirane za vrijeme bilo kojih
od callback metoda prije Resume stanja.
Pravilno je zaustavljanje i ponovno pokretanje aktivnosti vaan proces u ivotnom ciklusu aktivnosti jer stvara kod korisnika osjeaj da je aplikacija iva i da ne gubi svoje stanje. Postoji par
kljunih scenarija kada se aktivnost zaustavlja i ponovno pokree:
a)
Korisnik otvara ekran Recent Apps (dugim pritiskom na Home tipku) i prebacuje se s
trenutne aplikacije na drugu. Prva aktivnost prelazi u Stop stanje. Kada se korisnik vraa u aplikaciju kroz Android Home Screen ili Recent Apps ekran, aktivnost se ponovno pokree.
b)
Korisnik pravi akciju u aplikaciji koja pokree novu aktivnost. Prva aktivnost se zaustavlja i prelazi u Stop stanje. Ako korisnik klikne Back tipku i vraa se u prvu aktivnost, ta se aktivnost ponovno pokree.
c)
84
Korisnik prima poziv kad koristi aplikaciju.

Activity klasa osigurava dvije metode ivotnog ciklusa: onStop() i onRestart(). One omoguuju
specifino rukovanje aktivnosti kada se zaustavlja i ponovno pokree. Pause stanje se pokree
kada je aktivnost djelomino vidljiva, a Stop stanje osigurava da UI nije vidljiv i da je korisnikov
fokus u drugoj aktivnosti ili aplikaciji.
Trenutno jo nije opisana onDestroy() metoda. Ova se metoda poziva u par sluajeva. Kada je korisnik u aktivnosti i klikne na Back tipku, poziva se onDestroy() metoda nakon onStop() metode.
Sustav moe i sam pozvati ovu metodu ako je aktivnost u stanju Stop, ako se nije dugo koristila
ili ako trenutna aktivnost zahtjeva puno memorije. Ovom se metodom oslobaa memorija i
resursi za neke druge stvari. Ako se aktivnost uniti pritiskom na tipku Back, sistemski je koncept
Activity instance zauvijek nestao jer aktivnost smatra da vie nije potrebna. Meutim, ako se
aktivnost uniti zbog sistemskih ogranienja, aktivnost nije samo nestala, ve i sustav pamti da
je aktivnost unitena. Ako se korisnik vrati na tu aktivnost, sustav ju ponovno kreira koritenjem
skupa spremljenih podataka koji opisuju stanje aktivnosti prije njenog unitenja. Spremljeni
se podatci, koje sustav koristi za ponovno kreiranje aktivnosti, nazivaju instance state. ine
kolekciju klju vrijednost parova koji su spremljeni u Bundle objekt. Sustav koristi Bundle
instancu kako bi spremio informacije svakog View objekta u layoutu aktivnosti (npr. tekst napisan u EditTextu). Dakle, ako se instanca uniti i ponovno kreira, stanje se layouta obnavlja bez
potrebnog dodatnog koda. U takvom se sluaju pozivaju jo dvije dodatne metode: onSaveInstanceState() i onRestoreInstanceState().
Kako bi se spremili dodatni podatci o stanju aktivnosti, potrebna je overrideati onSaveInstanceState() callback metoda. Sustav poziva ovu metodu kada korisnik izlazi iz aktivnosti. alje
aktivnosti Bundle objekt koji se sprema kada se poziva onDestroy(). Ako kasnije sustav mora
ponovno kreirati instancu aktivnosti, alje Bundle objekt u onCreate() i u onRestoreInstanceState() metode.
Slika 92.Spremanje i ponovno kreiranje stanja aktivnosti [16]
5.7. Podravanje razliitih ureaja [11]

Uvijek je dobro izdvajati UI stringove iz aplikacijskog koda i drati ih u eksternoj datoteci. U Androidu je to lako jer postoji direktorij za resurse u svakom Android projektu. Kreiranjem Android
projekta, alat kreira i res/ direktorij. Unutar tog direktorija su: direktoriji za dranje razliitih
vrsta resursa i res/values/strings.xml datoteka koja sadrava string resurse.
85

Ako se eli podrati vie jezika, kreiraju se dodatni values/ direktoriji unutar res/ direktorija u
kojima e biti datoteke za dranje resursa. Direktoriji se oznaavaju imenovanjem s values- , a
nakon okomite crte dodaje se ISO kod za oznaavanje drave. Npr. values-es/ e biti direktorij
za dranje resursa za panjolski jezik. Android automatski uitava resurse iz direktorija ovisno o
postavljenom jeziku ureaja. Dakle, ako je u glavnim postavkama ureaja postavljen panjolski
jezik, sustav e automatski uitavati resurse iz values-es/ direktorija. Ukoliko je u postavkama
postavljen panjolski jezik, a ne postoji values-es/ direktorij s resursima, automatski se uitavaju
resursi iz values/ direktorija.
Slika 93. Direktoriji i datoteke za lokalizaciju
Slijede primjeri razliitih resursa stringova za razliite jezike.

Za engleski jezik:
<resources>
<string name="title">My Application</string>
<string name="hello_world">Hello World!</string>
</resources>
Primjer 66. Primjer lokalizacije za engleski jezik
Za panjolski jezik:
<resources>
<string name="title">Mi Aplicacin</string>
<string name="hello_world">Hola Mundo!</string>
</resources>
Primjer 67. Primjer lokalizacije za panjolski jezik
86

Za francuski jezik:

<resources>
<string name="title">Mon Application</string>
<string name="hello_world">Bonjour le monde !</string>
</resources>
Primjer 68. Primjer lokalizacije za francuski jezik
String resursi se mogu referencirati u kodu i XML datotekama koritenjem naziva u atributu name koji je definiran u elementu <string>. U kodu se string referencira sa sljedeom sintaksom:
R.string.<naziv_stringa>
U XML datotekama string se referencira sljedeom sintaksom:

@string/<naziv_stringa>
Android kategorizira veliine ekrana dvama osnovnim svojstvima: veliina i gustoa [7]. Programer mora imati u vidu da e njegova aplikacija biti pokrenuta na ekranima razliitih veliina
i gustoa. Stoga bi trebao ukljuiti alternativne resurse kako bi optimizirao izgled aplikacije na
razliitim ekranima:

postoje 4 ope veliine: small, normal, large, xlarge

postoje 4 ope gustoe: low (ldpi), medium (mdpi), high (hdpi) i extra high (xhdpi)
Kako bi deklarirao razliite layoute i slike za koritenje na razliitim ekranima, postavljaju se

alternativni resursi u razliite direktorije, slino kao i kod lokalizacije. Orijentacija se ekrana (portrait i landscape) interpretira kao razliita veliina ekrana i aplikacije bi trebale revidirati layout
kako bi bile optimizirane u svakoj orijentaciji. Za ovakvu je optimizaciju nuno kreirati jedinstveni layout XML za svaku veliinu ekrana koju bi aplikacija trebala podravati. Svaki bi layout trebao biti spremljen u odgovarajui direktorij za resurse imenovan s -<veliina_ekrana> sufiksom.
Npr. jedinstveni layout za velike ekrane trebao bi biti spremljen unutar res/layout-large/. Nazivi
datoteka moraju biti identini, ali sadraj moe biti razliit kako bi bio optimiziran za razliite
ekrane. Layout se referencira na sljedei nain:
R.layout.<naziv_layouta>
Layout se postavlja u onCreate() metodu pomou metode setContentView(int layouResID). Android automatski skalira layout kako bi pravilno stao na ekran. Zbog toga se layouti za razliite
ekrane ne moraju brinuti o apsolutnim veliinama UI elemenata, nego se moraju fokusirati na
strukturu elemenata. Sustav uitava layout file iz odgovarajueg direktorija na temelju veliine
ekrana ureaja na kojoj se vrti aplikacija. Trebaju se ponuditi i razliite slike koje su pravilno skalirane za svaki osnovni tip gustoe ekrana. Na taj se nain postie vrlo dobra grafika kvaliteta i
poveanje performansi na svim gustoama. Gustoe ekrana su u sljedeim odnosima:
a)
xhdpi: 2.0
b)
hdpi: 1.5
c)
mdpi: 1.0 (osnovno)
d)
ldpi: 0.75
87

Prema tome, ako postoji slika veliine 200x200 za xhdpi ureaje, izrauje se ista ta slika 150x150
za hdpi, 100x100 za mdpi i 75x75 za ldpi.
Slika 94. Direktoriji za slike za ureaje razliitih gustoa ekrana
Svaki put kada se referencira slika u Android sustav, isto kao i kod razliitih veliina ekrana, odreuje se i koje e slike uitati to ovisi o gustoi ekrana samog ureaja.
5.8. Fragmenti
Android UI se gradi do skupa View i VewGroupa, a takva se hijerarhija Viewova uitava iz resursa
nakon pokretanja aktivnosti. Aktivnost se inicijalizira i prikazuje na ekranu ureaja. Za manje je
ekrane ovakvo ponaanje prihvatljivo. Korisnik se kree iz jedne aktivnosti u drugu, podravan
je brz i intuitivni prelazak izmeu aktivnosti. No, ako je UI rairen na nekom veem ekranu (npr.
ekranu tableta), neki e dijelovi ekrana ostati statini i nee se uope mijenjati. Dakle, veliki e
dio ekrana ostati neiskoriten, a kretanje iz aktivnosti u aktivnost nema nekog smisla. Implementacija je UI-a u potpunosti podrana i u njoj se dijelovi ekrana izmjenjuju jednostavnim
sakrivanjem i prikazivanjem elemenata ekrana, tj. Viewova. Trebalo bi mijenjati onoliko Viewova
koliko ih ima na ekranu, ali to nema smisla. Kako bi se omoguila interakcija u kojoj bi se dijelovi
ekrana dinamiki izmjenjivali bez pokretanja novih aktivnosti, u Android OS uvedena je Fragment klasa. Fragmenti su podrani od verzije 3.0 (API 11, Honeycomb). Fragment se opisuje kao
neto izmeu Viewa i aktivnosti. Kao i View, moe biti dodan u ViewGroup ili biti dio layouta.
Nije podklasa od Viewa, ali moe biti dodan u ViewGroup koritenjem FragmentTransaction objekta. Kao i aktivnost, fragment ima svoj ivotni ciklus, ali za razliku od aktivnosti, fragment nije
Context i njegov je ivotni ciklus ovisan o aktivnosti u kojoj se nalazi. Kao i svaki View, moe se
dodati u layout XML ili programski.
88
android:orientation="horizontal" >
<fragment
android:id="@+id/firstFragment"
class="android.gauss.androidtutorial.FirstFragment" />
</LinearLayout>
Primjer 69. Definiranje fragmenta u layout XMLu
Ovaj layout koristi aktivnost normalno kao i svaki drugi. Layout koristi <fragment> element u ijem se class atributu definira putanja do klase koja e predstavljati fragment.
Dakle, na ovoj se putanji mora kreirati klasa koja e biti podklasa Fragment klase. Android Framework automatski kreira instancu tog fragmenta kada se layout uita. Kao
i Activity, i fragment moe uitati svoj layout i za svaki se fragment definira poseban
layout.
<TextView
android:text="@string/first_fragment"/>
</LinearLayout>
Primjer 70. Definiranje XML layout datoteke za fragment
Nakon toga se kreira fragment klasa koja uita svoj layout i koristi elemente isto kao i aktivnost.
89
import
import
import
import
import
android.app.Fragment;
android.os.Bundle;
android.view.LayoutInflater;
android.view.View;
android.view.ViewGroup;
public class FirstFragment extends Fragment{

@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle
savedInstanceState) {
return inflater.inflate(R.layout.fragment_first, container, false);
}
Primjer 71. Kreiranje FirstFragment klase
Layout se u fragmentu postavlja u metodi onCreateView(), a u aktivnosti u metodi onCreate().

Iako fragment ima svoj ivotni ciklus, nije identian ivotnom ciklusu aktivnosti. Fragmenti imaju
dodatne metode ivotnog ciklusa kao to je i onCreateView(). Ova se metoda poziva kada se
inicijalizira layout fragment, a onCreate() kada se inicijalizira sam fragment. Slijedi primjer aktivnosti s dva fragmenta koji su jedan ispod drugog.
U layoutu aktivnosti ubaen je jo jedan fragment i svakom je elementu postavljen

atribut weight = 1 kako bi oba fragmenta dijelila ekran na pola. Postavljena je i orijentacija LinearLayouta kao vertical, a height atribut je postavljen na 0dp zbog definiranog
atributa weight. Drugi fragment je kreiran isto kao i prvi i uitan je njegov layout.
<fragment
android:id="@+id/firstFragment"
android:layout_height="0dp"
android:layout_weight="1"
class="android.gauss.androidtutorial.FirstFragment" />
<fragment
android:id="@+id/secondFragment"
android:layout_weight="1"
class="android.gauss.androidtutorial.SecondFragment" />
</LinearLayout>
Primjer 72. Definiranje dva fragmenta u layout aktivnosti
90

Fragmentima su postavljeni sljedei layouti:
a)
za prvi fragment:

android:background="@color/red"
<TextView
android:text="@string/first_fragment"/>
</LinearLayout>
Primjer 73. XML layout prvog fragmenta
b)
za drugi fragment:

android:background="@color/blue"
<TextView
android:text="@string/second_fragment"/>
</LinearLayout>
Primjer 74. XML layout drugog fragmenta
Dobiva se sljedei rezultat:
Slika 95. Aktivnost koja sadri dva fragmenta
91
ZADATAK 19
Kreiraj aktivnost koja dijeli ekran na 3 fragmenta kao na slici:
5.9. Asinkroni pozivi

AsyncTask klasa u Androidu omoguava pokretanje vie operacija istovremeno bez runog stvaranja posebnih dretvi. S asinkronim je pozivima mogue kreirati posebnu dretvu na kojoj e se
obaviti neka dugotrajna radnja ili radnja koja zahtjeva puno procesorske obrade. Nakon toga
se rezultat vraa u glavnu dretvu. Na taj se nain postie ii programski model asinkronog
pozivanja.
Dretva (negdje se naziva i nit procesa) je dio procesa koji izvrava neku radnju. Dretve se odvijaju istovremeno u procesu. Skup se dretvi naziva proces. Android aplikacija sadri nekolicinu
dretvi koje se mogu vidjet u DDMS (engl. Dalivk Debug Monitor Server) pogledu. Ako se s lijeve
strane oznai paket aplikacije i u alatima iznad klikne na debug, s desne e se strane otvoriti
debug prozor i moi e se vidjeti popis dretvi u trenutnoj aplikaciji.
Slika 96. Dretve jedne Android aplikacije
92

Trenutno aplikacija sadri tri Deamon dretve i tri dretve aplikacije. Deamon dretve nisu
dio aplikacije i neovisne su o JVM. Deamon dretve ne ograniavaju JVM u izlaenju, tj.
prisutne su i onda kada se JVM ugasi. Deamon dretva je npr. Garbage Collector.
Od ostale se tri dretve koje su dretve aplikacije, izdvajaju dvije Binder dretve. Binder
dretve je postavio sustav, a koriste se samo ako treba doi do komunikacije izmeu procesa tzv. IPC (engl. Inter-Process Communication).
Dretva na koju treba obratiti pozornost je:
Thread[<1> main] (Running)
Zasluna je za izvoenje i odravanje aplikacije. Ako bi ova dretva zastala ili bila neaktivna neko vrijeme, aplikacija ne bi reagirala na korisnikove interakcije. Ako Android sustav
primijeti da aplikacija ne reagira na korisnikove interakcije, rui aplikaciju jer smatra da
nije valjana. Na taj nain oslobaa memoriju. Sustav smatra da je aplikacija neaktivna,
tj. da je zaglavila ukoliko se u roku od pet sekundi glavna dretva ne vrati na odravanje
aplikacije. Upravo se iz tog razlog uvode asinkroni pozivi. Ako glavna dretva skida neki
sadraj s Interneta, mora napustiti svoj zadatak odravanja aplikacije i poeti se spajati
na internetsku stranicu, skidati sadraj, spremati sadraj u datoteku, parsirati sadraj i
sl. Za to bi vrijeme sustav primijetio da je aplikacija neaktivna i sruio bi aplikaciju. Kako
bi se to izbjeglo, uvode se asinkroni pozivi, tj. koristi se AsyncTask klasa. AsyncTask klasa
je naslijeena i potrebno je napraviti svoju klasu koja e raditi neku dugotrajnu radnju.
import android.os.AsyncTask;
public class MyAsyncTask extends AsyncTask<Void, Void, Void>{
@Override
protected void onPreExecute() {
// TODO Auto-generated method stub.
super.onPreExecute();
}
@Override
protected Void doInBackground(Void... params) {
return null;
}
@Override
protected void onPostExecute(Void result) {
super.onPostExecute(result);
}
Primjer 75. Kreiranje MyAsyncTask klase
Na naslijeenu se AsyncTask klasu obavezno mora implementirati doInBackground() metoda,

a ostale su metode proizvoljne. U onPreExecute() metodi se npr. moe prikazati dijalog koji e
oznaavati proces skidanja sadraja ili sl. U doInBackground() je potrebno napraviti svu potrebnu dugotrajnu aktivnost (spajanje na internetsku stranicu, skidanje njenog sadraja, parsiranje i
93

sl). Metoda onPostExecute() je metoda koja se izvodi na glavnoj dretvi, tj. AsyncTask predaje sav
sadraj glavnoj dretvi i tada se npr. moe prikazati u aktivnosti sadraj koji je skinut s Interneta.
Postavlja se pitanje zato se onPostExecute() metoda izvodi na glavnoj dretvi, a ne u asinkronoj
dretvi? Razlog je to se sve izmjene na ekranu (izmjene na UI) moraju obavljati na glavnoj dretvi.
Ako se nalazimo u dretvi koja nije glavna, tj. koja nije main dretva, nekom se TextViewu ne moe
dodijeliti vrijednost. Na glavnoj dretvi programer moe postaviti sve potrebne promjene na UI.
esto se AsyncTask koristi kao unutarnja klasa u Activity klasi kako bi se odmah imao pristup
layoutu i svim varijablama unutar aktivnosti.
private static final String TAG = MainActivity.class.getName();
@Override
MyAsyncTask myAsyncTask = new MyAsyncTask();
myAsyncTask.execute();
}
private class MyAsyncTask extends AsyncTask<Void, Void, Void>{
@Override
//Kod koji se izvrava prije doInBackground()
}
@Override
//Kod koji e se vrtiti u pozadini
return null;
}
@Override
//Kod koji se izvrava poslije doInBackground()
//Ovdje se mogu raditi izmjene na UI elementima
}
Primjer 76 Ugnijeena MyAsyncTask klasa
AsyncTask se pokree tako da se kreira objekt na koji se pozove metoda execute(). Ako
prilikom koritenja asinkronih poziva metoda odlazi u onStop() stanje, zaustavlja se procesiranje. Ako se aktivnost prekine zato to korisnik izlazi iz aplikacije jer ju ne eli koristiti, zaustavljaju se asinkroni pozivi kako se ne bi odvijala pozadinska radnja.
94
MyAsyncTask myAsyncTask;
@Override
myAsyncTask = new MyAsyncTask();
myAsyncTask.execute();
}
@Override
protected void onStop() {
super.onStop();
if(myAsyncTask != null){
myAsyncTask.cancel(true);
}
}
private static class MyAsyncTask extends AsyncTask<Void, Void, Void>{
@Override
//Kod koji se izvrava prije doInBackground()
}
@Override
//Kod koji e se vrtiti u pozadini
return null;
}
@Override
//Kod koji se izvrava poslije doInBackground()
//Ovdje se mogu raditi izmjene na UI elementima
}
Primjer 77. Pokretanje asinkronog poziva
5.10. Preference Activity

Preference su korisnike postavke aplikacije. PreferenceActivity se obino sastoji od konfiguracijskih podataka i UI preko kojih korisnik manipulira konfiguracijskim podatcima. S gledita korisnikog suelja, preference mogu biti jednostavne tekstualne vrijednosti, check-boxovi, selekcije s padajueg izbornika i sl. S gledita podataka, preference su skup klju-vrijednost parova. Te
su vrijednosti jednostavni tipovi podataka kao integer, boolean, string.
95

Kako bi aplikacija rukovala s korisnikim postavkama, izrauje se aktivnost u koju e se unositi
informacije, tj. Java kod koji e provjeriti i procesirati informacije i nekakav mehanizam za spremanje tih informacija. Ako bi se obavljalo runo, bilo bi to puno posla. Upravo zbog toga Android prua gotov framework koji pomae pri izradi korisnikih postavki. Prvo se definira izgled
preferenci u XML datoteci. Za kreiranje je korisnikih postavki potrebno sljedee:
a)
kreiranje Preference resurs datoteke naziva prefs.xml.
b)
impementacija PrefsActivity.java datoteke koja koristi prefs.xml kao UI
c)
registriranje Preference Activity u manifestu
d)
pruanje mogunosti ulaska u aktivnost kroz aplikaciju
XML datoteke za preference spremaju se u XML direktorij koji se kreira unutar glavnog direktorija aplikacije. Unutar direktorija kreira se XML datoteka desnim klikom -> New-> Other ->
Android XML File. Otvara se prozor u kojem se u Resource Type padajuem izborniku odabire
Preference, a u Root Element Preference Screen i klikne se na finish. Sve se to moe i runo napisati. Eclipse e kreirati novu datoteku koju je najbolje otvoriti u XML pogledu. Sada se mogu
dodavati elementi koji e predstavljati korisnike postavke. U elementima koji se rade, nemaju
svi atributi istu vanost . Najvaniji su sljedei atributi:
a)
Key
Jedinstveni je identifikator za svaku preference stavku. Pomou njega se kasnije dohvaa spremljena postavka.
b)
Title
Predstavlja naziv postavke koji e korisnik vidjeti. Trebao bi biti kratki naziv koji stane u jednu
liniju ekrana.
c)
Summary
Kratki je opis postavke. Iako je koritenje ovog atributa stvar izbora, preporua se.
Preference Activity s jednostavnim UI koji ima jedan EditTextPreference u koji se unosi neka
string vrijednost i jedan CheckBoxPreference koji oznauje da je neto true ili false:
<PreferenceScreen xmlns:android="http://schemas.android.com/apk/res/android" >
<EditTextPreference
android:key="myStringPreference"
android:title="@string/preference_myString"
android:summary="@string/preference_summary_myString"/>
<CheckBoxPreference
android:key="myBooleanPreference"
android:title="@string/preference_myBoolean"
android:summary="@string/preference_summary_myBooelan" />
</PreferenceScreen>
Primjer 78.. XML layout za aktivnost korisnikih postavki
96

Zatim se kreira PrefActivity klasa koja nasljeuje PreferenceActivity, a u onCreate()
metodi se postavlja layout iz definiranog XML-a.
import android.preference.PreferenceActivity;
public class PrefsActivity extends PreferenceActivity{
@Override
addPreferencesFromResource(R.xml.prefs);
}
Primjer 79. Kreiranje PrefActivity klase
Ova se aktivnost pokree kontrolom, tj. ubacuje se npr. button u glavnu aktivnost. Isto
tako treba definirati PrefsActivity u manifestu. Isti je sluaj kao i kod definiranja obine
Activity. Kada korisnik ue u PrefsActivity, moe postavljati te vrijednosti.
Slika 97 Preference Activity
Ove se vrijednosti automatski pamte u ureaju i ne moraju se runo odraivati. Vrijednosti se pamte u tzv. shared preferences. To se moe provjeriti postavljanjem buttona u MainActivity koji e korisnika odvesti u PrefActivity aktivnost. U MainActivity
postoje dva TextViewa koja predstavljaju vrijednosti koje je korisnik unio u preference.
Te se vrijednosti dohvaaju na nekoliko naina. Prvo se dohvati SharedPreference objekt
pomou PreferenceManager klase i njene metode getDefaultSharedPreferences(). Na
taj se nain dobije Shared Preference objekt koji sadri sve vrijednosti koje je korisnik
unio u preference. Svaku je preferencu sada mogue dohvatiti preko key atributa koji
mu je dodijeljen u XML datoteci. Metoda kojom se dohvaa preferenca po key atributu
sadri jo jedan element defValue koji je potreban ukoliko korisnik nije unio nita u
preferencu. Tada se koristi vrijednost definirana u deValue. U sluaju prvog TextViewa,
ako korisnik nije unio nita u preferencu, Moj String e koristiti defaultna vrijednost, a u
TextViewu e pisati Korisnik nije unio. U preferencama su trenutno unesene vrijednosti:
Moj String android
97

Moj Boolean checked (true)
Ako se pokrene MainActivity, te bi se vrijednosti trebale nalaziti tamo.
Slika 98. Dohvaanje vrijednosti iz Shared Preferences
ZADATAK 20
Kreiraj glavnu aktivnost koja ima dva gumba. Jedan gumb vodi u aktivnost korisnikih postavki u
kojima korisnik odabire svoje postavke. Drugi gumb vodi u aktivnost u kojoj su ispisane sve
korisnike postavke i njihove vrijednosti.
5.11. ListView i List Activity

U mobilnim se aplikacijama skup stavki esto prikazuje u obliku liste koju korisnik moe pomicati
gore, dolje (eng. scroll), a klikom na jednu stavku najee se otvara detaljniji prikaz te stavke. Za
tu svrhu postoji ListView klasa koja prikazuje liste stavki. Stavke mogu biti bilo kojeg tipa jer ListView klasa koristi adapter uzorak dizajna koji prilagoava tip podataka tipu ListViewa. Adapter
definira izgled svake pojedine stavke koja e biti prikazana u ListViewu. Postoji nekoliko vrsta
adaptera u Androidu i koriste se ovisno o potrebi. Npr. ArrayAdapter je podklasa BaseAdaptera
i koristi se za prikaz podataka koji se temelje na poljima ili listi. ListView se definira u XML layout
datoteci:
<ListView
android:id="@+id/mylist"
android:layout_height="wrap_content" >
</ListView>
</LinearLayout>
Primjer 80. XML layout aktivnosti koja sadri ListVIew
Lista se u XML-u mora dohvatiti u kodu i adapter joj mora biti proslijeen.
98
import
import
import
import
android.app.Activity;
android.os.Bundle;
android.widget.ArrayAdapter;
android.widget.ListView;

@Override
ListView listView = (ListView) findViewById(R.id.mylist);
String[] myValues = new String[] {"Osijek", "Zagreb", "Varadin",
"Zadar", "Vukovar", "Dubrovnik", "Pula", "Split", "Virovitica", "Karlovac"};
ArrayAdapter<String> adapter = new ArrayAdapter<String>(this,
android.R.layout.simple_list_item_1 , myValues);
listView.setAdapter(adapter);
Primjer 81. Kreiranje adaptera u aktivnosti i postavljanje u ListView
Kreirana je lista gradova koja se poalje u konstruktor adaptera. U konstruktoru se moe primijetiti resurs simple_list_item_1. Taj se resurs preuzima iz android.R.layout resursa. Ako se koriste resursi koji poinju s android, koriste se ve gotovi resursi koji se nalaze u Android SDK. Dakle, ovo je XML layout datoteka koja je dola zajedno sa SDK-om, tj. unaprijed je kreirana (slino
kao kada programer sam kreira layout datoteku). Kao prvi se parametar alje Context. Nakon
to se kreirao, adapter se alje u ListView. Pokretanjem aplikacije trebalo bi se dobiti sljedee:
Slika 99. ListView sa stavkama gradova
99

Ukupno postoji deset stavki, ali se trenutno prikazuje samo osam. Pokretom prsta prema gore korisnik moe pomaknuti listu i prikazat e se preostale dvije stavke. esto
se aplikacije kreiraju tako da se klikom na jednu stavku liste, otvori detaljan prikaz te
stavke. Kako bi se to postiglo, mora se postaviti OnItemClickListener na ListView koji e
sluati korisnikovu interakciju s ListViewom, tj. sluat e je li korisnik pritisnuo stavku i
koja je to stavka.
import
import
import
import
import
import
import
import
android.os.Bundle;
android.view.View;
android.widget.AdapterView;
android.widget.AdapterView.OnItemClickListener;
android.widget.ArrayAdapter;
android.widget.Toast;

@Override
listView.setAdapter(adapter);
listView.setOnItemClickListener(new OnItemClickListener() {
@Override
public void onItemClick(AdapterView<?> parent, View view, int
position, long id) {
Toast.makeText(MainActivity.this,
"Pritisnuta je stavka pod rednim brojem:" +
position, Toast.LENGTH_LONG).show();
}
});
}
}
Primjer 82. Postavljanje OnItemClickListener na ListView
U OnItemClick() metodi rukuje se pritiskom na stavku u ListViewu. Position parametar govori

koji je redni broj u listi pritisnut. Ako se pritisne lista koja je odozgora trea po redu, position
parametar e vratiti broj 2 (indeksiranje stavki poinje od 0). Moe se primijetiti i Toast klasa.
Toast klasa je klasa koja prikazuje kratke poruke koje iskoe na ekranu. Toast poruka je vidljiva
i u sljedeem primjeru:
100
Slika 100. ListView koji reagira na pritisak korisnika
U izradi aplikacije pritisak na ListItem stavku obrauje se (engl. handle) tako da se poziva neka
aktivnost koja e detaljno prikazati tu stavku. Dakle, instancira se Intent objekt, u njega se stavljaju svi potrebni podatci o stavci te se poziva nova aktivnosti koja dalje obrauje i prikladno
prikazuje te podatke. No najee programer mora kreirati vlastiti adapter koji ima jedinstveni
prikaz podataka. Za to se nasljeuje ve gotova implementacija Adapter klase ili BaseAdapter
klasa.
Veoma se esto za prikaz stavki u ListViewu koriste objekti, a ne samo lista Stringova. BaseAdapter omoguava prikaz elemenata iz objekta, ali i definiranje prilagoenog izgleda svih stavki u ListViewu. Za primjer e se kreirati klasa hotel.
import java.io.Serializable;
public class Hotel implements Serializable{
private String naziv;

private String datum;
private String opis;
public String getNaziv() {
return this.naziv;
}
public void setNaziv(String naziv) {
this.naziv = naziv;
}
public String getDatum() {
return this.datum;
}
public void setDatum(String datum) {
this.datum = datum;
}
public String getOpis() {
return this.opis;
}
public void setOpis(String opis) {
this.opis = opis;
}
Primjer 83. Klasa Hotel
101

Ova klasa implementira suelje Serializable. Kada klasa nasljeuje neko suelje, ujedno poprima
i taj tip. Dakle, kada se instancira objekt hotel, bit e tipa Hotel, ali i tipa Serializable. Serijalizacija objekta je proces u kojemu se objekt reprezentira kao niz bajtova koji sadre sve podatke
o objektu. Serijalizacija je vrlo korisna ako se koriste razliite platforme u kojoj je jedna pisana
u Javi, a druga npr. u C++. Java i C++ ne mogu meusobno komunicirati ako si alju objekte, a
mogu ako si alju niz bajtova jer bajtove mogu itati sve platforme. Ako se u Javi neki objekt
serijalizira i zapie u neku datoteku, u C++ se moe proitati datoteka i deserijalizirati sadraj u
objekt. Taj objekt e biti isti objekt koji je poslan iz Java platforme.
Intent objekt moe u sebi sadravati Bundle objekt. Bundle objekt se moe opisati kao objekt u
koji se spremaju podatci razliitog tipa: String, int, long i sl. Nezgodno bi rjeenje bilo kada bi se
atribut svakog objekta morao spremati posebno u Bundle objekt.
Hotel hotel = new Hotel();
hotel.setNaziv("Hotel Osijek");
hotel.setDatum("10.3.2009");
hotel.setOpis("Opis hotela Osijek");
Bundle bundle = new Bundle();
bundle.putString("naziv_hotela", hotel.getNaziv());
bundle.putString("datum_hotela", hotel.getDatum());
bundle.putString("opis_hotela", hotel.getOpis());
Primjer 84. Postavljanje vrijednosti u Bundle objekt
Ovakvo rjeenje nije pogrjeno, ali je nepraktino ako objekt ima puno atributa. Bundle objekt
nudi rjeenje, metodu putSerializable(). U ovu se metodu alje objekt tipa Serializable, a budui
da objekt Hotel implementira suelje Serializable, znai da je tipa Serializable i da se moe poslati u ovu metodu.
Hotel hotel = new Hotel();
hotel.setNaziv("Hotel Osijek");
hotel.setDatum("10.3.2009");
hotel.setOpis("Opis hotela Osijek");
bundle.putSerializable("hotel", hotel);
Primjer 85. Postavljanje serijaliziranog objekta u Bundle objekt
Sljedei je korak instanciranje nekoliko objekata tipa Hotel i smjetanje u listu. Ta se lista alje u
vlastiti adapter koji e se kasnije kreirati.
102
import
import
import
import
import
import
import
import
import
java.util.ArrayList;
java.util.List;
android.os.Bundle;
android.view.View;
android.widget.AdapterView;
android.widget.AdapterView.OnItemClickListener;
android.widget.Toast;

@Override
Hotel hotel1 = new Hotel();
hotel1.setNaziv("Hotel Osijek");
hotel1.setDatum("10.3.2009");
hotel1.setOpis("Opis hotela Osijek");
hotel2.setNaziv("Hotel Zagreb");
hotel2.setOpis("Opis hotela Zagreb");
hotel3.setNaziv("Hotel Vukovar");
hotel3.setOpis("Opis hotela Vukovar");
hotel4.setNaziv("Hotel Split");
hotel4.setOpis("Opis hotela Split");
hotel5.setNaziv("Hotel Dubrovnik");
hotel5.setOpis("Opis hotela Dubrovnik");
List<Hotel> hoteli = new ArrayList<Hotel>();
hoteli.add(hotel1);
hoteli.add(hotel2);
hoteli.add(hotel3);
hoteli.add(hotel4);
hoteli.add(hotel5);
HotelAdapter hotelAdapter = new HotelAdapter(this, hoteli);

listView.setAdapter(hotelAdapter);
Primjer 86.. Popunjavanje liste, instanciranje adaptera i popunjavanje ListViewa
103

Zanimljivo je da adapter omoguava kreiranje izgleda svakog elementa u listi. To se, kao i sve
ostalo, definira kroz XML. Npr. ako element u listi izgleda ovako:
Slika 101. Primjer izgleda stavke ListViewa
vrlo ga je lako definirati u XMLu. U res/layout/ direktoriju se kreira nova XML datoteka. Nazvat
emo ju hotel_list_item.xml.
android:layout_height="50dp" >
<TextView
android:id="@+id/hotelName"
android:layout_alignParentLeft="true"/>
<TextView
android:id="@+id/hotelDate"
android:layout_alignParentRight="true"/>
</RelativeLayout>
Primjer 87. Definiranje XML layouta za izgled stavke ListViewa
Kreira se HotelAdapter koji nasljeuje BaseAdapter klasu.
104
import java.util.List;
import
import
import
import
import
import
android.content.Context;
android.view.LayoutInflater;
android.view.View;
android.view.ViewGroup;
android.widget.BaseAdapter;
android.widget.TextView;
public class HotelAdapter extends BaseAdapter{

private List<Hotel> hoteli;
private Context context;
private LayoutInflater inflater;
public HotelAdapter(Context context, List<Hotel> hoteli) {
this.hoteli = hoteli;
this.context = context;
this.inflater = LayoutInflater.from(context);
}
@Override
public int getCount() {
return hoteli.size();
}
@Override
public Object getItem(int position) {
return hoteli.get(position);
}
@Override
public long getItemId(int position) {
return hoteli.indexOf(hoteli.get(position));
}
@Override
public View getView(int position, View convertView, ViewGroup parent) {
if(convertView == null){
convertView = inflater.inflate(R.layout.hotel_list_item, parent,
false);
}
TextView hotelName = (TextView)convertView.findViewById(R.id.hotelName);
TextView hotelDate = (TextView)convertView.findViewById(R.id.hotelDate);
hotelName.setText(hoteli.get(position).getNaziv());
hotelDate.setText(hoteli.get(position).getDatum());
return convertView;
Primjer 88. Kreiranje vlastitog adaptera
U ovom je primjeru kreiran konstruktor koji kao parametre prima Context i List<Hotel> listu.
Pomou Contexta dohvaa se objekt LayoutInflater koji slui za uitavanje XML layout datoteka.
105

List<Hotel> je lista hotela koja je instancirana u primjeru iznad. Kada se nasljeuje BaseAdapter,
implementiraju se 4 metode:
a)
getCount()
b)
getItem()
c)
getItemId()
d)
getView()
U getCount() metodi vraa se broj elemenata u listu kako bi ListView znao koliko stavki postoji. U
getItem() metodi vraa se objekt iz liste po trenutnoj poziciji. Dakle, ako je na poziciji 1 hotel Hotel Zagreb, ovdje se vraa taj objekt. U getItemId() metodi vraa se indeks objekta u listi. Najvanija je metoda u adapteru getView() metoda. Ova metoda prolazi kroz svaki element ListViewa
i za svaki element uitava layout XML datoteku. U ovom sluaju uitava hotel_list_item.xml
datoteku. ConvertView parametar je element iz ListViewa u koji se uitava XML layout. Ovdje
se provjerava je li element jednak null vrijednosti. Ako je element razliit od null, XML layout je
ve uitan i nema potrebe opet ga uitavati. Nakon toga se dohvaaju elementi iz layout XML-a
i popunjavaju se vrijednosti s atributima objekata koji se nalaze u List<Hotel> listi. Metoda vraa
prilagoeni convertView objekt.
Slika 102. ListView s vlastitim adapterom
Sada se moe kreirati onClickListener koji e sluati klik na stavku ListViewa. Kada se klikne stavka u ListViewu, dohvatit e se objekt koji se nalazi na tom mjestu, stavit e ga u Intent objekt i
pokrenut e novu aktivnost koja e prikazati detaljan opis hotela.
106

@Override
hotel1.setNaziv("Hotel Osijek");
hotel1.setOpis("Opis hotela Osijek");
hotel2.setNaziv("Hotel Zagreb");
hotel2.setOpis("Opis hotela Zagreb");
hotel3.setNaziv("Hotel Vukovar");
hotel3.setOpis("Opis hotela Vukovar");
hotel4.setNaziv("Hotel Split");
hotel4.setOpis("Opis hotela Split");
hotel5.setNaziv("Hotel Dubrovnik");
hotel5.setOpis("Opis hotela Dubrovnik");
List<Hotel> hoteli = new ArrayList<Hotel>();
hoteli.add(hotel1);
hoteli.add(hotel2);
hoteli.add(hotel3);
hoteli.add(hotel4);
hoteli.add(hotel5);
HotelAdapter hotelAdapter = new HotelAdapter(this, hoteli);
listView.setAdapter(hotelAdapter);
listView.setOnItemClickListener(new OnItemClickListener() {
});
@Override
public void onItemClick(AdapterView<?> parent, View view, int position,
long id) {
Hotel hotel = (Hotel)parent.getItemAtPosition(position);
bundle.putSerializable("hotel", hotel);
HotelDetailsActivity.class);
intent.putExtras(bundle);
}
Primjer 89. Postavljanje OnItemClickListenera na ListView
107

Zapisuje se klasa HotelDetailsActivity koja nasljeuje Activity klasu u manifest.
import android.widget.TextView;
public class HotelDetailsActivity extends Activity{
private Hotel hotel;
@Override
setContentView(R.layout.activity_hotel_details);
hotel = (Hotel)getIntent().getSerializableExtra("hotel");
TextView hotelName = (TextView) findViewById(R.id.hotelName);
hotelName.setText(hotel.getNaziv());
TextView hotelDate = (TextView) findViewById(R.id.hotelDate);
hotelDate.setText(hotel.getDatum());
TextView hotelDescription = (TextView) findViewById

(R.id.hotelDescription);
hotelDescription.setText(hotel.getOpis());
Primjer 90. Kreiranje HotelDetailsActivity klase
Dakle, kada se klikne na stavku u ListViewu, bira se objekt Hotel koji se zapakira u Bundle
objekt, a Bundle objekt se postavlja u Intent objekt. Nova se aktivnost pokree pomou
tog Intent objekta. Kada se aktivnost pokrene, Intent objekt se dohvaa u onCreate()
metodi. U Intent objektu se trai objekt Hotel pomou metode getSerializableExtra() i
alje mu se ID po kojem e traiti taj objekt. Nakon toga se vrijednosti TextViewa, koje
se nalaze u layoutu aktivnost, postavljaju na vrijednosti koje se dobiju iz atributa hotel
objekta. Klikom na stavku u ListViewu, koja u sebi sadri naziv Hotel Osijek i datum
10.3.2009., pokree se aktivnost koja prikazuje detalje o hotelu kao na sljedeoj slici.
Slika 103. HotelDetalsActivity aktivnost
Android framework prua mogunost definiranja ListActivity aktivnosti. Koritenjem

ove aktivnosti nije potrebno definirati XML layout datoteku. ListActivity u sebi ve sadri
ListView s IDem android.R.id.list kojemu se moe pristupati u samoj aktivnosti.
108
import android.app.ListActivity;
import android.widget.ArrayAdapter;
public class MainActivity extends ListActivity {
@Override
setListAdapter(adapter);
Primjer 91. Kreiranje ListActivity aktivnosti
Slino kao i u primjeru iznad, definira se lista Stringova koja e se prikazivati u ListViewu.
Nije potrebno dohvaati ListView objekt jer ListActivity u sebi ve sadri ListView objekt
pa se adapter moe postaviti jednostavnim pozivanjem metode setListAdaper().
ZADATAK 21
Kreiraj klasu Vijest koja sadri atribute: Naslov, Datum i Opis. Zatim kreiraj ListActivity u kojem e
kreirati 6 razliitih objekata Vijest i prikai ih u listi. Kreiraj adapter koji nasljeuje BaseAdapter i
proizvoljan izgled XML layouta za stavke unutar liste. Pritisak na stavku unutar liste pokree novu
aktivnost koja prikazuje detaljan prikaz vijesti s naslovom, datumom i opisom.
5.12. Action Bar

Android je od Android OS3.0 (API 11) preuzeo Action Bar. Action Bar je zamijenio standardni
TitleBar i od tada je postao vrlo vana komponenta svake aplikacije. Action Bar slui za prikaz
Home ikone (neto slino kao Home kod internetskih stranica), za prikazivanje menija i navigacije. Standardni Options meni izbaen je i umjesto njega se koristi meni Action Bara.
Slika 104. Action Bar
Na slici 104. crveno oznaeni dio predstavlja Action Bar. Action Bar pokupi Launcher ikonu i
koristi ju kao svoju Home sliku. Home ikoni i menu ikoni se pristupa pomou onOptionsItemSelected() metode. Najee se u toj metodi radi switch naredba koja provjerava id element koji je
109

pritisnut, a nakon toga izvrava neku naredbu. Kako bi se kreirao menu u Action Baru, kreira se
menu layout datoteka. Ako ne postoji, u projektu se kreira menu direktorij, a u direktoriju npr.
main.xml datoteka. Menu e za poetak imati jedan gumb koji se naziva Settings.
<menu xmlns:android="http://schemas.android.com/apk/res/android" >
<item
android:id="@+id/action_settings"
android:showAsAction="ifRoom"
android:title="@string/action_settings"/>
</menu>
Primjer 92. Menu s jednim gumbom
Menu ima jedan gumb, a u layout datoteci se oznaava elementom <item>. Dodaje mu se id
kako bi se mogao identificirati pritisak na njega i String vrijednost koja je vidljiva korisniku.
Atribut showAsAction i njegova vrijednost ifRoom ukazuju da e Android prikazati ovaj gumb
u Action Baru ako ima mjesta, a ako mjesta nema, prikazat e ga u klasinom Options meniju.
Postoji nekoliko vrijednosti ovog atributa koje se mogu postaviti kao to su never, a znai da
se gumb nee nikada prikazati u Action Baru i uvijek e biti u klasinom meniju, ili always, a
oznaava da se gumb uvijek prikazuje u Action Baru. Always nije preporuljiv jer ponekad ne
mogu stati svi elementi zbog razliitih veliina ureaja pa moe doi do neeljenog ponaanja
aplikacije. Postoji jo nekoliko vrijednosti koje za sada neemo spominjati.
Slika 105. Prikaz menija s atributom ifRoom
Slika 106. Prikaz menija s atributom never
Sada se u aktivnosti uitava meni. Kada se meni prikazuje, aktivnost poziva onCreateOptionsMenu() metodu i ukazuje na layout datoteku koju treba prikazati. To se postie
tako da se u metodi dohvati MenuINflater objekt i pomou njegove se metode inflater
ukae na layout datoteku menija.
110
@Override
public boolean onCreateOptionsMenu(Menu menu) {
MenuInflater inflater = getMenuInflater();
inflater.inflate(R.menu.main, menu);
}
return super.onCreateOptionsMenu(menu);
Primjer 93. Uitavanje menija
Ako se projekt pokrene, trebala bi se prikazati aktivnost kao na slici 107. Klik na ovaj gumb moe
se definirati na sljedei nain: aktivnost sadri metodu onOptionsItemSelected() koja otkriva koji
se gumb pritisnuo, a nakon toga se moe pokrenuti neka odreena metoda ili pokrenuti nova
aktivnost i sl.
@Override
public boolean onOptionsItemSelected(MenuItem item) {
switch (item.getItemId()) {
case R.id.action_settings:
//Pokretanje nove aktivnosti
break;
default:
break;
}
return super.onOptionsItemSelected(item);
Primjer 94. Rukovanje odabira elemenata u meniju
Dakle, metoda u parametrima alje element menija koji se pritisnuo i u metodi se provjerava id
tog elementa. Ako je id action_settings, korisnik je pritisnuo tipku Settings i moe se pokrenuti
odreena akcija kao npr. otvaranje Settings aktivnosti. Dakle, za elemente menija programer
sam definira id-eve. Za Home element Action Bara id je uvijek isti i tom se elementu pristupa
preko id-a android.R.id.home. U istoj se switch naredbi u jedan sluaj moe staviti android.R.id.
home vrijednost i tada se pokree odreena akcija. Home element Action Bara koristi se za
navigaciju unazad. To se moe npr. napraviti u SettingsActivity aktivnosti koja e se pokrenuti
preko menija Settings. Kada se pritisne na meni element Settings, pokrenut e se nova aktivnost
SettingsActivity koja u svojoj onCreate() metodi postavlja prikaz Home elementa kao navigaciju
unazad. To se postie tako da se dohvati ActionBar i pozove metoda setDisplayHomeAsUpEnabled().
111
import android.view.MenuItem;
public class SettingsActivity extends Activity {
@Override
}
getActionBar().setDisplayHomeAsUpEnabled(true);
@Override
case android.R.id.home:
onBackPressed();
break;
}
Primjer 95. Postavljanje Home elementa kao navigaciju unazad
Nakon to se izgled Home elementa postavio kao navigacija unazad, definira se to e raditi
pritisak na Home element Action Bara. Kao i u proloj aktivnosti, u metodi se onOptionsItemSelected() preko switch naredbe otkriva id pritisnutog elementa. Ako je id jednak id-u Home
elementa, poziva se metoda koja e se vratiti u prolu aktivnost onBackPressed(). Action Bar
slui i za navigaciju kroz aplikaciju. Postoji nekoliko naina navigacije pomou Action Bara, a
najei je navigacija kroz tabove. Da bi se ostvarila takva navigacija, dohvaa se Action Bar
objekt i postavlja mu tip navigacije NAVIGATION_MODE_TABS. Zatim se kreiraju tabovi kojima
se prosljeuje listener koji e sluati pritisak na tabove. Listener se najee implementira na
aktivnost. Zatim se tabovi dodaju u ActionBar. Tako je npr. u prvoj aktivnosti mogue kreirati
tabove u onCreate() metodi.
112
@Override
public void onCreate(Bundle savedInstanceState) {
ActionBar actionBar = getActionBar();
actionBar.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS);
Tab tab1 = actionBar.newTab();
tab1.setText("Tab 1");
tab1.setTabListener(this);
Tab tab2= actionBar.newTab();
getActionBar().addTab(tab1);
Primjer 96. Kreiranje tabova kao tipove navigacije
Aktivnost treba implementirati TabListener suelje. Implementiraju se tri metode: onTabReselected(), onTabSelected(), onTabUnselected().
113
import android.app.ActionBar;
import android.app.ActionBar.Tab;
import android.app.ActionBar.TabListener;
import android.app.FragmentTransaction;
import android.content.Intent;
import android.hardware.Camera;
import android.view.Menu;
import android.view.MenuInflater;
import android.view.MenuItem;
public class MainActivity extends Activity implements TabListener{
@Override
}
@Override
}
@Override
Intent intent = new Intent(this, SettingsActivity.class);
break;
default:
break;
}
}
@Override
public void onTabReselected(Tab tab, FragmentTransaction ft) {
}
@Override
public void onTabSelected(Tab tab, FragmentTransaction ft) {
// implementacija koda kada se pritisne tab
}
@Override
public void onTabUnselected(Tab tab, FragmentTransaction ft) {
}
Primjer 97. Klasa s Tab navigacijom
114

Najee se tab navigacija kombinira s fragmentima tako da se kreira poseban fragment za svaki
tab i ovisno o tome koji je tab pritisnut, uitava se njegov fragment.
Slika 107. Action Bar s tab navigacijom
Sadraj se svakog taba najee sastoji od jednog fragmenta. Na onTabSelected() metodi uitava se odreeni fragment u prazan prostor aktivnosti. Za svaki se tab kreira po
jedan fragment sa svojom layout datotekom. U onTabSelected() metodi se pomou FragmentTransaction objekta izmjenjuju fragmenti na tom praznom prostoru. Fragmenti
zahtijevaju da im se preko id-a pokae gdje se moraju pojaviti. U ovom se sluaju trebaju
pojaviti u praznom prostoru ispod tabova iji je id:
android.R.id.content
FragmentTransaction objekt poziva metodu koja e maknuti jedan fragment remove(),

a zatim dodati i drugi fragment metodom add(). Moe pozvati metodu replace() koja
obavlja oboje istovremeno.
115
public class MainActivity extends Activity implements TabListener{

@Override
}
@Override
}
@Override
Intent intent = new Intent(this, SettingsActivity.class);
break;
default:
break;
}
}
@Override
public void onTabReselected(Tab tab, FragmentTransaction ft) {
}
@Override
public void onTabSelected(Tab tab, FragmentTransaction ft) {
if(tab.getText().equals("Tab 1")){
Tab1Fragment fragment1 = new Tab1Fragment();
ft.replace(android.R.id.content, fragment1);
} else if(tab.getText().equals("Tab 2")){
Tab2Fragment fragment2 = new Tab2Fragment();
ft.replace(android.R.id.content, fragment2);
}
}
@Override
public void onTabUnselected(Tab tab, FragmentTransaction ft) {
}
Primjer 98. Main Activity s izmjenom fragmenata u tabovima
116

Pritiskom na tab dohvati se text taba i ako je text jednak prvom tabu, instancira se novi Tab1Fragment. FragmentTransaction objekt poziva metodu replace() kojoj se nareuje da na mjesto
android.R.id.contet stavi fragment1. Isto vrijedi i za drugi tab.
Slika 108. Odabrani Tab1
Slika 109. Odabrani Tab2
5.13. Android SQLite baza podataka

U izradi je sloenijih sustava ili aplikacija nuno imati bazu podataka koja se nalazi na samom
ureaju. Android prua nekoliko naina spremanja korisnikih i aplikacijskih podataka, a jedan
od njih je i SQLite. SQLite je osnovna baza podataka s minimalnim funkcionalnostima i jedna je
od najee koritenih baza podataka na mobilnim ureajima. Podrava znaajke standardnih
relacijskih baza kao to su SQL sintaksa, transakcije i pripremljeni iskazi, a zahtjeva vrlo malo
memorije prilikom izvoenja. Podrava TEXT (String), INTEGER (int) i REAL (double) tipove podataka. Ova se baza podataka sprema kao jedna datoteka u Android ureaj. Poznavatelj SQL baze
podataka i sintakse moe s lakoom savladati SQLite sintaksu.
Slijedi kratak osvrt na relacijske baze podataka. Baza podataka je strukturni nain spremanja podataka u tablice. Tablica sadri stupce za razliite tipove podataka i retke za cjelokupni podatak.
U smislu OOP, redak u tablici predstavlja objekt, a svaki stupac atribut objekta. Npr. ako postoji
objekt Osoba s atributima ime(String), prezime(String) i dob(int), moe se kreirati tablica Osoba
sa stupcima ime(TEXT), prezime (TEXT) i dob(INTEGER).
117
Slika 110. Odnos atributa objekta i stupaca u tablici
SQLite baza podataka se sastoji od vie tablica. U ovom je sluaju tablica Osoba samo
jedna tablica u bazi podataka pod nazivom Osoba. Za rad s Android bazom podataka
kreira se klasa koja e naslijediti SQLiteOpenHelper klasu. U ovom je sluaju to AndroidSQLiteOpenHelper klasa koja e brinuti o kreiranju baze podataka. Kada se instancira
objekt iz te klase, automatski se kreira baza podataka pod definiranim imenom (ako
baza ve ne postoji). Ako baza ve postoji, baza se nee kreirati. Ova e klasa vraati
referencu na tu bazu podataka, pobrinut e se da se kreira baza podataka (ako baza ve
ne postoji) i da se zatvara i otvara konekcija na tu bazu podataka.
118
import
import
import
import
android.content.Context;
android.database.sqlite.SQLiteDatabase;
android.database.sqlite.SQLiteOpenHelper;
android.util.Log;
public class AndroidSQLOpenHelper extends SQLiteOpenHelper{

public
public
public
public
public
static
static
static
static
static
final
final
final
final
final
String
String
String
String
String
TABLE_PERSON = "person";
COLUMN_ID = "id";
COLUMN_FIRST_NAME = "first_name";
COLUMN_LAST_NAME = "last_name";
COLUMN_AGE = "age";
private static final String DATABASE_NAME = "TutorialDatabase";

private static final int DATABASE_VERSION = 1;
private static final String TABLES_CREATE = "create table " + TABLE_PERSON
+ " (" + COLUMN_ID + " integer primary key autoincrement, " + COLUMN_FIRST_NAME +
" text not null, " + COLUMN_LAST_NAME + " text not null, " + COLUMN_AGE + "
integer not null);";
public AndroidSQLOpenHelper(Context context) {
super(context, DATABASE_NAME, null, DATABASE_VERSION);
}
@Override
public void onCreate(SQLiteDatabase db) {
db.execSQL(TABLES_CREATE);
}
@Override
public void onUpgrade(SQLiteDatabase db, int oldVersion, int newVersion) {
Log.w("DATABASE", "Upgrading database from version " + oldVersion + "
to " + newVersion + "which will destroy all data");
db.execSQL("DROP TABLE IF EXISTS " + TABLE_PERSON);
onCreate(db);
}
}
Primjer 99. Android SQLiteOpenHelper klasa
Sljedei je korak kreiranje klase koja e brinuti o unosu, itanju i auriranju podataka u bazi.
Ta e se klasa zvati PersonDataSource. U konstruktoru se te klase kreira objekt iz AndroidSQLiteOpenHelpera koji odmah provjerava je li baza kreirana i ako nije, kreira ju. Postoje i druge
metode, tj. metode open() i close() koje od AndroidSQLiteOpenHelper objekta trae konekciju
na bazu, tj. spajanje na bazu i odspajanje s baze. Ova je klasa takoer zaduena za rukovanje
s unosom, itanje i auriranje podataka u tablice. Strukture su ovih dviju klasa takve da kada
se provode izmjene na tablicama, nije potrebno provjeravati dohvaanje konekcije na bazu,
postojanje baza podataka, prekidanje konekcije s bazom, i sl. jer je sve odraeno pozadinski
u AndroidSQLiteOpenHelper klasi. Na taj su nain postavljeni temelji za rad s bazama podataka. U PersonDataSource se kreiraju metode koje e, ovisno o potrebama aplikacije, provoditi
odreene manipulacije na tablicama: upisivanje u bazu, itanje iz baze, pretraivanje osobe po
nazivu itd. Baza se kreira u konstruktoru klase, a cijelu zadau kreiranja baze preuzima nadklasa.
119

Pozivanjem njenog konstruktora pomou super.onCreate() metode vraa se kreirana baza podataka u koju se kreiraju potrebne tablice. Na bazi se zatim mogu pokretati odreene naredbe, a u ovom se sluaju pokree naredba za kreiranje Person tablice. Moe se implementirati i
onUpgrade() metoda za auriranje baze u kojoj se stara baza brie i kreira nova baza.
public class PersonDataSource {
private SQLiteDatabase database;
private AndroidSQLOpenHelper dbHelper;
private String[] allColumns = {AndroidSQLOpenHelper.COLUMN_ID,
AndroidSQLOpenHelper.COLUMN_FIRST_NAME, AndroidSQLOpenHelper.COLUMN_LAST_NAME,
AndroidSQLOpenHelper.COLUMN_AGE};
public PersonDataSource(Context context) {
dbHelper = new AndroidSQLOpenHelper(context);
}
public void open(){
database = dbHelper.getWritableDatabase();
}
public void close(){
dbHelper.close();
}
public Person insertPerson(Person person){
ContentValues values = new ContentValues();
values.put(AndroidSQLOpenHelper.COLUMN_FIRST_NAME, person.getFirstName());
values.put(AndroidSQLOpenHelper.COLUMN_LAST_NAME, person.getLastName());
values.put(AndroidSQLOpenHelper.COLUMN_AGE, person.getAge());
database.insert(AndroidSQLOpenHelper.TABLE_PERSON, null, values);
return person;
}
public List<Person> readPersons(){
List<Person> persons = new ArrayList<Person>();
Cursor cursor = database.query(AndroidSQLOpenHelper.TABLE_PERSON, allColumns,
null, null, null, null, null);
cursor.moveToFirst();
while(!cursor.isAfterLast()){
Person person = new Person();
person.setFirstName(cursor.getString(1));
person.setLastName(cursor.getString(2));
person.setAge(cursor.getInt(3));
persons.add(person);
}
return persons;
}
}
person.setFirstName(cursor.getString(1));
person.setLastName(cursor.getString(2));
person.setAge(cursor.getInt(3));
persons.add(person);
cursor.moveToNext();
}
cursor.close();
return persons;
Primjer 100. PersonDataSource klasa
120

Unos podataka o objektu tipa Person unosi se tako da se poalje objekt tipa Person u tu metodu
i zatim se svi atributi objekta Person upisuju u tablicu Person. Dakle, atribut firstName(String)
upisuje se u stupac firstName(TEXT), atribut lastName(String) u stupac lastName(TEXT) i atribut
age(String) u stupac age(TEXT). Moe se primijetiti da se prilikom kreiranja tablice stvorio jo jedan stupac naziva id (int primary key autoincrement). Svaki bi redak u tablici trebao imati identifikator, tj. jedinstveni broj koji je razliit za svaki redak. Identifikatorom se moe jedinstveno
raspoznati svaki redak u tablici. Primary key podrazumijeva da e stupac predstavljati jedinstvene identifikator, a autoincrement da e se svakim unosom u tablicu, u stupcu automatski generirati broj, tj. prilikom zapisa e inkementirati zadnji broj za 1 i zapisati ga u bazu u tom retku.
Postavlja se pitanje zato bi se id uope koristio? Zamislite da postoje dvije osobe koje imaju isto
ime i 25 godina (Marko Markic, 25 godina). Bez jedinstvenog se identifikatora ne mogu nikako
raspoznati. Npr. ako se Marku Markicu, koji je prvi unesen, ele promijeniti godine, bez jedinstvenog se identifikatora ne moe odrediti na kojem se Marku Markicu eli izvriti izmjena. Tada
se izmjena radi po id-u. Dakle, provodi se izmjena na unosu koji ima id npr. 4 i tom se unosu eli
promijeniti stupac age.
U konstruktoru klase kreira se i AndroidSQLOpenHelper objekt koji je zaduen kreirati bazu ako
nije kreirana. S open() i close() se otvara i zatvara konekcija na bazu podataka. Ako se eli unijeti podatak u tablicu, podatci se stavljaju u ContentValues objekt u koji se ubacuju vrijednosti
pomou metode put(). Metoda put u prvi parametar prima naziv stupca, a u drugi vrijednosti
kako bi baza podataka znala u koji stupac treba upisati koju vrijednost. Tada se pomou SQLiteDatabase objekta i metode insert() ubacuju vrijednosti u definiranu tablicu.
Kada se vrijednosti iz tablice itaju, upit vraa Cursor objekt. Query() metoda definira tablicu
koja se eli itati i polje stupaca koji su definirani u varijabli allColumns. Cursor objekt se moe
shvatiti kao pokaziva retka u tablici. Kada baza podataka vrati Cursor objekt, objekt je prvo na
mjestu iznad prvog unosa i treba ga pomaknuti na prvi unos pomou metode moveToFirst().
Na slici 3.12.2. prvi redak sadri nazive stupaca koji se ne itaju kao podatak. Nazivi stupaca su
ovdje samo radi primjera. Dakle, Cursor pokazuje na redak iznad prvog retka, pokazuje negdje
iznad retka Pero Peri 23.
Slika 111. Prvotna pozicija Cursor objekta
Nakon toga se ulazi u while petlju koja provjera je li trenutni unos zadnji unos u tablici. U
tijelu se while petlje, nakon proitane tablice i kreiranog objekta Person, ubacuje objekt
u listu objekata te se Cursor objekt pomie za jedan unos prema dolje. Person objekt je
jednostavan objekt koji sadri podatke o nekoj osobi.
121
public class Person {
private String firstName;
private String lastName;
private int age;
public String getFirstName() {
return firstName;
}
public void setFirstName(String firstName) {
this.firstName = firstName;
}
public String getLastName() {
return lastName;
}
public void setLastName(String lastName) {
this.lastName = lastName;
}
public int getAge() {
return age;
}
public void setAge(int age) {
this.age = age;
}
}
Primjer 101. Person klasa
Za potrebe testiranja kreirana je aktivnost koja ima 3 EditText viewa u koja se unosi
ime, prezime i dob osobe. Klikom na gumb Unesi osobu upisuju se podatci u bazu, a
klikom na gumb Pregled osoba itaju se sve osobe iz baze i uitavaju se u listu pomou
vlastitog adaptera.
Slika 112. Aktivnost unosa podataka o osobi
Prvo se izrauje par unosa da bi se neto upisalo u bazu. Upisani se unosi mogu vidjeti
u sljedeoj aktivnosti. Nakon to se unijelo par osoba, pritie se na gumb Pregled
122

osoba to pokree novu aktivnost koja ita sve podatke iz baze i prikazuje ih u listi.
import
import
import
import
import
import
import
import
android.content.Intent;
android.gauss.androidtuorial.R;
android.os.Bundle;
android.view.View;
android.view.View.OnClickListener;
android.widget.Button;
android.widget.EditText;

private
private
private
private
private
private
PersonDataSource dataSource;
EditText firstName;
EditText lastName;
EditText age;
Button insertPerson;
Button personOverview;
@Override
dataSource = new PersonDataSource(MainActivity.this);
firstName = (EditText) findViewById(R.id.firstName);
lastName = (EditText) findViewById(R.id.lastName);
age = (EditText) findViewById(R.id.age);
insertPerson = (Button)findViewById(R.id.insertPerson);
insertPerson.setOnClickListener(new OnClickListener() {
@Override
person.setFirstName(firstName.getText().toString());
person.setLastName(lastName.getText().toString());
person.setAge(Integer.parseInt(age.getText().toString()));
dataSource.open();
dataSource.insertPerson(person);
dataSource.close();
}}
}
});
personOverview = (Button) findViewById(R.id.readPersons);
personOverview.setOnClickListener(new OnClickListener() {
@Override
ActivityPersonList.class);
}
});
Primjer 102. Aktivnost za unos podataka u bazu
123

U onCreate() metodi kreira se novi objekt PersonDataSource kako bi baza uvijek bila spremna
na upise. Pritiskom gumba insertPerson otvara se konekcija na bazu, unosi se objekt Person i
zatvara se konekcija na bazu. Postoji i gumb personOverview koji vodi na ListActivity koja ita
sve osobe iz baze, stavlja ih u adapter i prikazuje ih u listi.
import android.app.ListActivity;
import android.util.Log;
public class ActivityPersonList extends ListActivity{
private PersonDataSource datasource;
private List<Person> persons;
@Override
}
@Override
super.onResume();
datasource = new PersonDataSource(this);
datasource.open();
persons = datasource.readPersons();
datasource.close();
PersonsAdapter adapter = new PersonsAdapter(this, persons);

Primjer 103. itanje podataka iz baze i uitavanje u listu
Slika 113. Popis svih osoba iz baze
124
ZADATAK 22
Napravi klasu Vijest koja ima atribute naslov, opis i datum. Napravi aktivnost za unos
vijesti u bazu i aktivnost koja u listi ispisuje sve vijesti.
5.14. Koritenje senzora

Android Framework omoguava koritenje velikog broja senzora koje ureaji imaju. Neki senzori su hardverski, a neki softverski. Hardverski su senzori fizike komponente koje su ugraene
u ureaj i mjere odreeno stanje u okolini kao to su: akceleracija, magnetsko polje, kut pod
kojim je ureaj okrenut i sl. Softverski senzori nisu fizike komponente ureaja, a svoje podatke
mjere pomou jednog ili vie hardverskih senzora. To moe biti linearna akceleracija, gravitacija
itd. Nemaju svi ureaji sve senzore tako da je koritenje senzora razliito od ureaja do ureaja.
Kada se radi sa senzorima, od OS-a se trai SensorManager. SensorManager je objekt koji zna
sve senzore kojima ureaj raspolae. Od SensorManager objekta se trai senzor koji se eli koristiti (akceleormetar, iroskop, magnet, tlakomjer itd.). Nakon toga se poruuje SensorManageru
da se ele pratiti promjene na odabranom senzoru, a postie se metodom registerListener().
Metoda kao prvi parametar prima SensorEventListener klasu. Budui da e SensorEvenetListener klasa biti trenutna aktivnost, implementira e se SensorEventListener i potrebne metode.
125
public class MainActivity extends Activity implements SensorEventListener{

private
private
private
private
private
SensorManager sManager;
Sensor accelerometer;
TextView xAxis;
TextView yAxis;
TextView zAxis;
@Override
sManager = (SensorManager) getSystemService(Context.SENSOR_SERVICE);
accelerometer = sManager.getDefaultSensor(Sensor.TYPE_ACCELEROMETER);
xAxis = (TextView) findViewById(R.id.xAxis);

yAxis = (TextView) findViewById(R.id.yAxis);
zAxis = (TextView) findViewById(R.id.zAxis);
@Override
super.onResume();
sManager.registerListener(this, accelerometer,
SensorManager.SENSOR_DELAY_NORMAL);
}
@Override
protected void onPause() {
super.onPause();
sManager.unregisterListener(this);
}
@Override
public void onAccuracyChanged(Sensor sensor, int accuracy) {
}
@Override
public void onSensorChanged(SensorEvent event) {
if(event.sensor.getType() == Sensor.TYPE_ACCELEROMETER){
xAxis.setText("Acelerometar X: " + event.values[0]);
yAxis.setText("Acelerometar Y: " + event.values[1]);
zAxis.setText("Acelerometar Z: " + event.values[2]);
}
}
}
Primjer 104. Koritenje senzora
126

Kada klasa implementira neki listener, u ovom sluaju SenzorEventListener, implementiraju se
i odreene metode. SenzorEventListener zahtjeva implementaciju onAccuracyChanged() i onSensorChanged(). Svaka obrada senzora traje neki odreeni vremenski interval. Tako je npr.
akcelerometru nuno izraunati x, y i z os, lokacijskom se senzoru trebaju dohvatiti lokacijski
podatci pomou GPS-a i sl. Kada akcelerometar dohvati podatke za akceleraciju, aktivira metodu onSensorChanged() u koju poalje podatke koji se nalaze u objektu SensorEvent. U primjeru
3.13.1. napisana je implementacija onSensorChanged() metode: dohvaaju se podatci koje je
poslao akcelerometar i ispisuju se u TextViewu za svaku os posebno. Veina senzora vraa po
tri vrijednosti, svaku za x, y i z os, a neki senzori samo jednu vrijednost kao npr. senzor svijetla
(upaljeno ili ugaeno). Senzor sluanja se zaustavlja kada aktivnost odlazi u onPause() ili onStop() stanje metodom unregisterListener(). U metodu se poalje objekt koji slua senzor, u
ovom sluaju aktivnost. Treba uzeti u obzir da e se metoda onSensorChanged() pokretati svaki
put kada akcelerometar dohvati potrebne vrijednost. Taj e se ciklus ponavljati sve dok se ne
zaustavi sluanje akcelerometra.
Slika 114. Prikaz vrijednosti akcelerometra
ZADATAK 23
Napravi aktivnost u kojoj se unosi latitude i longitude vrijednosti i pomou lokacijskog
senzora ispii udaljenost od trenutne lokacije do lokacije unesene pomou latitude i
longitude vrijednosti.
5.15. Google mape

Da bi se Google mape mogle koristiti, u emulator treba postaviti podravanje prikaza Google
mapa. Svaka verzija OS-a ima osnovnu verziju i verziju s Google mapama. Te su dvije verzije
izdvojene kako bi se olakala aplikacija o nepotrebnim datotekama.
127
Slika 115. Postavljanje Google Maps API-a
Trenutna je verzija Google mapa za Android Google Maps Android API v2. Da bi se mogao
koristiti, skida se biblioteka Google Play Services koja je dostupna u Android SDK Manageru.
Slika 116. Google Play Services biblioteka u SDK Manageru
128

Biblioteka se zatim ukljuuje u projekt desnim klikom na projekt -> Build Path -> Add
External Archives.
Slika 117. Dodavanje biblioteke u aplikaciju
Google Play Services se moe nai na sljedeoj putanji:

<android-sdk-folder>/extras/google/google_play_services/libproject/google-play-services_lib/libs/
Na putanji se oznai google-play-services.jar datoteka i doda se u projekt. Google mape

koriste klju koji je potreban za prikaz mapa na ureaju. Da bi se klju kreirao, pravi se
raun na Google API konzoli:
https://code.google.com/apis/console/
U Google API konzoli kreira se novi projekt.
Slika 118. Kreiranje projekta na Google konzoli
Nakon to je projekt gotov, u izborniku se odabire Services i oznai se Google Map API v2.
129
Slika 119. Postavljanje koritenja Google Maps Android API v2 u Google konzoli
U izborniku se zatim ide na API Access i odabire se Create new Android key.
Slika 120. Dijalog za upisivanje SHA1 kljua + package
Potrebno je unijeti i SHA1 certificate fingerprint aplikacije. Fingerprint je jedinstveni kod

aplikacije kojim se moe jednoznano identificirati aplikacija, a kreira se pomou MD5
ili SHA1 algoritma. U ovom se sluaju trai SHA1 algoritam. Taj se Fingerprint kreira
pomou Java keytoola koji se nalazi u Java direktoriju. JDK verzija 7 keytool kreira SHA1
key, a JDK verzija 6 MD5 key. Dakle, mora se instalirati JDK 7 kako bi se dobio SHA1 key.
Keytool alat, kojim e se dobiti SH1 otisak, nalazi se u direktoriju:
C:\Program Files\Java\jdk1.7.0_17\bin
130

SHA1 otisak mora kreirati keystore aplikacija. Budui da je rije o testnom okruenju,
svaki put kada se builda projekt u Eclipse alatu, kreira se i debug.keystore u direktoriju:
C:\Users\<korisniko_ime>\.android
Iz tog se keystora mora dobiti SHA1 otisak. Sljedei je korak pokretanje procesa preko
CMD-a (command prompt).
Slika 121. Generiranje SHA1 kljua preko CMD
Dobiveni SHA1 klju je:

13:C4:0B:ED:83:4F:24:BA:24:6E:9E:28:75:93:53:C0:33:3B:01:54
Uz klju se na kraju dodaje i osnovni paket (engl. package) aplikacije. Osnovni se paket
moe nai u manifestu
Slika 122. Package koji se treba upisati zajedno sa SHA1 kljuem
131

Pakovanje se dodaje na kraj SHA1 kljua, a izmeu mora biti ;. Kod koji se upisuje u Google
konzolu je:
13:C4:0B:ED:83:4F:24:BA:24:6E:9E:28:75:93:53:C0:33:3B:01:54;android.gauss.androidtutorial
Slika 123 Unos SHA1 kljua + package u Google konzolu
Kada se klikne Create, konzola generira API key koji se kopira i upisuje u manifest u meta element izmeu application elementa.
Slika 124. Generirani API key u Google konzoli

<meta-data
android:name="com.google.android.maps.v2.API_KEY"
android:value="AIzaSyC7-hw_UKKRh5VkUJ420JbtFwhnVtGOQ2c"/>
Primjer 105. Meta data element za manifest
132

Nuno je definirati i dozvolu (eng. permission) za koritenje mapa i narediti aplikaciji da
ju koristi.
<permission
android:name="com.example.mapdemo.permission.MAPS_RECEIVE"
android:protectionLevel="signature"/>
<uses-permission android:name="com.example.mapdemo.permission.MAPS_RECEIVE"/>
Primjer 106. Permission element za manifest
Ovu verziju Google Maps API-a mogu koristiti samo ureaji koji imaju podrku za OpenGL
ES 2.0. i to se takoer definira u manifestu:
<uses-feature
android:glEsVersion="0x00020000"
android:required="true"/>
Primjer 107. Uses feature element za OpenGL ES 2
Trebaju se prihvatiti jo neke dozvole kao npr. pristup Internetu, dohvaanje lokacije korisnika i
sl. Slijedi primjer manifesta.
133

<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="android.gauss.androidtutorial"
android:versionCode="1"
android:versionName="1.0" >
<uses-sdk
android:minSdkVersion="8"
android:targetSdkVersion="17" />
<uses-feature
android:glEsVersion="0x00020000"
android:required="true" />
<permission
android:name="com.example.mapdemo.permission.MAPS_RECEIVE"
android:protectionLevel="signature" />
<uses-permission android:name="com.example.mapdemo.permission.MAPS_RECEIVE" />
<uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
<uses-permission
android:name="com.google.android.providers.gsf.permission.READ_GSERVICES" />
<uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION" />
<uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" />
<application
android:allowBackup="true"
<meta-data
android:name="com.google.android.maps.v2.API_KEY"
android:value="AIzaSyC7-hw_UKKRh5VkUJ420JbtFwhnVtGOQ2c"/>
<activity
android:theme="@android:style/Theme.NoTitleBar" >
<intent-filter>
</intent-filter>
</activity>
</application>
Primjer 108. Manifest sa svim potrebnim elementima za koritenje Android Google Maps API v2
U layoutu aktivnosti definira se da e se koristiti MapFragment. Fragment se moe referencirati direktno u layoutu.
134

<fragment xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/map"
android:name="com.google.android.gms.maps.MapFragment"
android:layout_height="match_parent" />
Primjer 109.Referenciranje Map fragmenta u layoutu aktivnosti
Jo je preostalo postaviti layout u aktivnosti.

public class MainActivity extends Activity{
@Override
}
Primjer 110. Aktivnost koja sadri Google mape
Slika 125. Prikaz Android Google Maps API v2
ZADATAK 24
Napravi prikaz mape pomou Google Maps API-a i na mjestu gdje korisnik klikne,
postaviti marker. Po mogunosti koristi vlastitu ikonu.
135

5.16. Multitasking
Mobilni ureaji esto imaju problema s multitaskingom jer priroda mobilnih ureaja jednostavno onemoguava pravi multitasking. Pravi multitasking podrazumijeva istodobno pokretanje
vie aplikacija na ureaju kao to je npr. otvaranje i koritenje vie programa u Windowsima
istovremeno. Dakle, na ekranu je mogue vidjeti vie aplikacija. Kod Androida takav multitasking ne postoji, ali postoji neto slino. Android OS u memoriji pamti nedavno otvorene aplikacije i dri ih u stogu. Svaki put kada korisnik otvori aplikaciju i izae iz nje, Android OS ju ubacuje
u svoj stog otvorenih aplikacija. Taj se postupak provodi jer se smatra da e korisnik zasigurno
opet otvoriti istu aplikaciju. OS ne mora ponovno otvarati aplikaciju i uitavati sve potrebne
datoteke, ve iz stoga uzima spremljenu aplikaciju i prikazuje ju korisniku. Takvo je rjeenje odabrano kako bi se smanjilo vrijeme uitavanja i procesiranja aplikacija. Memorija je stoga u koju
OS sprema otvorene aplikacije ograniena i najee moe pamtiti do est aplikacija u memoriji.
Aplikacije koje se nalaze u memoriji mogu se vidjeti dugim pritiskom tipke Home na ureaju.
Slika 126. Pokrenute aplikacije na ureaju
esto Android OS oslobaa dio memorije kako bi spremio neku drugu aplikaciju u stog
ili kada neke stvari zahtijevaju vie memorije. OS iz stoga izbacuje aplikaciju koja najdue
nije bila koritena.
136
Slika 127. Ponaanje Android stoga
Kada OS izbacuje aplikaciju iz stoga, na svim se aktivnostima, koje su bile otvorene za vrijeme
koritenja aplikacije, poziva metoda onDestroy(). Stog omoguava da se korisnik prebacuje iz
jedne aplikacije u drugu. Upravo je ovdje razlika izmeu pravog multitaskinga i multitaskinga
koji postoji u Androidu. U Androidu se ne mogu otvoriti i koristiti istovremeno dvije aplikacije
na ekranu, ve se korisnik mora prebacivati iz jedne aplikacije u drugu. Nedostatak je multitaskinga u Androidu i taj to aplikacije koje su u stogu i ekaju na izvoenje nisu u aktivnom stanju.
Prema ivotnom ciklusu aktivnosti svaka aktivnost koja nije na ekranu, odlazi u onStop() stanje i
aplikacija ne moe u pozadini izvoditi svoj posao. Zbog toga se ni ovakav sluaj ne smatra multitaskingom. Moe se rei da se u ovom sluaju multitasking samo simulira i korisnik ima osjeaj
da se odvija pravi multitasking. Pravi multitasking omoguava rad svim otvorenim aplikacijama i
onda kada nisu fokusirane na ekranu (isto kao npr. u Windows operacijskom sustavu).
137
IZRADA ANDROID APLIKACIJE

6. IZRADA ANDROID APLIKACIJE
U ovom e poglavlju biti opisan tijek izrade jednostavne aplikacije za Android. U poslovnom objektu najee surauju programer i dizajner. Dizajner dizajnira aplikaciju,
izgled aktivnosti, izgled izbornika, boje, po potrebi dodaje slike i sl., tj. odreuje kako e
aplikacija izgledati. Kada dizajner odredi izgled aplikacije, programer moe poeti kodirati. Veoma esto aplikacije zahtijevaju da se odreeni sadraj skine s Interneta i da se
prikae u aplikaciji. Tad se skida RSS koji se u aplikaciji parsira, a prikaz se tog sadraja
prilagodi mobilnom ureaju. Taj je sadraj lista elemenata koji se prikazuju u ListActivity
aktivnosti. Klikom na jedan element otvara se nova aktivnost s detaljnim prikazom te
vijesti. Vijesti koje e se parsirati nalaze se na sljedeem linku:
http://www.dalmacijanews.com/DesktopModules/DnnForge%20-%20NewsArticles/Rss.
aspx?TabID=77&ModuleID=382&MaxCount=25
Rije je o RSS-u dalmacijanews.hr portala. Ako se detaljnije pogleda RSS, moe se primijetiti da sadri odreene elemente od kojih se element <item> ponavlja. Taj element
predstavlja vijest koja e biti prikazana u aplikaciji.
138
<item>
<title>
Jugo s udarima preko 110km/h diglo goleme valove (FOTO, VIDEO)
</title>
<link>
http://www.dalmacijanews.com/Hrvatska/View/tabid/77/ID/114354/Jugo-s-udarima-preko-110kmh-diglo-golemevalove-FOTO-VIDEO.aspx
</link>
<guid isPermaLink="false">f1397696-738c-4295-afcd-943feb885714:114354</guid>
<author>Rade Popadi</author>
<pubDate>Mon, 18 Mar 2013 19:03:00 GMT</pubDate>
<description>
Ovogodi&scaron;nji oujak ne prestaje donositi meteorolo&scaron;ka iznenaenja. Mjesec je poeo
natprosjenom toplinom u prvom desetodnevlju, zatim ve...
</description>
<content>
<br /> Ovogodi&scaron;nji oujak ne prestaje donositi meteorolo&scaron;ka iznenaenja. Mjesec je poeo
natprosjenom toplinom u prvom desetodnevlju, zatim velikom hladnoom u drugom. Snijeg je pro&scaron;li
tjedan zabijelio cijelu unutra&scaron;njost zemlje, a uz obalu Dalmacije je bilo i snjenih pahulja.
Proteklog vikenda su ponegdje u unutra&scaron;njosti zemlje temperature dosezale -5°C, a mraza je
bilo i diljem otoka i obale.<br /> <br /> Ponedjeljak je donio novu izraenu ciklonu koje djeluje na
vrijeme u cijeloj zemlji. Radi se o cikloni Otokar. Zadnja 24 sata atmosferski tlak pao je za ak 25
hektopaskala, a svi smo itekako osjetili juinu i osjetno zatopljenje, pi&scaron;e <a
href="http://www.crometeo.hr" target="_blank"><strong>Crometeo.hr.</strong></a><br /> <br /> Ciklona je
na Jadranu donijela vrlo obilne oborine. Na dijelu sjevernog Jadrana palo je preko 100 litara
ki&scaron;e po metru kvadratnome. ak 177 litara do 19 sati palo je u Poljanama na obroncima Uke. Jko
grmljavinsko nevrijeme iza 17 sati zahvatilo je dio Istre, donosei obilne pljuskove praene
intenzivnom grmljavinom i tuom.<br /> <br /> Nevrijeme je osobito jako pogodilo otok Krk i Rijeku.
Zbog jakih udara juga vatrogasci su poslijepodne imali nekoliko intervencija. Ru&scaron;ila su se
stabla u Kostreni, blizu Sportske dvorane na Zametu, a vatrogasci su intervenirali u Osjekoj ulici na
&Scaron;kurinjama gdje je odletjela tenda.<br /> <br /> Obilne ki&scaron;e bilo je i u Dalmaciji, tako
je u Konavlima i dijelu Dalmatinske zagore palo preko 50mm ki&scaron;e. U unutra&scaron;njosti je
ki&scaron;e najmanje bilo u Slavoniji, a znatno vi&scaron;e na zapadu zemlje gdje se sljedeih sati
oekuje glavnina oborina.<br /> <br /> Najvi&scaron;e dnevne temperature bile su na Jadranu od 11 do
16°C, u unutra&scaron;njosti zemlje od 5 na krajnjem zapadu, do 12°C u zapadnoj Slavoniji.<br
/> <br /> Uz ki&scaron;u, glavno obiljeje vremena tijekom ponedjeljka na Jadranu bio je vjetar. Vei
dio dana puhalo je jako jugo koje je mjestimino imalo este olujne udare &scaron;to je izrazio
povealo valovitost mora. Nizak tlak i juni vjetrovi uzrokovali su plimu koja je mjestimino poplavila
najnie dijelove obale.<br /> <br /> Do 17 sati najjae jugo je puhalo na dubrovakom podruju. Tamo su
udari prelazili 110km/h. Na otoku Mljetu takoer. Na otoku Visu, Palagrui i Krku izmjerni su udari
juga premo 100km/h. U Zadru je jugo na udare puhalo do 93km/h, na Rabu 92km/h, Splitu 90, Makarskoj 73,
a &Scaron;ibeniku 72km/h.<br /> <br /> <iframe width="4400" height="315" frameborder="0"
src="http://www.youtube.com/embed/dFXkFwMNpXI"></iframe> <br /> <br /> <iframe width="440" height="315"
frameborder="0" src="http://www.youtube.com/embed/vQ0L1TEctMQ"></iframe> <br /> <br /> Na prolasku
fronte u kasnim popodnevnim satima, jugo je na sjevernom Jadranu okrenulo na umjeren do jak lebi
(garbin).<br /> <div style="text-align: right;"><strong>D.N.<br /> </strong>Foto:<strong> Zvonimir
Bari&scaron;in, Toni Plazibat, Luka Gerlanc / CROPIX<br /> </strong>Video: <strong>Boris Ba&scaron;i
/ CROMETEO</strong></div>
</content>
<comments>
http://www.dalmacijanews.com/Hrvatska/View/tabid/77/ID/114354/Jugo-s-udarima-preko-110kmh-diglo-golemevalove-FOTO-VIDEO.aspx#Comments
</comments>
<slash:comments>0</slash:comments>
<enclosure url="http://www.dalmacijanews.com/Portals/0/images/2013/03/2_jugo_kastela.jpg" length="19216
2" type="image/jpeg"/>
<gallery>
<img id="Rss_77114354_10" src="/Portals/0/images/2013/03/2_jugo_kastela.jpg" alt="Jugo s udarima preko
110km/h diglo goleme valove (FOTO, VIDEO)"/>
<img id="Rss_77114354_12" src="/Portals/0/images/2013/03/Clipboard01.jpg" alt="Jugo s udarima preko
110km/h diglo goleme valove (FOTO, VIDEO)"/>
<img id="Rss_77114354_14" src="/Portals/0/images/2013/03/jugo_kastela2-180313.jpg" alt="Jugo s udarima
preko 110km/h diglo goleme valove (FOTO, VIDEO)"/>
</gallery>
</item>
Slika 128. Item element u RSS-u
139

Postoji vie <item> elemenata i svaki element predstavlja jednu vijest. Koliko <item>
elemenata ima u RSS-u, bit e i elemenata u listi u ListActivity aktivnosti. Title, author,
date i slika u url atributu iz enclosure elementa bit e prikazani u elementu liste. U detaljima e biti prikazana ista slika koja je uveana i sljedeeg sadraja:
<content> elementa te title.
Prvo se kreira Android projekt. Projekt se radi za 3.0(API 11) do 4.2.2(API 17). Opisuje se
plan opeg izgleda i navigacija aplikacije. Kada korisnik pokrene aplikaciju, pokrenut e
se Splash ekran koji e biti prikazan sve dok se ne skine i ne parsira sadraj RSS-a. Kada
se sadraj parsira, svi e se elementi prikazati u ListActivity aktivnosti. Kada korisnik
klikne na element u listi, otvorit e se nova aktivnost s detaljima te vijesti.
Prvo e se kreirati aktivnost naziva SplashActivity i klasa DalmacijaTask koja e naslijediti AsyncTask. U DalmacijaTask e se pokrenuti proces skidanja i parsiranja sadraja
RSS-a. Za parsiranje se sadraja moe koristiti SAX parser ili DOM parser. Ti parseri su dio
Android SDK i zahtijevaju dodatni kod za uspjeno parsiranje. Kako bi se olakalo parsiranje, u ovom e se primjeru koristiti ve gotova biblioteka koja parsira sadraj preko
anotacija. Kako se kod za spajanje i skidanje sadraja s internetskih stranica ne bi morao
runo pisati, koristit e se gotova biblioteka za spajanje i skidanje sadraja s Interneta,
tj. Apache Commons IO koja se moe nai na sljedeem URL-u:
http://commons.apache.org/proper/commons-io//
Ova biblioteka sadri metodu FileUtils.copyUrlToFile() kojom e se RSS skinuti i spremiti

u datoteku na ureaju. Nakon toga se sadraj mora parsirati. Za parsiranje se koristi
biblioteka Simple sa stranice:
http://simple.sourceforge.net/
Simple se upotrebljava tako da se preko anotacija oznai koja varijabla e predstavljati

koji element u RSS-u. Biblioteka e prema tim anotacijama znati kako parsirati sadraj. U
projektu se mora kreirati direktorij libs i u njega kopirati obje .jar datoteke. Nakon toga
se desnim klikom Add To Build Path biblioteke dodaju u projekt. Osim tih dviju biblioteka, koristit e se i biblioteka za skidanje slika s Interneta koje e biti prikazane. Skidanje
slika bi se trebalo odraivati u posebnoj dretvi, a za to je potrebna posebna AsyncTask
klasa. Nakon to se slika skine, postavlja se u ImageView. Nije potrebna posebna AsyncTask klasa za skidanje slika s Interneta jer sve obavlja biblioteka Android Universal Image Loader, a moe se nai na sljedeoj stranici:
https://github.com/nostra13/Android-Universal-Image-Loader
Ukratko opisano RSS sadraj izgleda ovako:
140
<rss>
<channel>
<title>Dalmacija News</title>
<link>http://www.dalmacijanews.com</link>
<description>RSS feeds for Dalmacija News</description>
<item>
...
</item>
<item>
...
</item>
..jo <item> elemenata...
<channel>
</rss>
Slika 129. Opi izgled RSS-a
Prema opem se izgledu RSS-a izrauju klase koje e se kasnije anotirati kako bi parser znao
kako isparsirati dokument. Budui da nisu potrebni svi podatci, neki e se sadraji RSS-a parsirati, a neki izostaviti. Izgled klasa bi bio sljedei: RSS klasa ima objekt Channel u sebi, kreirana
Channel klasa ima objekt Item u sebi(prva e se tri channel elementa ignorirati jer nisu potrebni
za aplikaciju).
package android.gauss.dalmacija.rss;
import org.simpleframework.xml.Element;
import org.simpleframework.xml.Root;
@Root
public class Rss implements Serializable{
@Element
private Channel channel;
public Channel getChannel() {
return this.channel;
}
public void setChannel(Channel channel) {
this.channel = channel;
}
}
Primjer 111. RSS klasa
Anotacija @Root oznaava da je RSS klasa prvi element tj. korijen RSS-a. @Element oznaava
da RSS u sebi sadrava element tipa Channel. Vano je imenovati varijable i nazive elemenata u
RSS-u da parser moe prepoznati o kojem se elementu radi. Slijedi Channel klasa:
141
import org.simpleframework.xml.ElementList;
public class Channel implements Serializable{
@ElementList(inline = true)
private List<Item> item;
public List<Item> getItem() {
return this.item;
}
public void setItem(List<Item> item) {

this.item = item;
}
Primjer 112. Channel klasa
Channel klasa sadri samo anotaciju @ElementList, tj. listu elemenata tipa Item. Moe
se primijetiti da je inline postavljeno kao true to znai da elementi nisu sadrani u
dodatnom elementu npr. <items>. Ako postoji lista elemenata u RSS-u, sadrani su u
dodatnom elementu npr:
<rss>
<channel>
<items>
<item>
...
</item>
<item>
...
</item>
..jo <item> elemenata...
</items>
<channel>
</rss>
Slika 130. Lista elemenata kada je inline = false
S (inline = true) oznauje da dodatan element u ovom sluaju ne postoji, tj. da su elementi direktna djeca channel elementa. U Item klasi e se parsirati samo oni elementi koji su potrebni
(kao i u RSS-u).
142
import org.simpleframework.xml.Element;
public class Item implements Serializable{
@Element
private String title;
@Element
private String link;
@Element
private String guid;
@Element
private String author;
@Element
private String pubDate;
@Element
private String description;
@Element
private String content;
@Element
private Enclosure enclosure;
public String getTitle() {

return this.title;
}
public void setTitle(String title) {
this.title = title; }
public String getLink() {
return this.link;
}
public void setLink(String link) {
this.link = link;
}
public String getGuid() {
return this.guid;
}
public void setGuid(String guid) {
this.guid = guid;
}
public String getAuthor() {
return this.author; }
public void setAuthor(String author) {
this.author = author; }
public String getPubDate() {
return this.pubDate; }
public void setPubDate(String pubDate) {
this.pubDate = pubDate;
}
public String getDescription() {
return this.description;
}
public void setDescription(String description) {
this.description = description;
}
public String getContent() {
return this.content; }
public void setContent(String content) {
this.content = content;
}
public Enclosure getEnclosure() {
return this.enclosure;
}
public void setEnclosure(Enclosure enclosure) {
this.enclosure = enclosure; }
Primjer 113. Item klasa
Klasa Enclosure je element <enclosure> u <item> elementu i iz njega treba izvaditi atribut url.
143
import org.simpleframework.xml.Attribute;
public class Enclosure implements Serializable{
@Attribute
private String url;
public String getUrl() {
return this.url;
}
public void setUrl(String url) {

this.url = url;
}
Primjer 114. Enclosure klasa
Anotacija @Atribute oznaava da se eli oitati atribut url <enclosure> elementa. Ovdje
e se ukratko prikazati kako koristiti ovaj parser kada su anotacije u pitanju. Postoji
mnogo mogunosti s tim parserom, a mnogi su korisni prikazani i na internetskoj stranici. Sada se moe nastaviti pisati DalmacijaTask klasa. Kada se sadraj skine i parsira,
pozvat e se nova List Activity i zatvoriti Splash aktivnost. Preostalo je napraviti jo jedan
interface koji e implementirati SplashActivity klasa. Taj e interface imati samo jednu
metodu koja e se pokrenuti kada sadraj bude skinut i parsiran.
package android.gauss.dalmacija.asynctasks;
import android.gauss.dalmacija.rss.Rss;
public interface DalmacijaNewsListener {
}
void onNewsAvailable(Rss rss);
Primjer 115. DalmacijaNewsLIstener interface
Slijedi prikaz DalmacijaTask klase:
144
public class DalmacijaTask extends AsyncTask<Void, Void, Rss>{

private static final String FILE_NAME = "dalmacija_news.xml";
private static final String URL =
"http://www.dalmacijanews.com/DesktopModules/DnnForge%20%20NewsArticles/Rss.aspx?TabID=77&ModuleID=382&MaxCount=25";
private Context context;
private File file;
private DalmacijaNewsListener listener;
public DalmacijaTask(Context context) {
this.context = context;
}
protected void onPreExecute(){
file = new File(context.getFilesDir(), FILE_NAME);
if(!file.exists()){
try {
file.createNewFile();
} catch (IOException exception) {
// TODO Auto-generated catch-block stub.
exception.printStackTrace();
}
}
};
@Override
protected Rss doInBackground(Void... params) {
try {
FileUtils.copyURLToFile(new URL(URL), file);

Serializer serializer = new Persister();
Rss rss = serializer.read(Rss.class, file, false);
return rss;
} catch (Exception exception) {

// TODO Auto-generated catch-block stub.
exception.printStackTrace();
}
return null;
@Override
protected void onPostExecute(Rss rss) {
if(rss != null){
listener.onNewsAvailable(rss);
}
}
public void setDalmacijaNewsListener(DalmacijaNewsListener listener){

this.listener = listener;
}
Primjer 116. Asinkrono skidanje i parsiranje RSS-a
145

U konstruktor se DalmacijaTask klase alje Context koji se pripisuje privatnoj varijabli. Prije nego
to se pokrene proces skidanja sadraja s internetske stranice, pomou nje se u onPreExecute()
provjerava postoji li dalmacija_news.xml datoteka. Ako ne postoji, kreira se. Zatim se u doInBackground() metodi pomou FileUtils.copyUrlToFile() kopira sadraj RSS-a u tu datoteku. Zatim
se instancira objekt Serializer koji read metodom parsira sadraj. Prvi je parametar prva klasa
koja se koristi u parsiranju, tj. RSS.class, drugi je datoteka s RSS sadrajem, a trei je parametar
postavljen na true to znai da parsiranje ne mora biti striktno, tj. da u klasama ne moraju biti
postavljeni svi elementi kao u RSS-u. U onPostExeute() metodi se provjerava je li kreiran RSS
objekt. Ako je kreiran, pokree se metoda listenera koji je postavljen metodom setDalmacijaNewsListener(). Listener e biti SplashActivity.
package android.gauss.dalmacija;
import
import
import
import
import
import
import
android.gauss.dalmacija.asynctasks.DalmacijaNewsListener;
android.gauss.dalmacija.asynctasks.DalmacijaTask;
android.gauss.dalmacija.rss.Rss;
android.gauss.dalmacijanews.R;
android.os.Bundle;
import com.nostra13.universalimageloader.core.ImageLoader;
import com.nostra13.universalimageloader.core.ImageLoaderConfiguration;
public class SplashActivity extends Activity implements DalmacijaNewsListener{
private DalmacijaTask downloadDalmacija;
@Override
ImageLoaderConfiguration config = new
ImageLoaderConfiguration.Builder(getApplicationContext()).build();
ImageLoader.getInstance().init(config);
}
downloadNews();
private void downloadNews(){

downloadDalmacija = new DalmacijaTask(this);
downloadDalmacija.setDalmacijaNewsListener(this);
downloadDalmacija.execute();
}
@Override
public void onNewsAvailable(Rss rss) {
bundle.putSerializable("rss",rss);
Intent intent = new Intent(this, NewsListActivity.class);
this.finish();
Primjer 117. Splash Activity klasa
146

SplashActivity aktivnost ima postavljen ImageView koji predstavlja sliku. To je obina
aktivnost koja u svom layoutu ima samo sliku. Kada se sadraj s Interneta skine i parsira,
pokree se nova aktivnost kojoj se alje dohvaen objekt s podatcima vijesti.
android:background="#333"
android:gravity="center"
android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
tools:context=".SplashActivity" >
<ImageView
android:id="@+id/imageView1"
android:layout_centerHorizontal="true"
android:layout_marginBottom="158dp"
android:src="@drawable/logooo" />
</RelativeLayout>
Primjer 118.. Layout SplashActivity aktivnosti
Slika 131. Splash Activity
Pokretanjem aplikacije izrauje se konfiguracija biblioteke za skidanje slika s Interneta.

To je zahtjev biblioteke koji mora biti izvren. Zatim slijedi skidanje sadraja s Interneta
i parsiranje. Sve se odvija u pozadinskoj dretvi. Ova klasa takoer implementira interface DalmacijaNewsListener koji slua kada se sadraj skida i parsira. Prije nego to se
pokrene AsyncTask za dohvaanje sadraja, ova klasa alje sebe kao sluaa u AsyncTask
klasu kako bi mogla aktivirati metodu onNewsAvailable() kada se dohvati sadraj. Dakle,
kada se ta metoda pokrene, poalje se RSS klasa sa svim dohvaenim podatcima i postavlja se pomou Bundle objekta u Intent objekt. Pokree se nova aktivnost, a prethodna
se aktivnost zatvara.
147
import
import
import
import
android.app.ListActivity;
android.gauss.dalmacija.adapters.DalmacijaNewsAdapter;
android.os.Bundle;
public class NewsListActivity extends ListActivity{

private Rss rss;
@Override
rss = (Rss)getIntent().getSerializableExtra("rss");
DalmacijaNewsAdapter adapter = new DalmacijaNewsAdapter(this,
rss.getChannel().getItems());
}
}
Primjer 119. NewsListActivity klasa
Nova aktivnost je ListActivity aktivnost koja adapterom prikazuje listu elemenata. GetIntent() metodom se iz Intent objekta dohvati RSS objekt koji je poslan u proloj aktivnosti, a lista se Item objekata alje u adapter. U layout direktoriju se kreira nova layout XML datoteka koja se naziva list_item_dalmacija_news. Izgled XML-a je sljedei:
148

android:background="@drawable/background"
android:orientation="vertical"
android:padding="5dp" >
<ImageView
android:id="@+id/newsImage"
android:layout_width="80dp"
android:layout_alignParentLeft="true"
android:layout_marginRight="10dp"
android:scaleType="centerCrop" />
<TextView
android:id="@+id/newsTitle"
android:layout_toRightOf="@id/newsImage"/>
<TextView
android:id="@+id/newsDate"
android:layout_alignParentRight="true"/>
<TextView
android:id="@+id/newsAuthor"
android:layout_alignParentRight="true"
android:layout_above="@id/newsDate"/>
</RelativeLayout>
Primjer 120. list_item_dalmacija_news layout datoteka
Kada je layout sloen, treba se posloiti i adapter. Kreirana je nova klasa DalmacijaNewsAdapter koja nasljeuje klasu BaseAdapter. U konstruktor se poalje Context i list Item
objekata. U getView() metodi se uvijek dohvaa sljedei element i postavlja se slika,
naslov, autor i datum. Sadraj slike se u ovom sluaju skida s Interneta pa je potrebno
nekoliko trenutaka da se slika uita kada se aktivnost pokrene. Moe se umjesto slike
dodatno ubaciti i Progress Bar ili sl., a kada se slika uita ProgressBar se uklanja. Dakle,
o skidanju se slika s Interneta brine biblioteka koja je prije bila ukljuena u projekt.
149
public class DalmacijaNewsAdapter extends BaseAdapter{

private List<Item> itemList;
private LayoutInflater inflater;
public DalmacijaNewsAdapter(Context context, List<Item> itemList) {
this.itemList = itemList;
inflater = LayoutInflater.from(context);
}
@Override
public int getCount() {
return itemList.size();
}
@Override
public Object getItem(int position) {
return itemList.get(position);
}
@Override
public long getItemId(int position) {
return itemList.indexOf(itemList.get(position));
}
@Override
public View getView(int position, View convertView, ViewGroup parent) {
if(convertView == null){
convertView = inflater.inflate(R.layout.list_item_dalmacija_news,
parent, false);
}
ImageView image = (ImageView) convertView.findViewById(R.id.newsImage);
ImageLoader.getInstance().displayImage(itemList.get(position).getEnclosure().ge
tUrl(), image);
TextView title = (TextView) convertView.findViewById(R.id.newsTitle);
title.setText(itemList.get(position).getTitle());
TextView author = (TextView) convertView.findViewById(R.id.newsAuthor);
author.setText(itemList.get(position).getAuthor());
TextView date = (TextView) convertView.findViewById(R.id.newsDate);
date.setText(itemList.get(position).getPubDate());
return convertView;
Primjer 121. DalmacijaNewsAdapter klasa
Ako se sada pokrene projekt, dobije se sljedei rezultat:
150
Slika 132. Izgled NewsListActivity aktivnosti
Pritisak na element treba otvoriti novu aktivnost koja e prikazati detaljni prikaz vijesti. ListActivity sama po sebi sadri metodu koja prepoznaje klik na element i potrebno ju je implementirati. Klikom na element dohvatit e se Item objekt koji je sadran na tom mjestu. Objekt e se
preko Intent objekta poslati u sljedeu aktivnost koja e prikazati detalje te vijesti, a podatke e
dobiti iz Item objekta koji se poslao u Intent objektu.
151
import
import
import
import
import
import
import
import
android.app.ListActivity;
android.gauss.dalmacija.adapters.DalmacijaNewsAdapter;
android.gauss.dalmacija.rss.Item;
android.os.Bundle;
android.view.View;
public class NewsListActivity extends ListActivity{

private Rss rss;
@Override
rss = (Rss)getIntent().getSerializableExtra("rss");
DalmacijaNewsAdapter adapter = new DalmacijaNewsAdapter(this,
rss.getChannel().getItems());
}
@Override
protected void onListItemClick(ListView l, View v, int position, long id) {
Item item = (Item)l.getItemAtPosition(position);
bundle.putSerializable("rss", item);
Intent intent = new Intent(this, NewsDetailsActivity.class);
}
Primjer 122.NewsListActivity aktivnost s ListItemClick listenerom
Zatim se kreira nova layout XML datoteka koja e definirati izgled aktivnosti koja e
prikazivati detalje vijesti. Naziv datoteke je activity_news_details.xml.
152

android:background="@drawable/background"
<LinearLayout
<TextView
android:id="@+id/title"
android:layout_margin="5dp"
android:text="test"
android:textColor="#555"
android:textSize="18sp" />
<LinearLayout
android:layout_marginLeft="5dp"
android:background="@drawable/dotted_tile_xml"
</LinearLayout>
<ImageView
android:id="@+id/image"
android:scaleType="centerCrop" />
<LinearLayout
android:layout_marginLeft="5dp"
android:background="@drawable/dotted_tile_xml"
</LinearLayout>
<WebView
android:id="@+id/web"
android:background="#ede5dc" />
</LinearLayout>
</RelativeLayout>
Primjer 123. Activity_news_details layout datoteka
153

Ovaj layout sadri i WebView koji e sluiti za prikaz internetskog sadraja jer je glavni opis vijesti
upisan u HTML-u. To se moe vidjeti ako se pogleda <content> element u RSS-u. Zatim se kreira
nova klasa NewsDetailsActivity koja nasljeuje klasu Activity. U onCreate() metodi se dohvati
Item objekt i spremi se u varijablu, dohvate se svi potrebni elementi i prikazuje se sadraj Item
objekta u njima.
public class NewsDetailsActivity extends Activity{
private
private
private
private
Item item;
TextView title;
ImageView image;
WebView content;
@Override
setContentView(R.layout.activity_news_details);
}
item = (Item) getIntent().getSerializableExtra("rss");
@Override
super.onResume();
title = (TextView)findViewById(R.id.title);
title.setText(item.getTitle());
image);
image = (ImageView) findViewById(R.id.image);

ImageLoader.getInstance().displayImage(item.getEnclosure().getUrl(),
content = (WebView) findViewById(R.id.web);
content.loadData(item.getContent(), "text/html; charset=utf-8", "utf-
8");
content.setBackgroundColor(0x00000000);
if (Build.VERSION.SDK_INT >= 11) // Android v3.0+
try {
Method method = View.class.getMethod("setLayerType", int.class,
Paint.class);
method.invoke(content, 1, new Paint()); // 1 =
LAYER_TYPE_SOFTWARE(API11)
} catch (Exception e) {
}
}
Primjer 124. NewsDetailsActivity klasa
Sav se potreban sadraj postavlja u elemente koji su definirani u layoutu. Moe se primijetiti da
WebView ne uitava internetsku stranicu, nego se u njega metodom loadData() direktno ubacuje HTML sadraj. Veoma je vano postaviti drugi parametar kao text/html charset=utf-8 zbog
pravilnog dekodiranja slova. WebView ima potekoe s prikazivanjem pozadine u boji zbog ega
154

je vrijednost njegove pozadine transparentna. Transparentnost se u verzijama Androida, koji su
vei od 3.0, ne moe postaviti na klasian nain. Ovisno o tome koja je trenutna verzija Androida
na ureaju, poziva se metoda koja postavlja pozadinu WebViewa kao transparentnu pozadinu.
Napisana bi aktivnost trebala izgledati kao na sljedeoj slici:
Slika 133. Izgled NewsDetailsActivity aktivnosti
Na kraju se ubacuju launcher ikone koje se nalaze u direktorijima LDPI, MDPI; HDPI i XHDPI.
Ikone se postavljaju u odgovarajue direktorije ovisno o svojim dimenzijama. Ikone se mogu
zamijeniti novim ikonama koje e dobiti isti naziv kao i stare. Nove se ikone nazovu ic_launcher i
prekopiraju se preko starih ikona. Iako sve ikone moraju imati isti naziv, postavljaju se u razliite
direktorije. Launcher ikona se takoer moe zamijeniti tako da se svim etirima ikonama dodijeli
isti naziv i prebaci ih se u direktorije koji su za njih namijenjeni. U manifest datoteci se tada mora
navesti ikonu koja e sluiti kao launcher ikona.
155
Slika 134. Zamjena launcher ikone u manifestu
156
Poduzetnitvo
157
PODUZETNITVO
7. PODUZETNITVO
7.1. to je to poduzetnitvo?
Rije poduzetnitvo potjee od francuske rijei entreprendre u znaenju poduzimati neto.
Iako se pojam poduzetnitva najee vee uz pokretanje, voenje i razvijanje poslovnog (poduzetnikog) poduhvata, obuhvaa mnogo ire podruje. Poduzetnitvo predstavlja nain razmiljanja i djelovanja i ne mora nuno biti vezan uz poslovni poduhvat. Najee se poduzetnitvo objanjava kao proces u kojem se iz niega stvara neto. U svakom je poduzeu, neovisno
o njegovoj veliini, djelatnosti kojom se bavi i sl., poduzetniko razmiljanje svakog zaposlenika
od iznimne vanosti. Pri tome se misli na kreativnost u rjeavanju problema, sposobnost sagledavanja problema u cijelosti, inovativnost i proaktivnost. Poduzetniko ponaanje rezultira
stvaranjem nove ili poveanjem postojee vrijednosti organizacije (za vlasnika i sve ostale koji
su ukljueni u njegovo djelovanje).
Najee se spominju tri osnovne vrste poduzetnitva:
Tradicionalno je poduzetnitvo upravljanje malim i srednjim poduzeima i obrtima kojima je cilj
ostvarenje dobiti. S pojmom se tradicionalnog poduzetnitva, poduzetnitvo najee poistovjeuje.
a)
Socijalno se poduzetnitvo odnosi na rad i upravljanje organizacijama kojima je osnovni
cilj opedrutvena korist, tj. unaprjeenje kvalitete ivljenja, a ne stjecanje dobiti.
b)
Korporativno se poduzetnitvo vee uz poduzetniko ponaanje u korporacijama, odnosi se na sve zaposlene, a ne samo na najvii menadment.
7.2. Procjena poduzetnikih sposobnosti

Uspjeh svakog posla, u najveoj mjeri, ovisi o osobnim karakteristikama poduzetnika,
vjetinama i financijskoj situaciji. Prije pokretanja nekog posla u obzir se moraju uzeti
sve vjetine i osobine koje su potrebne za voenje posla. imbenici koji utjeu na uspjeh svakog poslovnog poduhvata dijele se na: osobne imbenike (predanost poslu,
motivacija, preuzimanje rizika, odluivanje) i vjetine (tehnike i upravljake). Uspjeh
takoer ovisi i o okruenju u kojem se osoba koja vodi posao nalazi. Stoga se u vane
imbenike mora uvrstiti i podrka okoline, posebno obitelji. Mnogi uspjeni vlasnici
poduzea nisu posjedovali sve neophodne vjetine i prave osobine, nego su ih nauili i
razvili tijekom vremena.
Vjetine i osobine se mogu unaprijediti na vie naina:
a)
Razgovarajte o ovim temama sa svojim prijateljima, obitelji, drugim poduzetnicima
b)
Promatrajte druge poslovne ljude i pratite one korake koji ih vode ka uspjehu c)
c)
Obuavajte se kako biste unaprijedili svoje vjetine i znanja. Moete, na primjer,
uiti o knjigovodstvu i prodaji.
158
POSLOVNI PLAN
d)
itajte knjige iz kojih moete nauiti vie o onome to vas zanima.
Istraivanja su pokazala kako poduzetnici u veoj mjeri imaju i iskazuju odreene osobine, vjetine i ponaanje. Te su vjetine i osobine prikazane u tablici koja slijedi.
Poduzetnike vjetine
uvjeravanje
Poduzetnike osobine
kreativnost
pregovaranje
ambicioznost
prezentiranje
samouvjerenost
rjeavanje konflikata
upornost
strateko razmiljanje
inicijativa
donoenje odluka
znatielja
umreavanje
predanost poslu
Tablica 4. Poduzetnike vjetine i osobine
Poduzetniko ponaanje podrazumijeva traenje i prepoznavanje prilika u okruenju, preuzimanje inicijativa i prihvaanje rizika. Prije ulaska u svijet poduzetnitva, svaki bi poduzetnik trebao
ocijeniti one vjetine i osobine koje su kljune za uspjeh njegovog poslovnog poduhvata. Sljedei je korak izrada plana za unaprjeenje onih vjetina i osobina koje nisu dobile zadovoljavajuu
ocjena, a nakon toga njegova realizacija.
7.3. Poslovni plan

Poslovni je plan pisani dokument koji sadri detaljno razraen plan o ulaganju u posao, buduim
rezultatima poslovanja i varijantnim rjeenjima u sluaju moguih rizinih situacija. Temeljna je
okosnica planiranja, pokretanja, financiranja, organiziranja, voenja, razvijanja i kontrole poduzetnikog pothvata tijekom cjelokupnog vijeka trajanja. Ne postoji univerzalna matrica za
sastavljanje poslovnih planova, ali zato postoje standardi i protokoli koji plan ine razumljivim
i jasnim. esto se smatra da je poslovni plan dokument koji slui iskljuivo u svrhu odobravanja kredita od strane financijskih institucija. Meutim, najei je korisnik poslovnog plana
poduzetnik sa svojim timom ljudi koji e pratiti rast i razvoj tvrtke. Poslovni plan usmjerava
poslovanje i olakava donoenje poslovnih odluka. Moe ga izraditi poduzetnik ili konzultant
ukoliko poduzetnik nema dovoljno iskustva. Kada poslovni plan izrauje konzultant, poduzetnik
i dalje ima veliku ulogu u njegovoj izradi. Zaduen je prikazati sve podatke koji su nuni za izradu
poslovnog plana. Poduzetnik odgovara za tonost prikazanih podataka, a konzultant za izraun.
159
POSLOVNI PLAN
Slijedi primjer sadraja poslovnog plana:

1. PODATCI O PODUZETNIKU
2. POLAZITE

2.1. Nastanak poduzetnike ideje
2.2. Vizija poduzetnikog pothvata
3. PREDMET POSLOVANJA
4. LOKACIJA
5. TEHNIKO TEHNOLOKI ELEMENTI ULAGANJA

5.1. Opis strukture ulaganja
5.2. Struktura i broj zaposlenika
6. TRINA OPRAVDANOST

6.1. Trite nabave
6.2. Trite prodaje
6.3. Procjena ostvarenja prihoda
7. FINANCIJSKI ELEMENTI PODUHVATA

7.1. Investicije u osnovna sredstva
7.2. Investicije u obrtna sredstva
7.3. Trokovi poslovanja
7.4. Proraun amortizacije
7.5. Izvori financiranja
7.6. Projekcija rauna dobiti i gubitka
7.7. Financijski tijek
7.8. Ekonomski tijek
8. POKAZATELJI UINKOVITOSTI
9. ZAKLJUNA OCJENA PROJEKTA
U prvom se dijelu poslovnog plana Podatci o poduzetniku zapisuje krai ivotopis poduzetnika koji pokree postojee poslovanje ili je njegov nositelj. Ako je rije o partnerstvu, zapisuju se ivotopisi oba partnera i biljee se njihovi ulozi. U ivotopis treba
navesti poslove koje je poduzetnik do sada obavljao (dokaz o znanjima i vjetinama koje
je poduzetnik stekao) i stupanj njegovog obrazovanja (najvie zavreno obrazovanje
i dodatna usavravanja). Navode se i sljedei podatci: iskustva na slinim poslovima,
bivi poslodavci, priznanja i diplome koje su ostvarene u dosadanjem radu, poznavanje
160
POSLOVNI PLAN
stranih jezika, poznavanje rada na raunalu i sl.
U drugom se dijelu Polazite objanjava kako je poduzetnik doao na ideju baviti se poslom
kojim se bavi. U odabiru ideje za posao veina poduzetnika uzima u obzir znanja i vjetine koje
posjeduje, ali i znanja i vjetine ostalih lanova obitelji. Nakon to su definirana steena znanja
i vjetine i okolnosti koje su dovele do pokretanja odreene poduzetnike ideje, opisuje se plan
razvoja poslovanja, tj. poslovne ideje.
Trei dio poslovnog plana Predmet poslovanja opisuje djelatnost kojom e se obrt ili drutvo s
ogranienom odgovornou baviti. Potrebno je navesti: sjedite djelatnosti, osnivae, temeljni
kapital (ako je u pitanju d.o.o.), datum osnivanja, rjeenje o registraciji (broj registracije) i djelatnosti za koje je obrt ili drutvo s ogranienom odgovornou registrirano.
Lokacija je dio poslovnog plana koji podrazumijeva sjedite obrta ili drutva s ogranienom odgovornou. Ako se djelatnost obavlja izvan sjedita djelatnosti, navode se razlozi zato je to
tako. Primjerice, za obavljanje zidarske djelatnosti sjedite nije toliko bitno jer se svi poslovi
obavljaju na mjestu koje klijent odredi, ali za trgovaku djelatnost lokacija ima veliku ulogu u
ostvarenju buduih prihoda pa je nuno opisati lokaciju, povezanost s glavnim cestama, osigurana parkiralina mjesta za kupce i sl. Postoje i djelatnosti kod kojih je lokacija nebitna, primjerice IT sektor.
Tehniko-tehnoloki elementi ulaganja investitorima daju informacije o samom tijeku poslovnog procesa (npr. za djelatnost je kemijskog ienja iznimno vaan detaljan opis procesa ienja kako bi se mogla napraviti raunica i shvatiti poslovni proces). Sljedei je korak opis ulaganja,
tj. tona specifikacija ulaganja. Dakle, poduzetnik mora odrediti koliko je sredstava potrebno
odvojiti za osnovna sredstva (strojeve, namjetaj, aparate, raunala i sl.), a koliko za obrtna
sredstva (novac na iro-raunu i zalihe repromaterijala).
Ako se poslovni plan koristiti u svrhu dobivanja kredita, treba napomenuti da veina programa
za obrtna sredstva ne doputa vie od 30 % ukupne investicije. U dijelu Tehnikotehnolokih
elemenata ulaganja opisuje se i kako e se djelatnost obavljati. Kada poduzetnik sam obavlja
djelatnost, nema potrebe zapoljavati druge djelatnike. Ali ako poduzetnik namjerava zapoljavati i druge djelatnike, mora odrediti koju strunu spremu djelatnici trebaju imati, koje e poslove obavljati, hoe li biti zaposleni na odreeno ili neodreeno vrijeme i koliku e mjesenu
plau imati. Poduzetnik treba biti upuen i u postojee programe sufinanciranja i zapoljavanja
pojedinih skupina nezaposlenih (vie informacija u Centru za poduzetnitvo Osijek ili Hrvatskom
zavodu za zapoljavanje).
U estom se dijelu Poslovnog plana Trina opravdanost naglasak stavlja na trite nabave, prodaju i procjenu ostvarenja prihoda. Potrebno je napraviti i popis dobavljaa s kojima e poduzetnik suraivati. Ukoliko poduzetnik posluje s vie dobavljaa i ako su dobavljai s podruja
Republike Hrvatske, takoer se moraju navesti. U planiranju nabave potrebno je odgovoriti na
sljedea pitanja: to e se, po kojoj cijeni (cijena sirovine direktno utjee na kvalitetu i cijenu
finalnog proizvoda) i kod kojeg dobavljaa nabavljati, koji su rokovi isporuke, postoje li dogovoreni uvjeti plaanja, koliki su trokovi nabave (prijevoz, carina, osiguranje). Mora se voditi
rauna i o sirovinama koje su u zalihama. Trite prodaje je izuzetno vaan dio poslovnog plana
jer odreuje to e se i po kojoj cijeni ili cijenama proizvoditi (cijenu treba usporediti s cijenom
koju nudi konkurencija), na kojem tritu (trite opine, mjesta, grada, upanije, Republike
161
POSLOVNI PLAN
Hrvatske ili ire) i tko su ciljni kupci (djeca, mladi, umirovljenici, pojedinci, tvrtke). Analiza se
trita prodaje koristi i podatcima Hrvatske gospodarske komore i Hrvatske obrtnike komore,
statistikim podatcima, utim stranicama i razliitim bazama podataka dostupnim u Centru za
poduzetnitvo Osijek. Prema svim se tim podatcima i planu prodaje odreuju proizvodni kapaciteti i prihodi koje se mogu ostvariti. U ovom se dijelu navode svi konkurenti i sve one prednosti
koje poduzetnik ima u odnosu na konkurenciju.
Najzahtjevniji su dio u izradi poslovnog plana Financijski elementi poduhvata i poduzetnici se
najee oslanjaju na strunu pomo u njegovoj izradi. Potrebno je napraviti granicu izmeu
investicije za osnovna (dugotrajna imovina: strojevi, namjetaj, oprema, aparati i sl.) i obrtna
sredstva (sredstva koja su trajno na raspolaganju za kupovinu repromaterijala i plaanje dospjelih obveza). Ukupne trokove poslovanja ine svi oni trokovi koji su navedeni u prethodnim
poglavljima poslovnog plana: trokovi osoblja (bruto plae vlasnika i djelatnika), trokovi sirovina koje su potrebne za finalizaciju vlastitog proizvoda ili usluge i svi ostali iznenadni trokovi.
Amortizacija je takoer troak, ali njega poduzetnik ne plaa sa svog iro-rauna. Izraunava se
samo za dugotrajnu imovinu, tj. osnovna sredstva prema Pravilniku o amortizaciji NN 54/01.
Tablica se sa stopama amortizacije nalazi u dodatnim radnim listovima.
U dijelu Izvori financiranja pravi se jasna granica izmeu vlastitih sredstava koja poduzetnik
unosi u investiciju i kreditnih sredstava koja je zatraio od odabrane poslovne banke i programa
kreditiranja. Navode se i uvjeti kreditiranja (kamatna stopa, poek, rok otplate, traeni iznos,
anuitet i interkalarna kamatna stopa), a od banke koja kreditira poduzetnika, trai se plan otplate kredita. Nakon to su prihodi izraunati, a trokovi razraeni, usporeuju se i izvodi se bruto
dobit. Bruto dobit se umanjuje za 20% (koliko iznosi porez na dobit) i dobiva se neto dobit.
Pokazatelji uinkovitosti podrazumijevaju izraune odreenih parametara prema unaprijed
odreenim formulama. U formule treba unijeti podatke koji su dobiveni u raunu dobiti i gubitaka te planirani broj djelatnika koje elite zaposliti.
ukupna investicija / broj zaposlenih =
investicija u osnovna sredstva / broj zaposlenih =
bruto dobit x 100 / ukupne investicije =
neto dobit x 100 / ukupne investicije =
bruto plae / broj zaposlenih =
U zakljunoj se ocjeni saimlje sve to je navedeno u poslovnom planu. Istie se broj osoba koje
poduzetnik namjerava zaposliti, prihode koje eli ostvariti i ocjene uinkovitosti. Da bi se dobila
cjelovita slika investicije, jo se jednom navodi: banka od koje poduzetnik trai kreditna sredstva (ukoliko ih trai), uvjeti potraivanja (kamatna stopa, poek, rok otplate) i svrha (osnovna
sredstva, obrtna sredstva).
162
MARKETING I MARKETING PLAN

7.4. Marketing i marketing plan
Ameriko marketinko udruenje marketinga marketing definira kao [17]. aktivnost, niz institucija i procesa za kreiranje, komuniciranje, isporuku i razmjenu ponuda koje imaju vrijednost za
kupce, klijente, partnere i drutvo u cjelini. Marketinki su ciljevi krajnji ishod koji poduzee eli
ostvariti implementacijom i provoenjem strategije marketinga. Tri su vrste ciljeva:
a)
ciljevi koji su orijentirani na prodaju
b)
ciljevi koji su orijentirani na proizvod
c)
trino orijentirani ciljevi [18].
Koncept marketinkog spleta (marketing mix) marketing promatra kao cjelinu koja se sastoji od
etiri elementa:
a)
proizvoda (engl. product)
b)
cijene (engl. price)
c)
distribucije (engl. place) i
d)
promocije (engl. promotion).
Prema poetnim slovima elemenata marketinkog spleta, ovaj je koncept poznat kao 4P koncept. Klju je marketinga identifikacija kupaca jer bez kupaca koji kupuje proizvod ili uslugu,
nema ni posla. Proces je segmentacije kupaca podjela trita u grupe potroaa koji imaju odreene zajednike karakteristike. Pet je faza segmentacije:
a)
identificirati postojeu poziciju poduzea na tritu
b)
identificirati varijable za segmentaciju i opisati potencijalne segmente
c)
vrednovati potencijale svakog segmenta i izabrati ciljni segment
d)
identificirati i razviti odgovarajuu strategiju pozicioniranja
e)
izabrati i primijeniti odgovarajuu marketinku strategiju
Marketinki strunjak rijetko moe zadovoljiti svakoga na tritu. Ne sviaju se svima iste itarice, hotelske sobe, restorani, automobili, koledi ili filmovi. Stoga marketinki strunjaci trite
dijele na segmente. Pregledom demografskih i bihevioralnih razlika meu kupcima, oni identificiraju i profiliraju razliite grupe kupaca koji su skloni ili zahtijevaju sline proizvodne i usluen
spletove. Marketinki strunjak tada odluuje koji segmenti predstavljaju najveu priliku, odnosno, koja su njihova ciljna trita. Za svako ciljno trite tvrtka razvija marketinku ponudu [19].
Marketinki je plan temelj svih marketinkih aktivnosti i mora biti u skladu sa strategijom poslovanja, tj. stratekim planom. Marketinki plan ima sljedee elemente i korake:
a)
Saetak
b)
Prvi korak: Definiranje svrhe (misije) poslovanja
c)
Drugi korak: Analiza situacije
d)
Trei korak: Utvrivanje marketinkih ciljeva
163
MARKETING I MARKETING PLAN

e)
etvrti korak: Selekcija ciljnog trita
f)
Peti korak: Oblikovanje marketinkih strategija
g)
esti korak: Provedba marketinkih aktivnosti
h)
Sedmi korak: Kontrola marketinkih aktivnosti
Saetak je marketinkog plana kratki prikaz najvanijih informacija koje su prikazane u marketinkom planu. Pie se tek nakon to je cijeli marketinki plan gotov, ali se u planu nalazi
na prvom mjestu. Svrha je poslovanja, tj. misija definirana poslovnim, tj. stratekim planom.
Analiza situacije najee se vri za izradu SWOT analize. Nakon to se marketinkim planom
utvrdi svrha poslovanja i analizira situacija u kojoj se poduzee nalazi, slijedi definiranje marketinkih ciljeva koji proizlaze iz analize situacije. Ciljevi moraju biti definirani i oblikovani tako
da doprinose ostvarenju ukupnog cilja poduzea. Poduzee istovremeno moe imati vie ciljeva
razliite vanosti, ali zajedniki moraju doprinijeti ostvarenju ukupnog cilja marketinga, a ukupni
cilj marketinga mora doprinositi ostvarenju ukupnog cilja poduzea. Selekcija je ciljnog trita
sljedea faza u izradi marketinkog plana. Proces je segmentacije temelj za odabir ciljnog trita,
tj. skupine potroaa kojoj e se prilagoavati marketinki splet tvrtke. Nakon to se tvrtka odluila za svoje ciljno trite i segment kupaca, kreira ponudu i oblikuju se marketinke strategije.
Strategije trebaju odgovoriti na sljedee pitanje: kako ostvariti zacrtane marketinke ciljeve uz
postojee resurse? Marketing poznaje brojne strategije, a poduzetnik bira onu koju smatra najboljom za svoju trenutnu situaciju i prilagoava ju u skladu sa specifinostima vlastitog poslovanja i okoline u kojoj djeluje. Zadnja dva koraka predstavljaju operativne aktivnosti marketinkog
plana. Za provedbu je marketinkih aktivnosti potrebno provesti sljedee aktivnosti:
a)
koordinirati marketinke aktivnosti
b)
omoguiti protok informacija unutar poduzetnikog subjekta
c)
dati ovlatenje djelatnicima za donoenje i provedbu odluka
Aktivnosti se kontroliraju zbog moguih odstupanja od plana. Ako neka aktivnost odstupa od
plana, mora se korigirati.
164
E-MARKETING
7.5. E-marketing
E-marketing ili Internet marketing je oglaavanje proizvoda i usluga putem Interneta. Promovira
internetsko sjedite, internetsku trgovinu, landing page ili blog upotrebom jednog ili vie servisa (sredstava) koji su dostupni na Internetu i/ili privlai posjetitelje ciljanom marketinkom porukom. Informatika je era najbri rastui fenomen kojeg drutvo poznaje. Danas se na Googleu
obavlja vie od 30 milijardi pretraivanja mjeseno. Za doseg od 50 milijuna radiju je trebalo
38, televiziji 13, Internetu 4, iPodu 3, a Facebooku 2 godine. Praenje razvoja novih trendova
iznimno je zahtjevan posao i jedan je od kljunih faktora uspjene online kampanje. Internet
oglaavanje ima nekoliko prednosti u odnosu na konvencionalne oblike. Kljuna je prednost
njegova niska cijena, ciljane skupine i lako mjerljiv povrat na investiciju. Oglaiva moe pratiti
sve relevantne statistike o posjetiteljima svoje internetske stranice i kupcima pojedinog proizvoda ili usluge. U svakom mu je trenutku poznato isplati li se neka investicija i na vrijeme moe
prekinuti one kampanje koje ne ostvaruju zadovoljavajui povrat. Ako je u promociji propalo
50% novca, znai da je promocija promaila ciljanu skupinu ili je odaslana putem krivog medija
u krivo vrijeme. Dakle, uinci se klasine promocije ne mogu izmjeriti. Zbog mogunosti mjerenja rezultata i direktnog utjecaja na tijek kampanje Internet marketing ima veliku popularnosti
i iroku primjenu.
Internet marketing poznaje est koraka kojima je cilj poveanje prodaje:
a)
izrada marketinke strategije: izrada ciljeva kampanje, identifikacija kupaca itd.
b)
izrada internetskog sjedita: dizajn, jednostavna navigacija, podrka za mobilne platforme itd.
c)
privlaenje posjetitelja: newsletter, blog, Facebook, Twitter, Forsquere,Google
d)
privlaenje posjetitelja: zanimljiv sadraj, poziv na akciju, privlane ponude itd.
e)
konverzija potencijalnog kupca u kupca (prodaja): jednostavna kupovina, isporuka itd.
f)
mjerenje rezultata: posjetitelji, bounce rate, troak po konverziji itd.
E-mail marketing je alat koji se svakodnevno koristi u komunikaciji s tritem. Zakon o elektronikim komunikacijama NN 73/08, lanak 107 navodi kako je uporaba pozivnih sustava, s ljudskim posredovanjem ili bez njega, telefaksnih ureaja ili elektronike pote, ukljuujui kratke
tekstovne poruke (SMS) i multimedijske poruke (MMS), u svrhu izravne promidbe i prodaje
doputena samo uz prethodno pribavljenu privolu pretplatnika ili korisnika usluga. Elektronika pota e-marketinga treba biti prilagoena mobilnim ureajima. Optimizacija se elektronike pote za mobilne ureaje postie izbjegavanjem velikih slika, smanjenjem koliine teksta
i izbacivanjem tablica. SEO je postupak optimizacije internetskog sjedita (sadraj i struktura) i
ostvarivanje kvalitetnih linkova prema internetskom sjeditu, a cilj je postizanje bolje organske
pozicije na trailicama. Rezultati istraivanja koje je proveo Google pokazuju da 97% korisnika
trailice ne gleda rezultate iza desetog mjesta. Kako veina kupaca dolazi do internetskih sjedita putem trailica SEO, proces je kljuan za privlaenje korisnika. Problem je to Google algoritam za odreivanje vanosti internetskog sjedita koristi preko 200 imbenika, a nemogue je
izvriti optimizaciju svih. Svi ovi imbenici djeluju zajedno i teko je odrediti koji od navedenih
imbenika ima veu vanost.
165
FINANCIRANJE POSLOVNOG PODUHVATA

7.6. Financiranje poslovnog poduhvata
PROCJENA TROKOVA POKRETANJA I POSLOVANJA
Osoba koja pokree poslovni poduhvat mora biti upoznata sa svim trokovima koji se tijekom
poslovanja pojavljuju. Upravo je nerealno sagledavanje i procjena trokova jedna od najveih i
najeih pogreaka u pokretanju poslovanja. Trokovi se definiraju kao novac (vrijednost) koji
se ulae u proizvodnju i prodaju proizvoda/usluga. Trokovi se moraju znati da bi se odredile
cijene proizvoda/usluga, da bi se kontrolirale i reducirale u donoenju boljih poslovnih odluka i
da bi se mogla lake planirati budunost. Visina trokova ovisi o vrsti posla kojom se pojedinac
eli baviti i o pravnom obliku poslovanja. Trokovi su:
a)
trokovi osoblja: neto plaa zaposlenika uveana za doprinose na i doprinose iz plae te
porez i prirez.
b)
materijalni trokovi: svi trokovi vezani uz nabavu sirovina i materijala, sitnog inventara,
rezervnih dijelova, energiju, gorivo. Trokovi se izraunaju tako da se pomnoi koliina sirovina,
materijala, gotovih proizvoda, energije i drugih materijalnih inputa s njihovom nabavnom cijenom.
c)
trokovi kapitala: svi trokovi vezani uz posueni novac (kamate na kreditna sredstva,
prekoraenje na iro-raunu i amortizacija).
d)
ostali trokovi: trokovi vode, struje, telefona, grijanja, uredskog materijala, najamnina,
marketinga, osiguranja, lanarine HOK i HGK, raunovodstvenog servisa, bankovne naknade,
poreza na tvrtku i ostalo.
Trokovi se dijele na fiksne i varijabilne. Fiksni se trokovi javljaju neovisno o tome obavlja li se
djelatnost ili ne. To su trokovi najamnine, osiguranja, telefonska pretplata, leasing, kamate itd.
Varijabilni trokovi su direktno vezani uz samu djelatnost i u ovisnosti su s koliinom proizvodnje
(sirovine, energija, transportni trokovi itd.).
PRAVNI OBLICI
Pri odabiru se pravnog oblika u obzir treba uzeti: djelatnost koju e osoba obavljati, odgovornost, porez, nain voenja poslovnih knjiga i trokova i sloenost registracije.
OBRT
Obrt je samostalno i trajno obavljanje doputenih gospodarskih djelatnosti od strane fizike
osobe sa svrhom ostvarivanja dohotka, a koji se ostvaruje proizvodnjom, prometom ili pruanjem usluga na tritu.
Tri su vrste obrta:
a)
Vezani su obrti oni obrti za ije se obavljanje trai odreena struna sprema, ispit o
strunoj osposobljenosti ili majstorski ispit (npr. frizer). Svi su vezani obrti navedeni u Pravilniku
o vezanim i povlatenim obrtima i nainu izdavanja povlastica [20].
b)
Slobodni su obrti svi obrti koji nisu navedeni u pravilniku i za njihovo obavljanje nije
vana struna sprema niti je potrebno imati ispit o strunoj osposobljenosti ili majstorski ispit.
166

c)
Povlateni se obrti smiju obavljati samo na temelju povlastice koju izdaje nadleno ministarstvo (ribarstvo, rudarstvo, proizvodnja i prodaja oruja).
Trokovi osnivanja
Obrti se osnivaju u Uredima dravne uprave i Slubi za gospodarstvo. Trokovi osnivanja su
obrtnica (200,00 kn) i upravna pristojba (270,00 kn). Djelatnosti trgovine i ugostiteljstva trebaju
dodatnu potvrdu kojom se dokazuje da su zadovoljeni minimalno-tehniki uvjeti za rad (upravna pristojba 420,00 kn).
Troak doprinosa i poreza
Ako osoba nije zaposlena ili osigurana po nekoj drugoj osnovi (npr. kod poslodavca), duna je
obraunavati i uplaivati doprinose za mirovinsko i zdravstveno osiguranje. Osnovica za utvrivanje navedenih doprinosa mijenja se svake godine. Za 2013. godinu osnovica iznosi 5.133,55
kn. Prema navedenoj bi osnovici mjesena davanja za doprinose iznosila 1.720,71 kn. Prvu godinu poslovanja obrtnik poetnik ne plaa porez na dohodak, a nakon podnoenja prve porezne prijave, odreuje se iznos poreza i prireza koji obrtnik mora platiti za prethodnu godinu.
Odreuje mu se i iznos akontacije poreza i prireza za sljedeu godinu. Obrtnici su obvezni plaati
lanarinu Hrvatskoj obrtnikoj komori. Obrtnici s podruja grada Osijeka plaaju lanarinu u
iznosu od 93,00 kn mjeseno (uplauje se tromjeseno). Obrtnici su obveznici poreza na dohodak (stope 12%, 25% i 40 %) i na zahtjev mogu postati obveznici poreza na dobit (20 %).
Sljedee su prednosti osnivanja obrta:
a)
brzina i niski trokovi osnivanja
b)
podizanje novca sa iro rauna bez ikakvog pravdanja (svi novci koji nisu opravdani
porezno priznatim trokovima, smatraju se dohotkom i oporezuju se)
c)
jednostavnije i jeftinije knjigovodstvo
d)
PDV se plaa samo ako je naplaen od kupaca
e)
jednostavnije i jeftinije mijenjanje podataka (promjena adrese, djelatnosti i sl.).
f)
brzina i niski trokovi zatvaranja obrta
J.D.O.O.
Izmjenama Zakona o trgovakim drutvima, otvorena je mogunost osnivanja jednostavnog
drutva s ogranienom odgovornou. Jednostavni d.o.o. ima veinu obiljeja d.o.o., ali se razlikuje od d.o.o. jer ima smanjeni prag temeljnog kapitala (deset kuna), smanjene trokove osnivanja i ubrzani postupak osnivanja. Jednostavni d.o.o. ima zakonske rezerve u koje mora unijeti
etvrtinu iznosa dobiti drutva iskazane u godinjim financijskim izvjeima umanjene za iznos
gubitka iz prethodne godine.
Trokovi osnivanja j.d.o.o.
Prvi je korak u osnivanju j.d.o.o. odabir imena za tvrtku, a nakon toga odlazak u servis HITRO.HR
ili ured javnog biljenika. Kod javnog se biljenika potpisuje i ovjerava sva potrebna dokumenta-
167

cija za osnivanje tvrtke (Zapisnik o osnivanju, Prijava za upis drutva u sudski registar i potvrda
o nepostojanju duga). Troak javnog biljenika iznosi 500,00 kn, a ovjera izjave o nepostojanju
dugovanja 47,50 kn. Sa svom se dokumentacijom odlazi u banku, otvara se raun i uplauje se
temeljni kapital u minimalnom iznosu od deset kuna.
Treba se uplatiti i sudska pristojba u iznosu od 60,00 kn i naknada za objavu oglasa u Narodnim
novinama u iznosu od 200,00 kn. Ponovno se odlazi u ured javnog biljenika sa svom dokumentacijom i podnosi se zahtjev za osnivanje j.d.o.o. Ako je cjelokupna dokumentacija ispravna,
Registar Trgovakog suda mora u roku od 24 sata dostaviti rjeenje o osnivanju. Ukupan troak
osnivanja j.d.o.o. iznosi 807,50 kn.
S rjeenjem o registraciji odlazi se u HITRO.HR i popunjava se obrazac za dobivanje Obavijesti
o razvrstavanju poslovnog subjekta prema NKD (Nacionalna klasifikacija djelatnosti). HITRO.
HR alje obrazac u Dravni zavod za statistiku koji za jedan dan alje Obavijest o razvrstavanju
poslovnog subjekta prema NKD.
D.O.O.
Trgovako drutvo je pravna osoba koja samostalno i trajno obavlja gospodarsku djelatnost kako
bi ostvarila dobiti proizvodnjom, prometom robe ili pruanjem usluga na tritu. D.o.o. je trgovako drutvo u koje jedna ili vie pravnih ili fizikih osoba ulau svoje temeljne uloge i sudjeluju
u unaprijed dogovorenom temeljnom kapitalu (glavnici).
Trokovi osnivanja d.o.o.
Drutvo se s ogranienom odgovornou osniva na temelju Izjave o osnivanju (ako drutvo osniva samo jedna osoba) ili Drutvenog ugovora (ako postoji vie osnivaa), a oba se sastavljaju kod
javnog biljenika. Prvi je korak u osnivanju d.o.o. prikupljanje osnovnih informacija o osnivanju,
obrazaca i uplatnica na HITRO.HR. Javni biljenik izrauje cjelokupnu dokumentaciju za osnivanje, a cjelokupni trokovi iznose oko 2.500,00 kn. Ostali su trokovi: sudska pristojba (400,00
kn), objava oglasa u Narodnim novinama (900,00 kn), potvrda o uplati osnivakog uloga (39,00
kn), obavijest o razvrstavanju (25,00 kn) te online osnivanje (100,00 kn). Za osnivanje d.o.o. potrebno je imati 20.000,00 kn osnivakog kapitala koji se polae na raun tvrtke. Osnivaki ulog
moe biti u novcima ili stvarima: ulog u novcu mora iznositi minimalno 10.000,00 kn, a ako su
ulog stvari, nuna je procjena.
Troak doprinosa i poreza
Ako je osoba nezaposlena i otvara d.o.o., nije obvezna biti u radnom odnosu, ali obvezna je
plaati doprinose na poduzetniku plau. Osnovica za obraun doprinosa iznosi 8.653,70 kn, a
doprinosi za mirovinsko i zdravstveno osiguranje 2.911,97 kn. Meutim, osoba se moe prijaviti i na manju osnovicu, a doprinosi se uplauju ovisno o visini iznosa plae. D.o.o. i j.d.o.o. su
obveznici poreza na dobit koji iznosi 20 %. Sve su tvrtke obvezne plaati i prirez na porez (visina
se odreuje ovisno o mjestu registracije; npr. za Osijek je prirez 13 %). D.o.o. je obvezan plaati
lanarinu HGK-u u iznosu od 55,00 kn (za male poslovne subjekte).
168

PROCJENA CIJENA PROIZVODA/USLUGA
Kalkulacija je izraunavanje ukupnih trokova proizvodnje i prodaje proizvoda ili pruanja usluga.
IZRAUN TOKE POKRIA
Toka pokria je toka u kojoj su prihodi jednaki rashodima, tj. koliko se proizvoda ili usluga
mora prodati da bi se bilo na nitici.
AMORTIZACIJA
Amortizacija je gubitak vrijednosti opreme i strojeva u dugotrajnoj imovini poduzea i kao
takva predstavlja troak. Obraunava se na dugotrajnu imovinu, ija je pojedinana nabavna
vrijednost vea od 2.000,00 kn. Osnovna sredstva amortiziraju se prema vijeku trajanja, odnosno stopi amortizacije [21].
Financiranje poslovnog poduhvata
Prije pokretanja poslovanja procjenjuje se vrijednost cjelokupne investicije, tj. iznos koji je dovoljan za neometano poslovanje. Sljedei je korak pronalaenje izvora sredstva za financiranje
poslovnog poduhvata, a neki od izvora su:
a)
vlastita sredstva
b)
posudba od obitelji i prijatelja
c)
kreditna sredstva
d)
poslovni aneli
e) leasing
f)
dravne potpore
169
LITERATURA
8. LITERATURA
[1]
Dribbble LLC, www.dribble.com
[2]
Android Developers, www.developers.android.com
[3]
GIMP (GNU Image Manipulation Program), www.gimp.org
[4]
Color Scheme Designer, www. colorschemedesigner.com
[5]
Colors on the Web, Color Wizard, www.colorsontheweb.com/colorwizard.asp
[6]
http://docs.oracle.com/javase/tutorial/java/nutsandbolts/variables.html
[7]
http://www.tutorialspoint.com/java/java_basic_operators.htm
[8]
http://docs.oracle.com/javase/tutorial/java/nutsandbolts/if.html
[9]
http://docs.oracle.com/javase/tutorial/java/javaOO/methods.html
[10]
http://docs.oracle.com/javase/tutorial/java/IandI/abstract.html
[11]

http://www.techotopia.com/index.php/Understanding_Android_Views,_View_Gro
ups_and_Layouts
[12]
http://developer.android.com/training/basics/supporting-devices/languages.html
[13]
http://developer.android.com/training/basics/supporting-devices/screens.html
[14]
http://developer.android.com/training/basics/activity-lifecycle/index.html
[15]
http://developer.android.com/training/basics/activity-lifecycle/starting.html
[16]
http://developer.android.com/training/basics/activity-lifecycle/recreating.html
[17].

American Marketing Association (AMA), definicija marketinga, Listopad 2007,

http://www.marketingpower.com/AboutAMA/Pages/DefinitionofMarketing.aspx
[18].
Grbac, B., Identitet marketinga, Ekonomski fakultet Rijeka, str 355, 2006.
[19].

Kotler, Ph. i Keller, K.L., Upravljanje marketingom, dvanaesto izdanje, Mate, Zagreb,
str. 24, 2006
[20].

Hrvatska obrtnika komora (HOK), http://www.hok.hr/cro/o_hok_u/propisi/

pravilnik_o_vezanim_i_povlastenim_obrtima_i_nacinu_izdavanja_povlastica
[21].
Orkis, http://www.orkis.hr/Stope-amortizacije~1
170
POPIS SLIKA
9. POPIS SLIKA
Slika 1. Newtonov kota boja 2
Slika 2. Alati za izbor boja 3
Slika 3. Primjeri vintage dizajna kod izrade UI-a i logotipa [1]3
Slika 4. Primjeri logotipa [1] 4
Slika 5. Primjer smjernica izvedenih iz imena tvrtke ili pojedinca4
Slika 6. Nekoliko prijedloga logotipa za istu tvrtku [1]5
Slika 7. Veze izmeu vizualnog identiteta i izgleda aplikacije [1]6
Slika 8. Razne veliine Android ureaja [2]6
Slika 9. Primjer veliine jedne ikone za razliite gustoe piksela [2]6
Slika 10. Odnosi veliine ekrana mobilnog telefona i tablet raunala [2]7
Slika 11. Optimalna veliina nekog klikabilnog elementa suelja [2]7
Slika 12. Primjeri izbornika i sadraja [1] 8
Slika 13. Primjeri dviju vrsta izbornika [1]8
Slika 14. Od skice na papiru do gotovog suelja [1]9
Slika 15. Primjer stanja gumba 10
Slika 16. Primjer dizajna koji je prilagoen korisniku [2]10
Slika 17. Primjeri nekih bezvremenskih inaica dizajna [2]11
Slika 18: Primjeri digitalnog oblika koncepta, tj. wireframe 12
Slika 19: Primjer postavljanja smjernica12
Slika 20. Koraci u izradi koncepta, tj. wireframea12
Slika 21. Animacija od prve do zadnje sliice [1]13
Slika 22. Dizajn aplikacije 14
Slika 23. Primjer ikona [2] 14
Slika 24. Primjer dviju standardnih tema Android sustava [2]15
Slika 25. Primjer efekta nakon dodira prstom [2]15
Slika 26. Primjer dimenzionalnih odredbi i raspored elemenata[2]15
Slika 27. Izgled Roboto slubenog fonta [2]16
Slika 28. Predefinirane veliine teksta [2]17
Slika 29. Primjeri raspona boja 17
Slika 30. Primjer ikona, tj. dubine kod poetnog zaslona [2]17
Slika 31. Ikona za alatnu traku ima propisanu veliinu 32x32dp [2]18
Slika 32. Korisniko suelje GIMP-a: 1. Traka s alatima; 2. Radna povrina; 3. Traka s bojama i slojevima18
Slika 33. Postavljanje novog dokumenta u GIMP-u19
Slika 34. Postavljanje alata u GIMP-u: 1. oznaava se Rectangle selection tool; 2. u postavkama Rectangle selection tool oznaava se da kvadrat ima zaobljen rub, a nakon toga se zadaje polumjer od 12px; 3. dranjem lijevog klika na miu i povlaenjem mia
preko radne povrine ocrtava se osnovni oblik kvadrata sa zaobljenim rubom20
Slika 35. Postavljanje alata za bojenje u GIMP-u: 1. oznaava se Bucket fill tool i otvara se dijalog za izmjenu boje ispune; 2. u
otvorenom dijalogu odabire se boja za ispunu objekta; 3. klikom unutar granica objekta (iscrtan dio) nanosi se boja ispune ime
zavrava bojanje objekta 20
Slika 36. Kopiranje objekta u GIMP-u: 1. klikom na tipku za kopiranje Layera, odnosno sloja radi se kopija objekta; 2. klikom na
tipku (simbol oka) pored kopiranog sloja skriva se kopija od pogleda21
Slika 37. Blur filter u GIMP-u: 1. u glavnom se izborniku bira Filters; 2. u padajuem se izborniku obiljeava Blur i klika se na Gaussian
Blur 21
Slika 38. Blur filter u GIMP-u: 1. u novootvorenom dijalogu postavljaju se vrijednosti blur po horizontalnoj i vertikalnoj osi; 2. pritiskom na tipku OK dodajemo efekt na na objekt22
171
Slika 39. Izgled jedne gotove ikone sa zaobljenim rubovima i sjenom na Android ureaju s odreenom pozadinskom slikom.22
Slika 40. Primjer obavijesti dolazne poruke 23
Slika 41. Primjer jedne alatne trake koja sadri osnovne alate: pretraga, opcije itd. [2]23
Slika 42. Primjer Swipe View navigacije pokretom u lijevo [2]24
Slika 43. Confirming & Acknowledging [2]24
Slika 44. Najpopularniji primjeri widgeta [2]24
Slika 45. Primjeri Reusable UI elemenata [1]25
Slika 46. Google Play i Scrollable tabs26
Slika 47. Primjer fiksnih kartica (Fixed tabs)26
Slika 48. Liste s jednim i vie redova podataka27
Slika 49. Primjer reetke s vertikalnim pomakom27
Slika 50. Reetke sa slikom i naslovima28
Slika 51. Primjer spinnera u formi ili alatnoj traci28
Slika 52. Primjer malog i velikog gumba29
Slika 53. Primjer gumba bez ruba 29
Slika 54. Primjer tekstualnog unosa 30
Slika 55. Primjer klizaa u standardnim Android 4.0 temama30
Slika 56. Traka napretka sa standardnom temom Android 4.0 sustava31
Slika 57. Traka aktivnosti sa standardnom temom Android 4.0 sustava31
Slika 58. Lijevo je prikazan neispravan, a desno ispravan nain prikazivanja krunog indikatora31
Slika 59. Unikatni indikator napretka32
Slika 60 Prikaz checkboxa i izgled svih njegovih stanja32
Slika 61. Prikaz radio buttona i izgled svih njegovih stanja32
Slika 62. Prikaz on/off gumba i izgled svih njegovih stanja33
Slika 63. Primjer dijaloga 33
Slika 64. Nekoliko razliitih verzija dijaloga34
Slika 65. Prikaz standardnog Pickera koji je smjeten u dijalogu34
Slika 66. Prikaz specijalnog pickera: vrijeme i datum34
Slika 67. Back ili tipka za povratak na prijanji sadraj35
Slika 68. Primjer rada Back tipke kao dijela aplikacije i kao dijela ureaja35
Slika 69. Primjer navigacije kroz suelje widgeta36
Slika 70. Primjer distorzije na gumbu s unikatnom grafikom38
Slika 71. Izgled datoteka za razliite gustoe zaslona38
Slika 72. Izgled poetnog zaslona aplikacije za izradu 9.png grafika39
Slika 73. Izgled zaslona aplikacije za izradu 9.png grafika nakon dodavanja grafike39
Slika 74. Dodavanje toaka koje kontroliraju irenje slike40
Slika 75. Raspored elemenata u horizontalnom layoutu42
Slika 76. Raspored elemenata u Relative layoutu43
Slika 77. Opi oblik jednodimenzionalnog polja51
Slika 78. Ispis stanja objekta ormar u konzoli55
Slika 79. Ispis opsega dviju krunica u konzoli56
Slika 80. U drugoj klasi nije mogue pozvati private metode57
Slika 81. Instalacija Android SDK plugina66
Slika 82. Android SDK Manager 67
172
Slika 83. Kreiranje Android emulatora68

Slika 84. Kreiranje Android projekta 68
Slika 85.Arhitektura Android projekta70
Slika 86. Hello World aplikacija 71
Primjer 51. XML element podrava vei broja atributa73
Slika 87. Odnos strukture objekata i XML strukture73
Slika 88. Spajanje XML layouta u aktivnost74
Slika 89. Micanje Title Bar programski75
Slika 89. Pokretanje aktivnosti u emulatoru81
Slika 90. ivotni ciklus aktivnosti [15]82
Slika 91. Android Log s prikazom ispisanih vrijednosti u svakom stanju ivotnog ciklusa84
Slika 92.Spremanje i ponovno kreiranje stanja aktivnosti [16]85
Slika 93. Direktoriji i datoteke za lokalizaciju86
Slika 94. Direktoriji za slike za ureaje razliitih gustoa ekrana88
Slika 95. Aktivnost koja sadri dva fragmenta91
Slika 96. Dretve jedne Android aplikacije92
Slika 97 Preference Activity 97
Slika 98. Dohvaanje vrijednosti iz Shared Preferences98
Slika 99. ListView sa stavkama gradova99
Slika 100. ListView koji reagira na pritisak korisnika101
Slika 101. Primjer izgleda stavke ListViewa104
Slika 102. ListView s vlastitim adapterom106
Slika 103. HotelDetalsActivity aktivnost108
Slika 104. Action Bar 109
Slika 105. Prikaz menija s atributom ifRoom110
Slika 106. Prikaz menija s atributom never110
Slika 107. Action Bar s tab navigacijom115
Slika 108. Odabrani Tab1 117
Slika 109. Odabrani Tab2 117
Slika 110. Odnos atributa objekta i stupaca u tablici118
Slika 111. Prvotna pozicija Cursor objekta121
Slika 112. Aktivnost unosa podataka o osobi122
Slika 113. Popis svih osoba iz baze124
Slika 114. Prikaz vrijednosti akcelerometra127
Slika 115. Postavljanje Google Maps API-a128
Slika 116. Google Play Services biblioteka u SDK Manageru128
Slika 117. Dodavanje biblioteke u aplikaciju129
Slika 118. Kreiranje projekta na Google konzoli129
Slika 119. Postavljanje koritenja Google Maps Android API v2 u Google konzoli130
Slika 120. Dijalog za upisivanje SHA1 kljua + package130
Slika 121. Generiranje SHA1 kljua preko CMD131
Slika 122. Package koji se treba upisati zajedno sa SHA1 kljuem131
Slika 123 Unos SHA1 kljua + package u Google konzolu132
Slika 124. Generirani API key u Google konzoli132
173
Slika 125. Prikaz Android Google Maps API v2135

Slika 126. Pokrenute aplikacije na ureaju136
Slika 127. Ponaanje Android stoga137
Slika 128. Item element u RSS-u 139
Slika 129. Opi izgled RSS-a 141
Slika 130. Lista elemenata kada je inline = false142
Slika 131. Splash Activity 147
Slika 132. Izgled NewsListActivity aktivnosti151
Slika 133. Izgled NewsDetailsActivity aktivnosti155
Slika 134. Zamjena launcher ikone u manifestu156
174
10. POPIS TABLICA

Tablica 1. Aritmetiki operatori.......................................................................................................................................................... 47
Tablica 2. Relacijski operatori............................................................................................................................................................. 47
Tablica 3. Logiki operatori................................................................................................................................................................. 48
Tablica 4. Poduzetnike vjetine i osobine........................................................................................................................................ 159
175
11. POPIS PRIMJERA

Primjer 1. Parametri metode.............................................................................................................................................................. 47
Primjer 2. If-then naredba.................................................................................................................................................................. 48
Primjer 3. If-then naredba u jednom retku........................................................................................................................................ 48
Primjer 4. If-then-else naredba.......................................................................................................................................................... 49
Primjer 5. If-the-else grananje............................................................................................................................................................ 49
Primjer 6. Switch naredba.................................................................................................................................................................. 49
Primjer 7. While petlja........................................................................................................................................................................ 50
Primjer 8. Neograniena while petlja................................................................................................................................................. 50
Primjer 9. Do-while petlja.................................................................................................................................................................. 50
Primjer 10. Opi oblik for petlje......................................................................................................................................................... 50
Primjer 11. For petlja.......................................................................................................................................................................... 50
Primjer 12. Popunjavanje i indeksiranje polja.................................................................................................................................... 51
Primjer 13. Popunjavanje polja u deklaraciji...................................................................................................................................... 51
Primjer 14. Polje u polju (dvodimenzionalno polje)........................................................................................................................... 52
Primjer 15. Opi oblik dvodimenzionalnog polja................................................................................................................................ 52
Primjer 16. Pretvaranje ulaznih jedinica u izlazne.............................................................................................................................. 52
Primjer 17. Metoda s dva parametra................................................................................................................................................. 53
Primjer 18. Potpis metode.................................................................................................................................................................. 53
Primjer 19. Primjeri naziva metoda.................................................................................................................................................... 53
Primjer 20. Preoptereivanje metoda................................................................................................................................................ 53
Primjer 21. Klasa ormar...................................................................................................................................................................... 54
Primjer 22. Izmjena stanja objekta kroz metode................................................................................................................................ 54
Primjer 23. Klasa krunica s metodom izraunajOpseg()................................................................................................................... 55
Primjer 24. Raunanje opsega dviju razliitih krunica....................................................................................................................... 55
Primjer 25. Private i public metode Krunice..................................................................................................................................... 57
Primjer 26. Klasa krunica.................................................................................................................................................................. 58
Primjer 27. Dodjeljivanje jednostavnog tipa podataka....................................................................................................................... 58
Primjer 28. Dodjeljivanje vlastitog tipa podataka............................................................................................................................... 58
Primjer 29. Direktni pristup varijabli.................................................................................................................................................. 59
Primjer 30. Enkapsulacija varijabli...................................................................................................................................................... 59
Primjer 31. Pristup varijabli preko set metode................................................................................................................................... 59
Primjer 32. Konstruktor krunice s parametrima koordinata i polumjerom....................................................................................... 60
Primjer 33. Konstruiranje objekta pomou vlastitog konstruktora.................................................................................................... 60
Primjer 34. Klasa s veim brojem konstruktora.................................................................................................................................. 60
Primjer 35. Kreiranje objekta s osnovnim konstruktorom.................................................................................................................. 60
Primjer 36.Klasa Zaposlenik............................................................................................................................................................... 61
Primjer 37. Klasa Inenjer nasljeuje klasu Zaposlenik...................................................................................................................... 62
Primjer 38. Apstraktna klasa pomakni................................................................................................................................................ 62
Primjer 39. Apstraktna klasa s apstraktnom metodom...................................................................................................................... 62
Primjer 40. Klasa Zaposlenik koja e sluiti kao nadklasa................................................................................................................... 62
Primjer 41. Klasa Inenjer mora implementirati apstraktne metode................................................................................................. 63
Primjer 42. Metoda printDescription()............................................................................................................................................... 63
176
Primjer 43.Klasa Inenjer.................................................................................................................................................................... 64

Primjer 44. Klasa Arhitekt................................................................................................................................................................... 64
Primjer 45. Polimorfizam:sva su tri zaposlenika istog tipa, ali su instancirani kao razliiti objekti..................................................... 65
Primjer 46. Metoda kao parametar prima tip Zaposlenik.................................................................................................................. 65
Primjer 47. U metodu se mogu slati sve podklase klase Zaposlenik.................................................................................................. 65
Primjer 48 Najmanja i najvia podrana verzija OS-a u manifestu..................................................................................................... 70
Primjer 49. Definiranje aktivnosti u manifestu................................................................................................................................... 70
Primjer 50. Identifikator activity_main layouta.................................................................................................................................. 72
Primjer 51. osnovni XML element...................................................................................................................................................... 72
Primjer 52. XML atribut elementa...................................................................................................................................................... 72
Primjer 53. XML element koji je istovremeno otvoren i zatvoren...................................................................................................... 73
Primjer 54. XML prikaz strukture podataka........................................................................................................................................ 73
Primjer 55. Button View u Android XML-u......................................................................................................................................... 74
Primjer 56. Micanje Title Bara u manifestu........................................................................................................................................ 75
Primjer 57. Definiranje XML layouta................................................................................................................................................... 76
Primjer 58 Definiranje string resursa u string.xml datoteci................................................................................................................ 77
Primjer 59. Referenciranje string resursa u TextViewu....................................................................................................................... 77
Primjer 60. XMl layout datoteka s Buttonom..................................................................................................................................... 78
Primjer 61. Pokretanje aktivnosti pomoi Intent objekta................................................................................................................... 79
Primjer 62. XML layout datoteka druge aktivnosti............................................................................................................................. 80
Primjer 63. Aktivnost koja se pokree pomou Intent objekta........................................................................................................... 80
Primjer 64 Definiranje aktivnosti u manifestu.................................................................................................................................... 81
Primjer 65. Ispis stanja ivotnog ciklusa aktivnosti u Log................................................................................................................... 83
Primjer 66. Primjer lokalizacije za engleski jezik................................................................................................................................. 86
Primjer 67. Primjer lokalizacije za panjolski jezik.............................................................................................................................. 86
Primjer 68. Primjer lokalizacije za francuski jezik............................................................................................................................... 87
Primjer 69. Definiranje fragmenta u layout XMLu.............................................................................................................................. 89
Primjer 70. Definiranje XML layout datoteke za fragment................................................................................................................. 89
Primjer 71. Kreiranje FirstFragment klase.......................................................................................................................................... 90
Primjer 72. Definiranje dva fragmenta u layout aktivnosti................................................................................................................. 90
Primjer 73. XML layout prvog fragmenta........................................................................................................................................... 91
Primjer 74. XML layout drugog fragmenta......................................................................................................................................... 91
Primjer 75. Kreiranje MyAsyncTask klase........................................................................................................................................... 93
Primjer 76 Ugnijeena MyAsyncTask klasa....................................................................................................................................... 94
Primjer 77. Pokretanje asinkronog poziva.......................................................................................................................................... 95
Primjer 78.. XML layout za aktivnost korisnikih postavki.................................................................................................................. 96
Primjer 79. Kreiranje PrefActivity klase.............................................................................................................................................. 97
Primjer 80. XML layout aktivnosti koja sadri ListVIew...................................................................................................................... 98
Primjer 81. Kreiranje adaptera u aktivnosti i postavljanje u ListView................................................................................................. 99
Primjer 82. Postavljanje OnItemClickListener na ListView............................................................................................................... 100
Primjer 83. Klasa Hotel..................................................................................................................................................................... 101
Primjer 84. Postavljanje vrijednosti u Bundle objekt........................................................................................................................ 102
Primjer 85. Postavljanje serijaliziranog objekta u Bundle objekt..................................................................................................... 102
Primjer 86.. Popunjavanje liste, instanciranje adaptera i popunjavanje ListViewa.......................................................................... 103
177
Primjer 87. Definiranje XML layouta za izgled stavke ListViewa....................................................................................................... 104

Primjer 88. Kreiranje vlastitog adaptera........................................................................................................................................... 105
Primjer 89. Postavljanje OnItemClickListenera na ListView.............................................................................................................. 107
Primjer 90. Kreiranje HotelDetailsActivity klase............................................................................................................................... 108
Primjer 91. Kreiranje ListActivity aktivnosti...................................................................................................................................... 109
Primjer 92. Menu s jednim gumbom................................................................................................................................................ 110
Primjer 93. Uitavanje menija.......................................................................................................................................................... 111
Primjer 94. Rukovanje odabira elemenata u meniju........................................................................................................................ 111
Primjer 95. Postavljanje Home elementa kao navigaciju unazad..................................................................................................... 112
Primjer 96. Kreiranje tabova kao tipove navigacije.......................................................................................................................... 113
Primjer 97. Klasa s Tab navigacijom.................................................................................................................................................. 114
Primjer 98. Main Activity s izmjenom fragmenata u tabovima........................................................................................................ 116
Primjer 99. Android SQLiteOpenHelper klasa................................................................................................................................... 119
Primjer 100. PersonDataSource klasa............................................................................................................................................... 120
Primjer 101. Person klasa................................................................................................................................................................. 122
Primjer 102. Aktivnost za unos podataka u bazu.............................................................................................................................. 123
Primjer 103. itanje podataka iz baze i uitavanje u listu................................................................................................................ 124
Primjer 104. Koritenje senzora....................................................................................................................................................... 126
Primjer 105. Meta data element za manifest................................................................................................................................... 132
Primjer 106. Permission element za manifest.................................................................................................................................. 133
Primjer 107. Uses feature element za OpenGL ES 2......................................................................................................................... 133
Primjer 108. Manifest sa svim potrebnim elementima za koritenje Android Google Maps API v2................................................ 134
Primjer 109.Referenciranje Map fragmenta u layoutu aktivnosti.................................................................................................... 135
Primjer 110. Aktivnost koja sadri Google mape.............................................................................................................................. 135
Primjer 111. RSS klasa...................................................................................................................................................................... 141
Primjer 112. Channel klasa............................................................................................................................................................... 142
Primjer 113. Item klasa..................................................................................................................................................................... 143
Primjer 114. Enclosure klasa............................................................................................................................................................. 144
Primjer 115. DalmacijaNewsLIstener interface................................................................................................................................ 144
Primjer 116. Asinkrono skidanje i parsiranje RSS-a.......................................................................................................................... 145
Primjer 117. Splash Activity klasa..................................................................................................................................................... 146
Primjer 118.. Layout SplashActivity aktivnosti................................................................................................................................. 147
Primjer 119. NewsListActivity klasa.................................................................................................................................................. 148
Primjer 120. list_item_dalmacija_news layout datoteka................................................................................................................. 149
Primjer 121. DalmacijaNewsAdapter klasa...................................................................................................................................... 150
Primjer 122.NewsListActivity aktivnost s ListItemClick listenerom.................................................................................................. 152
Primjer 123. Activity_news_details layout datoteka........................................................................................................................ 153
Primjer 124. NewsDetailsActivity klasa............................................................................................................................................ 154
178

Skripta Dizajn I Programiranje Mobilnih Aplikacija PDF

Uploaded by

Document Information

Original Title

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

Skripta Dizajn I Programiranje Mobilnih Aplikacija PDF

Uploaded by

Copyright:

Available Formats

Razvoj mobilnih aplikacija

Dizajn mobilnih aplikacija

2. DIZAJN KORISNIKOG SUELJA..................................................................................7

2.15.6. Gumb (engl. Button)...................................................................................................... 28

4. OBJEKTNO ORIJENTIRANO PROGRAMIRANJE......................................................... 58

5. RAZVOJ APLIKACIJA ZA ANDROID PLATFORMU....................................................66

5.6. ivotni ciklus Android aktivnosti [14]................................................................................. 81

6. IZRADA ANDROID APLIKACIJE................................................................................ 138

Slika 1. Newtonov kota boja

Iz ovih su osnova proizala dva sustava boja u raunalnom svijetu:

Slika 2. Alati za izbor boja

1.2. Teorija dizajna

grafiki dizajn (naljepnice, plakati, logotipi)

industrijski dizajn (engl. product design) (strojevi, automobili, kuanski aparati)

tekstilni dizajn (materijali i krojevi)

Slika 3. Primjeri vintage dizajna kod izrade UI-a i logotipa [1]

1.3. Dizajn logotipa i identiteta

Slika 4. Primjeri logotipa [1]

Slika 5. Primjer smjernica izvedenih iz imena tvrtke ili pojedinca

Slika 6. Nekoliko prijedloga logotipa za istu tvrtku [1]

1.4. Dizajn grafikih elemenata

Slika 7. Veze izmeu vizualnog identiteta i izgleda aplikacije [1]

Slika 8. Razne veliine Android ureaja [2]

Slika 9. Primjer veliine jedne ikone za razliite gustoe piksela [2]

DIZAJN KORISNIKOG SUELJA

2.2. Odnos izmeu DP i PX

Slika 11. Optimalna veliina nekog klikabilnog elementa suelja [2]

DIZAJN KORISNIKOG SUELJA

Slika 12. Primjeri izbornika i sadraja [1]

Slika 13. Primjeri dviju vrsta izbornika [1]

DIZAJN KORISNIKOG SUELJA

Slika 14. Od skice na papiru do gotovog suelja [1]

2.4. Osnove uspjenog dizajna

2.5. Korisniki unos za mobilne ureaje i ekrane osjetljive na dodir

DIZAJN KORISNIKOG SUELJA

Slika 15. Primjer stanja gumba

2.6. Dizajn prilagoen korisniku

Slika 16. Primjer dizajna koji je prilagoen korisniku [2]

DIZAJN KORISNIKOG SUELJA

2.7. Trajnost dizajna

Slika 17. Primjeri nekih bezvremenskih inaica dizajna [2]

2.8. Prototipi, koncepti, proof of concept

DIZAJN KORISNIKOG SUELJA

Slika 18: Primjeri digitalnog oblika koncepta, tj. wireframe

Slika 19: Primjer postavljanja smjernica

Slika 20. Koraci u izradi koncepta, tj. wireframea

DIZAJN KORISNIKOG SUELJA

2.9. Utjecaj ogranienja mobilnih ureaja

Slika 21. Animacija od prve do zadnje sliice [1]

DIZAJN KORISNIKOG SUELJA

Slika 22. Dizajn aplikacije

2.11. Slubene platformske smjernice

Slika 23. Primjer ikona [2]

2.11.1. Slubene teme

DIZAJN KORISNIKOG SUELJA

Slika 24. Primjer dviju standardnih tema Android sustava [2]

2.11.2. Efekti koji se pojavljuju kod interakcije korisnika s nekim elementom

Slika 25. Primjer efekta nakon dodira prstom [2]

2.11.3. Minimalna veliina tipki i ostalih elemenata

Slika 26. Primjer dimenzionalnih odredbi i raspored elemenata[2]

DIZAJN KORISNIKOG SUELJA

Suelja se trebaju automatski prilagoavati bilo kojem zaslonu.

Elementi suelja za sve