Łączenie interfejsu GUI z kodem Java w Android Studio
Czas połączyć interfejs GUI z kodem Java, aby móc zająć się pisaniem kodu aplikacji. Zaczynamy od otworzenia pliku kodu źródłowego. W tym celu w panelu Project Explorer wybieramy opcje app -> src -> main -> java -> com.example. guessinggame (lub odpowiednia nazwa pakietu) -> MainActivity, a następnie dwukrotnie klikamy MainActivity, aby otworzyć plik kodu źródłowego
MainActivity.java.
Jak można zauważyć, folder java w panelu Project Explorer zawiera jedenlub dwa dodatkowe pakiety, które noszą taką samą nazwę, z wyjątkiem przyrostka (test) lub (androidTest) po nazwie pakietu. Te pakiety służą do testowania dużych systemów, w których inżynierowie oceniają jakość, bezpieczeństwo i funkcjonalność aplikacji w ramach zarządzania jakością oprogramowania.
My nie będziemy zajmować się zarządzaniem jakością, choć jest to świetny sposób na rozpoczęcie kariery w IT.
Kod źródłowy Java w pliku MainActivity.java będzie wyglądał podobnie do przedstawionego na rysunku 4.13. Jak widać, w Android Studio deklaracja pakietu (ang. package) pojawia się domyślnie na samej górze pliku. Pakiety pomagają w organizowaniu wszystkich plików potrzebnych w bardzo złożonych programach, takich jak aplikacje mobilne. W tym przypadku nazwa pakietu bazuje na nazwie domeny firmy ustawionej na ekranie Create New Project (...), ale w odwrotnej kolejności – zaczyna się od com.
Rysunek 4.13. Kod źródłowy Java aplikacji domyślnie nosi nazwę MainActivity.java
Po deklaracji pakietu następuje szereg instrukcji import. Działają one podobnie jak w kodzie Javy aplikacji komputerowej, importując do kodu istniejące funkcje i narzędzia. Kod public class MainActivity może wyglądać nieco inaczej od przedstawionego
poniżej, w zależności od ustawionego minimalnego poziomu API, ale różnice będą mało istotne. Pisana przez nas aplikacja będzie działała na wielu różnych poziomach API.
Na początku deklarujemy zmienne służące do połączenia interfejsu GUI z programem. Klikamy miejsce w kolejnym wierszu, tuż za otwierającym nawiasem klamrowym klasy MainActivity, i dodajemy następujące deklaracje zmiennych dla pola tekstowego, przycisku oraz etykiety wyjściowej:
public class MainActivity extends AppCompatActivity {
private EditText txtGuess;
private Button btnGuess;
private TextView lblOutput;Podczas wpisywania każdego nowego typu zmiennej możemy zobaczyć menu rozwijane, które umożliwia zaimportowanie odpowiedniej klasy (np. android.widget.EditText). Jeśli wybierzemy typ z listy w celu jego zaimportowania, Android Studio automatycznie doda odpowiednią instrukcję import. Możemy także własnoręcznie wpisać wszystkie trzy wiersze kodu, bez
akceptowania opcji automatycznego importu, a następnie kliknąć poszczególne typy i nacisnąć alt-enter (lub option-enter w systemie macOS), aby zaimportować brakujące klasy przy użyciu opcji Import class, jak pokazano na rysunku 4.14.
Rysunek 4.14. Podobnie jak Eclipse, Android Studio umożliwia automatyczne importowanie klas podczas wpisywania lub później przy użyciu prostej kombinacji klawiszy (alt-enter lub option-enter w systemie macOS)
W górnej części pliku powinny się pojawić następujące trzy instrukcje import:
import android.widget.EditText;
import android.widget.Button;
import android.widget.TextView;Po zadeklarowaniu trzech zmiennych dla widżetów GUI musimy połączyć te zmienne z odpowiednimi komponentami XML. Tę operację przeprowadzimy w metodzie onCreate(), przedstawionej w dolnej części rysunku 4.14, czyli w funkcji, która jest uruchamiana w momencie ładowania aplikacji. Program Android Studio automatycznie wygenerował kod rozpoczynający tę metodę. W pierwszych dwóch lub trzech wierszach metody onCreate() powinniśmy znaleźć następującą instrukcję:
setContentView(R.layout.activity_main);Tuż po niej kilkakrotnie naciskamy klawisz enter i wpisujemy poniższy fragment kodu, aby rozpocząć łączenie zmiennej txtGuess z widżetem EditText w pliku układu XML:
txtGuess = (EditText) findViewById(R.id.Funkcja findViewById() służy do łączenia widżetów GUI w układzie XML ze zmiennymi, których użyjemy do ich reprezentowania w kodzie źródłowym. R wewnątrz tej funkcji odwołuje się do specjalnego pliku o nazwie R.java, który Android Studio generuje, aby umożliwić łączenie zasobów. R stanowi skrót od Resources, czyli zasobów przechowywanych zwykle w folderze res projektu.
Gdy zaczniemy wpisywać poprzedni wiersz, zobaczymy wyskakujące menu (patrz rys. 4.15). Odnajdujemy i dwukrotnie klikamy txtGuess na rozwijanej liście. Jeśli nie widzimy opcji txtGuess, musimy wrócić do widoku projektu pliku content _main.xml, aby sprawdzić, czy nadaliśmy wartość txtGuess właściwości id pola tekstowego. Na końcu umieszczamy zamykający nawias i średnik, jak pokazano na poniższym listingu, a następnie przeprowadzamy analogiczną operację dla przycisku oraz etykiety wyjściowej. W ten sposób powinniśmy uzyskać następujące trzy wiersze kodu w metodzie onCreate():
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
txtGuess = (EditText) findViewById(R.id.txtGuess);
btnGuess = (Button) findViewById(R.id.btnGuess);
lblOutput = (TextView) findViewById(R.id.lblOutput);Jeśli wszystkie komponenty układu zostały nazwane prawidłowo, te trzy wiersze kodu powinny łączyć zmienne txtGuess, btnGuess oraz lblOutput z komponentami EditText, Button oraz TextView w układzie GUI. Nadeszła pora, aby zapisać projekt, zachowując dotychczasowe postępy.
Rysunek 4.15. Android Studio pomaga w „połączeniu” kodu Java z zasobami GUI w układzie przy użyciu menu rozwijanego
Materiał opracowany na podstawie: Java, to takie proste Praktyczne wprowadzenie do programowania, Bryson Payne, wyd. WN PWN, 2018 r.
Dołącz do grupy i otrzymuj powiadomienia o nowych ofertach pracy