Informatyka I. Interfejs GUI wysokiego poziomu. Biblioteka Swing. Programowanie zdarzeniowe. Politechnika Warszawska Wydział Transportu 2018

Transkrypt

1 Informatyka I Interfejs GUI wysokiego poziomu. Biblioteka Swing. Programowanie zdarzeniowe. dr inż. Andrzej Czerepicki Politechnika Warszawska Wydział Transportu 2018

2 Interfejs GUI wysokiego poziomu Pojęcie interfejsu GUI Historia interfejsów GUI Elementy interfejsu graficznego Okno Komponent Kontener Metody interfejsu graficznego Obsługa myszy, klawiatury

3 Okno oraz jego komponenty Ikona oraz menu systemowe Nagłówek Przyciski systemowe Ramka Obszar komponentów

4 Podstawowe rodzaje okien Okno główne Okno typu child Okno modalne

5 Podstawowe rodzaje okien (c.d.) Okno główne aplikacji MDI (ang. Multiple Document Interface) Okno zależne wyświetlane w oknie głównym, nie wykracza poza jego granice (ang. Child Window) Okno modalne (dialogowe) wyświetlane w trybie wyłączności (póki nie zostanie zamknięte, użytkownik nie może przejść do innych okien aplikacji (ang. Modal Window) Okno typu pop-up wyświetlane w dowolnym miejscu ekranu i nie związane z oknem głównym

6 Pakiet Swing Swing pakiet klas Java przeznaczonych do implementacji okienkowych interfejsów użytkownika Swing jest częścią standardowej biblioteki Java Foundation Classes Lokalizacja: javax.swing

7 Aplikacja Swing Rodzaj projektu: Java Class Library Może zawierać dowolną liczbę okien oraz innych klas Tylko jedno z okien może być oknem startowym (wybiera się przy pierwszym uruchomieniu aplikacji, można później zmienić)

8 Okno Swing Każde okno dziedziczy z klasy JFrame Okno zawiera metodę main() aczkolwiek jej treści nie należy redagować Komponent JFrame extends OknoGłówne Komponent javax.swing Komponent

9 Projektowanie okna Wybór trybu Projektowanie w trybie DESIGN Kod źródłowy klasy

10 Biblioteka komponentów Swing Paleta komponentów graficznych Swing Controls

11 Projektowanie interfejsu graficznego 1) Przejdź do trybu projektowania graficznego 3) Przeciągnij tu komponent z palety Obszar roboczy okna Środowisko NetBeans 2) Wybierz komponent z palety

12 Wybrane komponenty Swing Każdy komponent posiada własną nazwę (pole Name klasy) poprzez którą można zwracać się do niego w programie w celu odczytu lub zapisu

13 Paradygmat programowania zdarzeniowego Programowanie zdarzeniowe (lub oparte na zdarzeniach) uzupełnienie koncepcji programowania obiektowego o mechanizmy komunikowania się obiektów między sobą Komponent Okno Metoda obsługi zdarzenia Kod programu

14 Zdarzenia komponentów W trakcie interakcji z użytkownikiem (lub na skutek pewnych wydarzeń systemie) stan komponentu może się zmienić: W polu tekstowym znajdzie się inna wartość Zmieni się pozycja suwaka Przycisk zostanie wciśnięty itp. Każdy komponent Swing ma własną listę obsługiwanych zdarzeń (ang. Events)

15 Rodzaje zdarzeń Zdarzenia myszy Zmiana widoczności komponentu Fokus Akcja domyślna Zdarzenia klawiatury Zmiana zawartości komponentu Zmiana pozycji lub rozmiarów komponentu Program nie musi obsługiwać wszystkich zdarzeń komponentu

16 Szczegóły zdarzeń Każde zdarzenie zawiera dodatkowe szczegółowe informacje np. zdarzenie mouseclicked przechowuje informację o współrzędnych Dla różnych zdarzeń informacje te są różne Informacje szczegółowe o zdarzeniu przechowuje obiekt typu Event: MouseEvent ActionEvent ChangeEvent etc.

17 Mechanizm działania zdarzeń Komponent Kontener (np. okno główne) Użytkownik Interfejs ( Listener) wywołanie Funkcja obsługi funkcja getsource() Obiekt klasy Event

18 Zdarzenie actionperformed Domyślne zdarzenie dla wielu rodzajów komponentów (przyciski, listy, etc.) Obiekt zdarzenia actionperformed należy do klasy ActionEvent Obiekt obsługujący zdarzenia musi być powiązany z komponentem generującym zdarzenia komponent.addactionlistener( kontener )

19 Etykieta: Label Element dekoracyjny stosuje się w celu umieszczenia napisów statycznych w oknie aplikacji Różne czcionki, kolory, etc. Właściwość kluczowa w trybie Design: Text

20 Pole tekstowe: TextField Umożliwia wprowadzanie dowolnego tekstu Metody odczytu i zapisu wartości: void settext( String text ) String gettext() Domyślne zdarzenie actionperformed jest wołane po wciśnięciu klawisza Enter

21 Przycisk: Button Realizuje funkcję zwykłego przycisku Właściwość kluczowa Text stosuje się w celu zmiany napisu na przycisku w trybie graficznym W trybie programowym można zmienić za pomocą metod settext() oraz gettext() (p. TextField) Zdarzenie domyślne: actionperformed jest wołane w momencie wciśnięcia przycisku przez użytkownika

22 Przycisk: Button (c.d.) Przykład obsługi zdarzenia actionperformed przyciku jbutton1 w kodzie programu

23 Pole opcji: CheckBox Realizuje funkcję pojedynczej opcji on/off Domyślne zdarzenie: actionperformed Metoda sprawdzenia stanu: isselected()

24 Pole wyboru RadioButton Umożliwia wybór jednej spośród kilku opcji Komponenty typu RadioButton muszą być łączone w grupy za pomocą komponentu RadioButtonGroup Zdarzenie actionperformed Metoda isselected() zwraca informację o stanie komponentu (wybrany czy nie)

25 Lista rozwijana ComboBox Umożliwia wybór jednej z kilku możliwych opcji Elementy są dodawane za pomocą właściwości model lub programowo za pomocą metody additem Zdarzenie actionperformed jest wołane w momencie zmiany bieżącego elementu listy Element wybrany można odczytać za pomocą metod getselectedindex() oraz getselecteditem()

26 Lista ListView Umożliwia prezentację oraz wybór jednego lub wielu rekordów z listy Dane mogę być prezentowane w wielu kolumnach Zdarzenie zmiany wybranego elementu: valuechanged Pobranie aktywnego elementu: getselectedvalue()

27 Komponent Table Wyświetla dane w postaci tabeli Właściwość model: Definiowanie kolumn oraz typów danych Deklaracja wierszy Programowe dodanie wierszy do tabeli Klasa DefaultTableModel metoda addrow( Object [] ) Zmiana wartości w komórce tabeli setvalueat( wartość, wiersz, kolumna ) Pobranie wartości z komórki tabeli getvalueat( wiersz, kolumna ) Usunięcie wierszy z tabeli

28 Pozostałe komponenty Slider wybór wartości typu Integer w postaci suwaka Minimum value Maximum value Metoda getvalue() Spinner pole tekstowe z możliwością przejścia do następnej/poprzedniej wartości Może obsługiwać różne dyskretne typy danych (Integer, Date, etc.)

29 Menu: MenuBar Menu główne okna jest realizowane poprzez komponent MenuBar z palety Swing Menus Pojedynczy element menu jest reprezentowany przez MenuItem Zdarzenie actionperformed

30 Wyświetlanie komunikatów: Klasa JOptionPane Metody.showMessageDialog JOptionPane.showConfirmDialog.showInputDialog

31 Układ komponentów w oknie graficznych Układ (ang. Layout) określa kolejność umieszczania komponentów w oknie graficznym oraz ich zachowanie podczas zmiany rozmiarów okna Wybrane rodzaje układów: FreeDesign / AbsoluteLayout GridLayout

32 Układ FreeDesign Programista umieszcza komponenty w oknie wg własnego życzenia Dla każdego z komponentów można wygenerować własną funkcję obsługi zdarzenia

33 Układ GridLayout Komponenty umieszczane automatycznie w postaci tablicy N x M elementów Rozmiar tablicy jest zadawany za pomocą obiektu GridLayout przekazywanego do funkcji JFrame::setLayout setlayout(new GridLayout(x,y,5,5)); Komponenty są dodawane za pomocą funkcji JFrame::add

34 Kontenery Kontener komponent, który może zawierać inne komponenty (w tym kontenery) Kontenery najwyższego poziomu: JFrame JDialog JApplet Kontenery lokalne: GroupBox JPanel Etc.

35 Grafika w Swing Utworzyć własną klasę dziedziczącą np. z JPanel class PanelGraf extends JPanel Nadpisać metodę paintcomponent public void paintcomponent( Graphics g ) Wykorzystać metody klasy Graphics w celu utworzenia własnej grafiki g.setcolor( Color.red ); // itd.

36 Grafika w Swing (c.d.) Utworzyć egzemplarz klasy PanelGraf PanelGraf p = new PanelGraf(); W konstruktorze klasy głównej (JFrame) ustawić rozmiar i położenie na ekranie panelu p.setbounds( x, y, szerokość, wysokość ); Dodać panel do kolekcji komponentów okna this.add( p ); W razie potrzeby odświeżyć panel p.repaint();