Podstawowe kontrolki i ich obsługa

Transkrypt

1 Podstawowe kontrolki i ich obsługa Sebastian Batko, Jakub Piotrowski Katedra Informatyki Stosowanej Wydział Elektrotechniki, Automatyki, Informatyki i Inżynierii Biomedycznej Akademia Górniczo-Hutnicza im. Stanisława Staszica w Krakowie 23 listopada 2015

2 Spis treści Podstawowe kontrolki Pola tekstowe Przyciski

3 Wybrane kontrolki podstawowe pola tekstowe: etykiety pola edytowalne pola do wprowadzania hasła przyciski: tekstowe graficzne przyciski dwustanowe pola wyboru przyciski radiowe, grupy przycisków grafika

4 Pola tekstowe TextView Klasa: android.widget.textview Znacznik XML: < TextView... > Widok: służy do wyświetlenia tekstu i opcjonalnie jego edycji <TextView android:layout width="fill parent" android:layout height="wrap content" android:text="@string/name text" />

5 Pola tekstowe Wybrane atrybuty TextView android:capitalize - zamienia automatycznie znaki na duże android:inputtype - typ wprowadzanych danych android:lines - liczba wierszy w polu android:password - wprowadzany tekst będzie widoczny w postaci gwiazdek android:text - wyświetlony tekst android:textcolor - kolor tekstu android:textsize - rozmiar tekstu android:textstyle - styl tekstu (pogrubiony, kursywa,...)

6 Pola tekstowe EditText Klasa: android.widget.edittext - dziedziczy po TextView Znacznik XML: < EditText... > Widok: tworzy edytowalne pole tekstowe

7 Przyciski Button Klasa: android.widget.button - dziedziczy po TextView Znacznik XML: < Button... > Widok: reprezentuje przycisk. w wyniku jego kliknięcia/przyciśnięcia użytkownik może uruchomić jakąś akcję (atrybut android:onclick) <Button android:layout height="wrap content" android:layout width="wrap content" android:text="@string/self destruct" android:onclick="selfdestruct"/>

8 Przyciski Przyciski dwustanowe Klasa: android.widget.compoundbutton - klasa abstrakcyjna rozszerzająca Button Znacznik XML: - Widok: reprezentuje przycisk z dwoma stanami (zaznaczonym i niezaznaczonym). Po kliknięciu/wciśnięciu stan automatycznie się zmienia. stanowi szablon dla m.in: przycisków dwustanowych przycisków radiowych pola wyboru

9 Przyciski Pole wyboru Klasa: android.widget.checkbox - dziedziczy po CompoundButton Znacznik XML: < CheckBox... > Widok: reprezentuje pole wyboru z dwoma stanami. Atrybut android:checked przechowuje stan przycisku. <CheckBox android:id="@+id/chkrememberpassword" android:layout width="fill parent" android:layout height="wrap content" android:text="remember Password"/>

10 Przyciski Przycisk graficzny Klasa: android.widget.imagebutton - dziedziczy po ImageView Znacznik XML: < ImageButton... > Widok: reprezentuje zwykły przycisk (ze standardowym kolorem tła i zmieniającymi się kolorami dla różnych stanów), który zamiast opisu tekstowego ma grafikę. Grafikę wskazuje atrybut android:src. <ImageButton android:id="@+id/btnimg1" android:layout width="fill parent" android:layout height="wrap content" android:src="@drawable/icon" />

11 Przyciski ToggleButton Klasa: android.widget.togglebutton - dziedziczy po CompoundButton Znacznik XML: < ToggleButton... > Widok: przycisk reprezentujący stany włącz/wyłącz za pomocą wskaźnika świetlnego. Domyślnie wyświetla tekst ON/OFF. Można to zmienić za pomocą atrybutów: android:texton i android:textoff

12 Przyciski RadioButton Klasa: android.widget.radiobutton - dziedziczy po CompoundButton Znacznik XML: < RadioButton... > Widok: dwustanowy przycisk radiowy. Można go wcisnąć, ale nie można wycisnąć.

13 Przyciski RadioGroup Klasa: android.widget.radiogroup - dziedziczy po LinearLayout Znacznik XML: < RadioGroup... > Widok: kontener dla elementów <RadioButton>, służy do grupowania przycisków radiowych. Tylko jeden przycisk w grupie może być wciśnięty (identyfikowany jest on po id). Domyślnie początkowo żaden przycisk nie jest wciśnięty.

14 Przyciski Przykład użycia

15 Interakcja użytkownika z interfejsem Użytkownik może reagować na powiadomienia (zdarzenia) pochodzące od: aktywności widoku Na poziomie aktywności polega to na nadpisaniu wybranych metod z klasy Activity Najczęściej są to: onkeydown - wołana, gdy został naciśnięty klawisz i nie został obsłużony przez żaden z widoków aktywności onkeyup - j.w., gdy klawisz został zwolniony onmenuitemselected - wołana, gdy został wybrany element panelu menu onmenuopened - wołana, gdy został otwarty panel menu

16 public boolean onkeydown(int keycode, KeyEvent event) { switch (keycode) { case KeyEvent.KEYCODE DPAD CENTER: // wcisniety klawisz CENTER case KeyEvent.KEYCODE DPAD LEFT: // wcisniety klawisz STRZALKA W LEWO case KeyEvent.KEYCODE DPAD RIGHT: // wcisniety klawisz STRZALKA W PRAWO case KeyEvent.KEYCODE DPAD UP: // wcisniety klawisz STRZALKA W GORE case KeyEvent.KEYCODE DPAD DOWN: // wcisniety klawisz STRZALKA W DOL } return false; }

17 Zdarzenia widoków Widoki mogą być źródłem zdarzeń Z każdym takim zdarzeniem związany jest w klasie View interfejs nasłuchujący (tzw. event listener), definiujący pojedynczą metodę zwrotną (callback method) W wyniku interakcji użytkownika z UI, metody te będą wywoływane przez framework Androida, dla tych widoków, dla których zostały zarejestrowane

18 Metody nasłuchujące // i n t e r f e j s View. O n C l i c k L i s t e n e r : p u b l i c void o n C l i c k ( View v ) // i n t e r f e j s View. O n L o n g C l i c k L i s t e n e r : p u b l i c boolean o n L o n g C l i c k ( View v ) // i n t e r f e j s View. OnFocusChangeListener : p u b l i c void onfocuschange ( View v, boolean hasfocus ) // i n t e r f e j s View. OnKeyListener : p u b l i c boolean onkey ( View v, i n t keycode, KeyEvent e v e n t ) // i n t e f e j s View. OnTouchListener : p u b l i c boolean ontouch ( View v, MotionEvent e v e n t ) // i n t e r f e j s View. OnCreateContextMenuListener : p u b l i c void oncreatecontextmenu ( ContextMenu menu, View v, ContextMenu. ContextMenuInfo menuinfo )

19 Metoda onclick Implementacja interfejsu związanego ze zdarzeniem onclick: p r i v a t e O n C l i c k L i s t e n e r b t n L i s t e n e r = new O n C l i c k L i s t e n e r ( ) { p u b l i c void o n C l i c k ( View v ) { Toast. maketext ( g e t B a s e C o n t e x t ( ), ( ( Button ) v ). gettext ( ) + was c l i c k e d, Toast. LENGTH LONG). show ( ) ; } } ;

20 Rejestracja obsługi zdarzenia Rejestracja obsługi zdarzenia dla widoku: protected void oncreate ( Bundle s a v e d V a l u e s ) { //... Button btn = ( Button ) f i n d V i e w B y I d (R. i d. btn ) ; btn. s e t O n C l i c k L i s t e n e r ( b t n L i s t e n e r ) ; //... }

21 Obsługa grup przycisków W przypadku grup przycisków radiowych należy zaimplementować interfejs RadioGroup.OnCheckedChangeListener, np.: RadioGroup rg = ( RadioGroup ) f i n d V i e w B y I d (R. i d. rg ) ; rg. s e t O n C h e c k e d C h a n g e L i s t e n e r (new OnCheckedChangeListener ( ) { p u b l i c void oncheckedchanged ( RadioGroup group, i n t c h e c k e d I d ) { RadioButton rb = ( RadioButton ) f i n d V i e w B y I d ( c h e c k e d I d ) ; Toast. maketext ( g e t B a s e C o n t e x t ( ), rb. gettext ( ) + was } }) ; checked, Toast. LENGTH LONG). show ( ) ;

22 Ćwiczenie Jako ćwiczenie proszę wykonać implementację prostego kalkulatora.

23 Dziękujemy za uwagę