24.3.2020.

Android
Subtitle

Grafičko sučelje i resursi

 24.3.2020.

Sadržaj predavanja
Subtitle

● Sučelja
– Toast

– Butterknife

– Widgeti – nastavak
● Resursi
- Općenito
- Što ide u koju datoteku
- Alternativni resursi
- Assets
 24.3.2020.

Kratka poruka
Toast
Subtitle
Služi za prikazivanje kratkih poruka korisniku
●

Jednostavni Toast se radi s metodom

●

- Toast.makeText(context, text, duration)

- context – najbolje koristiti aktivnost, a moguće je koristiti i
getApplicationContext()
- text – tekst koji se prikazuje ili ID resursa
- duration – konstanta iz Toast klase
 24.3.2020.

Kratka poruka
Toast
Subtitle
●Toast je moguće napraviti i s proizvoljnim layoutom pomoću
toast.setView(layout) metode
Moguće mu je podesiti gravitaciju
●
 24.3.2020.

Demo
Subtitle

Prikaz Toast-a

Custom gravitacija

Custom layout
 24.3.2020.

Napredak
Progress
Subtitlebar
● ProgressBar
- Prikazuje napredak nečega
● SeekBar
- Moguće je ručno namještati vrijednosti
● RatingStar
- Izgled za rating u obliku zvjezdica (aplikacije npr.)
 24.3.2020.

Ponavljanje
Dohvaćanje
Subtitle elemenata iz koda
● Ugrađena je metoda findViewById
- Potrebno joj je predati int kao parametar
- Do istog se dolazi preko generirane R klase
- Metoda vraća View kojeg je (najčešće) potrebno „kastati” u
odgovarajuću kontrolu iako kaže Android Studio da ne
● Primjer
- (SeekBar) findViewById(R.id.seekBarWithListener);
 24.3.2020.

Demo
Subtitle
ProgressBar

SeekBar

RatingStar

Dohvat kontrola
 24.3.2020.

Dohvaćanje elemenata iz koda

Ne postoji li nešto elegantnije?
Subtitle

Butterknife
Ali prije njega potrebno je razumjeti anotacije
 24.3.2020.

Anotacije
Subtitle

● Metapodaci koji se dodaju programskom kod

Anotirane mogu biti klase, metode, varijable,
●

parametri i paketi
●Do anotacija je moguće doći refleksijom prilikom
izvođenja
● Moguće je kreiranje vlastitih anotacija
Neke od ugrađenih su: @Override, @Deprecated,
●

@SuppressWarnings, @SafeVarargs…
 24.3.2020.

Anotacije
Vlastite
Subtitleanotacije

● Kreiranje vlastite Anotacije:

@Twizzle
public void toggle() { }
public @interface Twizzle { }

// Isto kao: @Edible(value = true)

@Edible(true)
Item item = new Carrot();

public @interface Edible {

boolean value() default false;
}

@Author(first = "Oompah", last = "Loompah")

Book book = new Book();

public @interface Author {

String first(); String last();
}
 24.3.2020.

Butter Knife
Jake Wharton
Subtitle

Biblioteka za povezivanje resursa i „view” elemenata

●

pomoću anotacija
● Generira kod i koristi refleksiju
class ExampleActivity extends Activity {
@BindView(R.id.title) TextView title;
@BindView(R.id.subtitle) TextView subtitle;
@BindView(R.id.footer) TextView footer;
@BindString(R.string.title) String title;
@BindDrawable(R.drawable.graphic) Drawable graphic;
@BindColor(R.color.red) int red;
@BindDimen(R.dimen.spacer) Float spacer;

@Override public void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);
setContentView(R.layout.simple_activity);
ButterKnife.bind(this);
}
}
 24.3.2020.

Demo
Subtitle

Butter Knife
 24.3.2020.

Spinner
Nazad na widgete
Subtitle
●Ponašaju se kao JComboBox otprilike
●Služe odabiru jedne u nizu vrijednosti

●Moguće je dodati spinner-u predefiniranu listu

vrijednosti kroz xml layout

●Također je moguće u programskom kodu definirati

adapter koji koristi spinner

 24.3.2020.

Demo
Subtitle

Predefinirani Spinner

Dinamički spinner

Custom spinner
 24.3.2020.

Prikaz slika
ImageView
Subtitle
●Prikazuje sliku 
●Najvažniji atributi:

Atribut (XML) Metoda (kod) Opis

cropToPadding setCropToPadding(boolean) Ako je true slika će biti odrezana

da stane u okvir ImageView-a

maxHeight setMaxHeight(int) Maksimalna visina u pikselima

maxWidth setMaxWidth(int) Maksimalna širina u pikselima

src setImageSource(int) Resurs koji se prikazuje

tint setColorFilter(int, Boja nijanse slike

PorterDuff.Mode)
 24.3.2020.

Prikaz slika
ImageButton
Subtitle
●ImageButton nasljeđuje ImageView
●Dodaje izgled gumba
 24.3.2020.

Demo
Subtitle

ImageView

ImageButton

Validacija
 24.3.2020.

Resursi
Kako napraviti aplikaciju za sve te različite uređaje i ostali normalan?
Subtitle

Nikako. 
 24.3.2020.

Resursi
Opća kultura
Subtitle
● Slike, stringovi, layouti, liste koji se koriste unutar aplikacije
● Svi resursi nalaze se u res/ direktoriju
● Dobivaju generirani id u R klasi
● Služe višejezičnosti i različitim tipovima uređaja
● Mogu biti univerzalni za sve uređaje
● Mogu biti različiti za različite uređaje
- Veličina ekrana
- Jezik
 24.3.2020.

Resursi
Mjesta pohrane (nekih) resursa
Subtitle
●color/
- Definiranje boja nekog objekta ovisno o njegovom stanju
●drawable/

- Sadrži png, 9.png, jpg i gif datoteke (preporuča se png)

●mipmap/

- Ikone različitih gustoća

●layout/

- Izgled korisničkog sučelja

●menu/

- Sadrzi xml datoteke koje opisuju izbornike

●raw/

- Sadrži datoteke koje se želi zadržati u izvornom formatu

Ostali na: http://developer.android.com/guide/topics/resources/providing-resources.html
 24.3.2020.

Resursi
Mjesta pohrane (nekih) resursa
Subtitle
values/
●

- xml datoteke koje sadrže neke jednostavne konstantne

vrijednosti
- Imena datotekama su proizvoljna
- U svakoj je moguće definirati više vrsta vrijednosti
- Zbog standardizacije i jasnoće koriste se najčešće sljedeća
imena
- arrays.xml za nizove
- colors.xml za boje
- dimens.xml za dimenzije
- strings.xml za tekstualne konstante
- styles.xml za stilove
 24.3.2020.

Resursi
Tablica
Subtitledimenzija

Dimenzije koje se definiraju u xml-u sastoje se od broja i kratice

●

mjerne jedinice (MJ)

MJ Opis
dp Density-independent pixel - mjerna jedinica kojom se definiraju svi elementi korisničkog
sučelja. Jedan dp jednak je jednom pikselu na ekranu sa 160 piksela po inču (dpi).
px = dp * (dpi / 160)

sp Scale-independent Pixels (sp) – slično kao dp ali je razmjerno s veličinom teksta, pa se i

preporuča koristiti za definiranje veličine teksta.
sp = px * ( dpi / 160 ) * scale
pt Points - 1/72 od piksela
px Pixels – stvarna vrijednost piksela na ekranu
mm Millimeters - milimetar na temelju stvarne veličine ekrana
in Inches – inč na temelju stvarne veličine ekrana
 24.3.2020.

Alternativni resursi
Zašto, čemu?
Subtitle
●Zbog velikih razlika u dizajnu i načinu upotrebe Android uređaja
postoje alternativni resursi
●Omogućavaju povlačenje različitih resursa za različita okruženja

●Zbog alternativnih resursa postoji više različitih direktorija npr.

drawable ovisno o dpi ekrana:

- drawable-hdpi
- drawable-ldpi
- drawable-mdpi
- drawable-xhdpi
- drawable-xxhdpi

Više na: http://developer.android.com/guide/practices/screens_support.html

 24.3.2020.

Alternativni resursi
Kvalifikatori
Subtitle direktorija
Conf. Opis
MCC i MCN MCC (Mobilni kod zemlje), MNC(Mobilni kod operatora). Moguće je koristiti samo jedan od navedenih: npr.
mcc219 ili mcc219-mnc01. Popis dozvoljenih moguće je naći na wikipediji:
http://en.wikipedia.org/wiki/Mobile_country_code
jezik Po iso standardu. Npr. hr-rHR ili samo hr, en-rUS ili samo en
Smjer layouta ldrtl (layout-direction-right-to-left) ili ldltr (layout-direction-left-to-right)
Za jezike koji se čitaju s desna na lijevo. (Api>17)
najmanja širina sw<N>dp npr. sw320dp ili sw600dp. Najmanja moguća širina ekrana. Ako je za prikaz layouta potrebno barem
600dp-a, potrebno je napraviti direktorij
res/layout-sw600dp (Api>13)
trenutna širina w<N>dp npr. w320dp ili w600dp. Trenutna širina ekrana ovisno o landscape i portrait modu rada. (Api>13)

trenutna visina h<N>dp npr. h320dp ili h600dp. Trenutna visina ekrana ovisno o landscape i portrait modu rada. (Api>13)

veličina ekrana small (320x426 dp), normal (320x470 dp), large (480x640 dp), xlarge (720x960 dp)
dp u zagradi označava minimalne vrijednosti nakon kojih će se resursi učitati. (Api>4)

omjer ekrana long (WQVGA, WVGA, FWVGA) ili notlong (QVGA, HVGA, VGA) – podrška za widescreen ekrane. (Api>4)

Okrugli ekran round, notround (Api>23)

Wide Color Gamut Widecg (ima wide color gamut), nowidecg (nema wide color gamut) (Api > 26)
HDR Highhdr (ima high dynamic range), lowdr (nema HDR) (Api > 26)
 24.3.2020.

Alternativni resursi
Kvalifikatori
Subtitle direktorija
Conf. Opis
Orijentacija port, land – je li uređaj u portretu ili landscapeu

UI mod car, desk, television, appliance, watch – ovisi o tome na što je ukopčan uređaj (Api>8, television Api>13,
watch Api>20)
Noćni mod night, notnight – je li noć ili dan. (Api>8)

Gustoća piksela ldpi (120dpi), mdpi (160dpi), hdpi (240dpi), xhdpi (320dpi, API>8), xxhdpi (420dpi, API>16), xxxhdpi (640dpi,
API>18), nodpi (ne sklira slike), tvdpi (213dpi, API>13)
Touchscreen notouch, finger

Tipkovnica keysexposed (Uređaj ima tipkovnicu), keyshidden (Uređaj ima tipkovnicu, ali je sakrivena i uređaj nema
softversku tipkovnicu), keyssoft (Softverska tipkovnica)
Metoda tipki nokeys (uređaj nema hardver za unos), qwerty (uređaj ima tipkovnicu), 12key (uređaj ima tipkovnicu od 12
gumbića)
Navigacijske navexposed (Navigacijske tipke su dostupne korisniku), navhidden (Navigacijske tipke nisu dostupne. Npr,
tipke zatvoren je poklopac uređaja.)
Ne touch nonav (Uređaj nema navigaciju), dpad (Uređaj ima d-pad), trackball (Uređaj ima trackball), wheel (Uređaj
navigacija ima kotačić za navigaciju (rijetkost))
Verzija APIja verzija APIja na uređaju. Npr: v3, v4, v7, v14...
 24.3.2020.

Alternativni resursi
Pravila
Subtitle
● Moguće je specificirati više kvalifikatora odvojenih crticom
- npr. drawable-hr-land (slike za uređaj na hrvatskom i u
landscape modu rada)
● Kvalifikatori moraju biti po redosljedu kao u tablici
- npr. drawable-hr-land (slike za uređaj na hrvatskom i u
landscape modu rada)
●Resursi se ne smiju ugnježđivati
●Vrijednosti su case insensitive

●Samo jedan kvalifikator je dozvoljen

- Ne smije biti: drawable-hdpi-mdpi/

 24.3.2020.

Kako resursi rade interno

R klasa
Subtitle
●Generira se na temelju kompletnog res/ direktorija
●Svaki parametar je jedan element koji se rabi u aplikaciji i

dodijeljena mu je generirana vrijednost

●Statičke konstante iz R klase potrebno je rabiti kao

poveznicu između resursa i programskog koda

- npr. setContentView(R.layout.main)
 24.3.2020.

Resursi
Sintaksa
Subtitle
● Za dohvat iz programskog koda:
- Resources res = getResources();
- String hello = res.getString(R.string.hello);

● Za dohvat iz xml-a:
- android:textColor="@android:color/secondary_text_dark”
 24.3.2020.

Demo
Subtitle

Pohrana resursa

Alternativni resursi

Pristup resursima

Više o resursima pročitajte na:

http://developer.android.com/guide/topics/resources/index.html
 24.3.2020.

finish();
Subtitle

● pitanja?