1.Tworzymy nowy projekt w AndroidStudio
File -> new -> newProject ->Empty Activity

2.Wchodzimy w folder app -> res -> layout -> activity_main.xml

3.W trybie graficznym układamy wygląd naszej aplikacji
a) Usuwamy wszystkie utworzone automatycznie elementy aplikacji
b) Wymaganie egzaminacyjne:
– „Zastosowany typ rozkładu liniowy wertykalny (Linear / Stack lub inny o tej idei) z zagłębionym rozkładem liniowym horyzontalnym dla przycisków.”
Aby spełnić wymaganie i poprawnie ustawić elementy naszej strony wybieramy zakładkę Layouts

Pierw ułożenie elementów w poziomie – Przeciągamy na widok naszej aplikacji LineralLayout (vertical). Utworzy to pewnego rodzaju „boxa” na nasze elementy i automatycznie będzie układać je w poziomie.

Aby spełnić wymaganie egzaminacyjne musimy ułożyć nasze przyciski w poziomie – tutaj przyda nam się LineralLayout (horizontal) który umieszczamy w naszym „boxie”

Wygląd

c) Przejdźmy do tworzenia elementów naszej aplikacji
– Tytuł:
Text -> TextView i umieszczamy w naszym boxie

Po kliknięciu na textView wchodzimy w atrybuty (Attributes) i zmieniamy wartości:
– id: musi odnosić się do tego czym jest nasz tekst, sugeruje: appTitle
– text: musi zawierać nasz tekst – w tym przypadku „Domek w górach”
– textColor: ustawiamy na szary (#808080)
– textSize: musi być największy spośród wszystkich tekstów na stronie, zastosujmy 34sp
– textAppearance: ustawiamy na „Large”

– Obrazek
Common -> ImageView
Wyszukujemy nasze zdjęcie i dodajemy je

Aby obraz wyrównał nam się do krawędzi wyszukujemy właściwość „scaleType” i ustawiamy ją na „fitXY”, możemy również opcjonalnie zmienić id naszego obrazka, jednak nie ma to większego znaczenia.

– Pod obrazkiem umieścimy nasze przyciski
Buttons – > Button i przeciągamy (UWAGA Przyciski należy przeciągnąć do LineralLayout (horizontal))

Ustawiamy atrybuty dla naszego layoutu oraz każdego przycisku po kolei zgodnie z wymaganiami egzaminacyjnymi:

Wracamy do trybu graficznego aby dodać kolejne elementy naszej aplikacji:
– Text – TextView -> do licznika polubień zastosujmy id counter

– Linia horyzontalna – Widgets -> Horizontal divider lub w kodzie xml

– Tekst – TextView – > ustawiamy pod sobą dwa text view na napis opis i treść naszego opisu

Finalny wygląd naszej aplikacji po stronie frontendu:

Po stronie kodu xml:

https://pastebin.com/jwse1TnN

4. Przechodzimy do app -> java -> com.example.nazwa_aplikacji i otwieramy plik MainActivity.java

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
package com.example.domekwgorach; // package z nazwą aplikacji naszej

import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.TextView;

public class MainActivity extends AppCompatActivity {
int counter = 0; // zmienna obsługująca licznik dla naszej aplikacji

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);

// Tworzymy obiekty typu button dla naszych przycisków
Button likeBtn = findViewById(R.id.like);
Button dislikeBtn = findViewById(R.id.dislike);

// Dodajemy event listenery dla naszych przycisków:
// po kliknięciu na likeBtn zmienna counter inkrementuje się
// a następnie funkcja setText wyświetla go w aplikacji
// po kliknięciu dislikeBtn sprawdzamy czy wartość licznika
// jest większa od 0, jeśli tak dekrementujemy, wypisujemy

likeBtn.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
counter++;
// Pobieramy textview aby podmienić w nim tekst
TextView likes = (TextView)findViewById(R.id.counter);
likes.setText(counter + " polubień");
}
});
dislikeBtn.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
if (counter > 0){
counter--;
// Pobieramy textview aby podmienić w nim tekst
TextView likes = (TextView)findViewById(R.id.counter);
likes.setText(counter + " polubień");
}

}
});

}
}

Nasza aplikacja jest gotowa!
Oto jej wygląd na przykładowym emulatorze: