Systemy operacyjne Mac OS X i ios

Transkrypt

1 Systemy operacyjne Mac OS X i ios Laboratorium Kalkulator zużycia paliwa czyli pierwsza aplikacja w Cocoa Framework Politechnika Gdańska Wydział Elektroniki, Telekomunikacji i Informatyki Autor: Jacek Dąbrowski

2 Spis treści 1 Wprowadzenie XCode Aplikacje Cocoa Laboratorium Utworzenie projektu Interfejs użytkownika Połączenie z delegatem aplikacji Wykonanie obliczeń Dodatkowe kontrolki Powiązanie NSTextField z NSSlider Utworzenie modelu Prezentacja aplikacji Laboratorium przedmiotu Systemy operacyjne Mac OS X i ios str. 2

3 1 Wprowadzenie Celem laboratorium jest zapoznanie studentów ze środowiskiem XCode i podstawami tworzenia aplikacji korzystających z biblioteki Cocoa. Studenci nie muszą znać języka objective-c wszystkie fragmenty kodu są dokładnie omówione (wskazana jest znajomość jakiegokolwiek obiektowego języka programowania). Efektem pracy będzie aplikacja obliczająca średnie zużycie paliwa na sto kilometrów na podstawie wprowadzonego dystansu oraz ilości tankowanego paliwa. 1.1 XCode XCode jest podstawowym narzędziem programistycznym do tworzenia aplikacji na komputery Mac oraz urządzenia ios, takie jak iphone czy ipad. IDE umożliwia edycję kodu źródłowego w objective-c oraz C++ oraz definiowanie interfejsu użytkownika. Poniższy rysunek przedstawia Lewy panel (oznaczony kolorem czerwonym) służy do szeroko pojętej nawigacji w projekcie, w szczególności pierwsza zakładka to lista plików. Inne zakładki to m.in. biblioteka klas, lista błędów w kodzie źródłowym czy informacja o wątkach aplikacji (podczas uruchomienia). Prawy panel umożliwia dodawanie nowych elementów do projektu oraz ustawianie ich właściwości. Niewidoczny na powyższym rysunku dolny panel służy do debugowania aplikacji zawiera listę obserwowanych zmiennych oraz konsolę tekstową. 1.2 Aplikacje Cocoa Aplikacje Cocoa tworzy się zgodnie ze wzorcem projektowym Model/View/Controller (MVC), w którym w wyraźny sposób rozdziela się trzy elementy składające się na aplikację: Laboratorium przedmiotu Systemy operacyjne Mac OS X i ios str. 3

4 - model danych i metody ich przetwarzania, - widoki służące do komunikacji z użytkownikiem, - i kontrolery stanowiące połączenie pomiędzy interfejsem użytkownika (w którym nie ma żadnego kodu) z modelem danych. Zaprojektowanie aplikacji zgodnie z modelem MVC oznacza uporządkowanie struktury oraz łatwiejsze poszukiwanie błędów (konkretne punkty styku różnych interfejsów). Aplikacja, która powstanie na laboratorium będzie miała bardzo prosty model danych w początkowym etapie obliczenia będą realizowane w całości przez kontroler. Sednem pierwszej części laboratorium jest pokazanie mechanizmu łączenia elementów widoku z kontrolerem poprzez outlety (ang. outlet) oraz akcje (ang. action). Outlety są własnościami kontrolera wskaźnikami pozwalającymi na dostęp do kontrolek np. odczyt/zapis wartości pola tekstowego czy pozycji przełącznika oraz modyfikację ich atrybutów (rozmiar, czcionka, widzialność). Z kolei akcje to metody zdefiniowane w kontrolerze, które są uruchamiane w reakcji na działania użytkownika naciśnięcie przycisku, przeciągnięcie kursora czy wyjście z pola tekstowego. Konkretny przykład został zaprezentowany w punkcie 2.3. instrukcji. 2 Laboratorium Aby wykonać laboratorium należy: - utworzyć nowy projekt MacOS X/Cocoa aplication, - dodać do okna aplikacji elementy interfejsu użytkownika, - połączyć interfejs z kodem aplikacji utworzyć outlety oraz akcje, - wykonać obliczenia w kontrolerze i podać wynik, - dodać dwie nowe kontrolki: suwaki NSSlider i stworzyć mechanizm wiążący ich wartość z wartością w polach tekstowych, - przenieść obliczenia do metody w nowej klasie, i zaprezentować aplikację prowadzącemu. W dalszej części instrukcji omówiono kolejne etapy realizacji ćwiczenia. Po zakończeniu pracy, jeśli zostało jeszcze trochę czasu możesz spróbować wykonać zadania dodatkowe. Laboratorium przedmiotu Systemy operacyjne Mac OS X i ios str. 4

5 2.1 Utworzenie projektu Uruchom XCode i utwórz nowy projekt wybierając odpowiednią opcję w oknie powitalnym lub z menu File/New Zwróć uwagę na typ projektu (MacOS X) Projekt nazwij Kalkulator. Utworzony projekt zawiera trzy pliki: KalkulatorAppDelegate.h, KalkulatorAppDelegate.m oraz Kalkulator.xib. Dwa pierwsze definiują główną klasę aplikacji oddelegowaną do zarządzania jej działaniem. Trzeci z nich zawiera definicję interfejsu użytkownika aplikacji tuż po utworzeniu jest to po prostu puste okno. Jeśli nie widzisz paneli po lewej lub prawej stronie musisz je włączyć korzystając z ikon w prawym górnym rogu XCode. Laboratorium przedmiotu Systemy operacyjne Mac OS X i ios str. 5

6 2.2 Interfejs użytkownika Na liście plików zaznacz Kalkulator.xib. Korzystając z Object Library (prawy panel, dolna część) dodaj do okna trzy kontrolki Label, dwa TextField i jeden Push Button. Aby zmienić tekst kontrolki należy wykonać podwójne kliknięcie na obiekcie. Zmodyfikuj interfejs tak aby był zgodny z rysunkiem obok (Label pod guzikiem ma ustawiony pusty tekst). Zwróć uwagę, że żadnej z dodanych kontrolek nie nadawaliśmy żadnej nazwy ani innego identyfikatora. Laboratorium przedmiotu Systemy operacyjne Mac OS X i ios str. 6

7 2.3 Połączenie z delegatem aplikacji Aby połączyć interfejs użytkownika z kodem aplikacji skorzystaj z widoku asystenta (ikona oznaczona czerwonym kolorem). Widok asystenta prezentuje na ekranie dwa elementy po lewej stronie ten wybrany z listy plików, po prawej element pasujący środowisko albo domyśla się o co nam chodzi (jak w tym przypadku para widok/kontroler), albo możemy wymusić konkretną zawartość np. definicję jakiejś innej klasy. Aby utworzyć połączenie trzymając klawisz CTRL przeciągnij wybraną kontrolkę z widoku okna do pliku nagłówkowego kontrolera (do wnętrza deklaracji interfejsu). XCode proponuje dwa sposoby połączenia jako outlety lub jako akcje. Połącz pola tekstowe oraz Label jako outlety: dystanstextfield, paliwotextfield oraz wyniklabel. Guzik oblicz połącz jako akcję o nazwie obliczbutton. Laboratorium przedmiotu Systemy operacyjne Mac OS X i ios str. 7

8 Przetestuj połączenie uzupełniając metodę obliczbutton o wpisanie tekstu: - (IBAction)obliczButton:(id)sender { self.wyniklabel.stringvalue } W tym wypadku notacja jest bardzo zbliżona do innych języków obiektowych. Odwołujemy się najpierw do siebie (self), a później poprzez wskaźnik (outlet) kontrolki do pola określającego wartość tekstową i ustawiamy ją na wartość hello. W języku obj-c występują dwa rodzaje napisów zwykłe tablice znane z języka C oraz obiekty typu NSString. oznacza utworzenie właśnie takiego obiektu. Po uruchomieniu aplikacji naciśnięcie guzika powinno spowodować wyświetlenie napisu hello. Jeśli to połączenie nie działa poproś prowadzącego o pomoc. 2.4 Wykonanie obliczeń Kontrolki takie jak pole tekstowe, czy label (który tak naprawdę jest podklasą pola tekstowego) deklarują własność NSString *stringvalue. Typ NSString ma metody służące do konwersji jego zawartości do prostych typów liczbowych w tym wypadku interesować nas będzie wartość zmiennoprzecinkowa. Aby otrzymać wartości wprowadzone do pól tekstowych do otrzymanych wskaźników na obiekty typu NSString wysyłać będziemy wiadomość doublevalue. - (IBAction)obliczButton:(id)sender { double km = [self.dystanstextfield.stringvalue doublevalue]; double lt = [self.paliwotextfield.stringvalue doublevalue]; if (km>0) { double wynik = 100*lt/km; } self.wyniklabel.stringvalue = [NSString stringwithformat:@"%.2f l/100km",wynik]; } else self.wyniklabel.stringvalue Kolejne instrukcje nie powinny zaskoczyć nikogo znającego składnię języka C, komentarza wymaga jedynie metoda (wiadomość) stringwithformat. Metoda ta w bardzo dużym stopniu odpowiada funkcji printf() w języku C pierwszym parametrem jest NSString * definiujący szablon tworzonego napisu, po którym następuje lista argumentów oddzielonych przecinkami, które wypełniają pola w szablonie. Przetestuj działanie aplikacji. Laboratorium przedmiotu Systemy operacyjne Mac OS X i ios str. 8

9 2.5 Dodatkowe kontrolki Dodaj do okna dwie nowe kontrolki typu Horizontal Slider. Korzystając z prawego panelu ustal rozsądne wartości minimum i maksimum. Korzystając z Assistant Editora utwórz dwie nowe akcje: dystanssliderchange oraz paliwosliderchange. W tym punkcie ćwiczenia będziemy korzystać jedynie z akcji dostęp do pól suwaka, m.in. ustalonej wartości uzyskamy poprzez parametr sender odpowiednich metod: - (IBAction)dystansSliderChange:(id)sender { self.dystanstextfield.stringvalue = [NSString stringwithformat:@"%.0f", [sender doublevalue]]; [self obliczbutton:nil]; } - (IBAction)paliwoSliderChange:(id)sender { self.paliwotextfield.stringvalue = [NSString stringwithformat:@"%.0f", [sender doublevalue]]; [self obliczbutton:nil]; } 2.6 Powiązanie NSTextField z NSSlider Zaimplementowane w poprzednim punkcie metody wiążą wartość suwaka z polem tekstowym, ale nie na odwrót. Aby dokonać połączenia w drugą stronę potrzebne będą dwa nowe outlety (dla obu suwaków) oraz jedna akcja ta sama dla zmiany wartości obu pól tekstowych. Aby dowiązać drugą kontrolkę do tej samej akcji trzymaj wciśnięty klawisz kontrol i po prostu wybierz metodę kursorem. Zdarzenie generowane jest w momencie naciśnięcia klawisza enter lub przy opuszczeniu pola tekstowego. W reakcji na zdarzenie odczytaj wartości z obu pól tekstowych i ustaw je jako wartości (doublevalue) sliderów. 2.7 Utworzenie modelu Ostatnim etapem laboratorium jest utworzenie bardzo prostej klasy reprezentującej model obliczeń komputera pokładowego. Korzystając z menu File/New lub klikając prawym klawiszem na liście plików dodaj nowy plik typu objective-c class. Jako obiekt, z którego będzie dziedziczyć klasa wybierz po prostu NSObject. XCode utworzy dwa pliki nagłówkowy z deklaracją interfejsu klasy oraz plik przeznaczony na implementację metod. Laboratorium przedmiotu Systemy operacyjne Mac OS X i ios str. 9

10 Uzupełnij deklarację interfejsu o informację o metodzie statycznej ( + ) przyjmującej dwa parametry double, i zwracającej wartość typu double: + (double) spalaniedladystansu: (double) dystans ipaliwa: (double) paliwo; Zdefiniuj ciało metody w pliku.m (tak, to będzie pojedynczy return). Następnie zmodyfikuj plik AppDelegate.m (w szczególności metodę obliczbutton) tak, aby korzystała z nowo utworzonej klasy.... [Komputer spalaniedladystansu: km ipaliwa: lt] Prezentacja aplikacji Zaprezentuj działającą aplikację prowadzącemu. Zademonstruj powiązanie pól tekstowych z suwakami (w cztery strony). Laboratorium przedmiotu Systemy operacyjne Mac OS X i ios str. 10