"Programowanie aplikacji mobilnych oraz usług internetowych"
  INEU00214  LABORATORIUM    '2017
        

Terminy: Środy   7:30,  13:15,   15:15
Miejsce:
Lab. 2.3 / C16
Prowadzący:  
dr Marek Piasecki
Konsultacje:
 wtorki 13-15 , środy 9-10 , 19-20 , pok. 321/C3

Terminarz spotkań i oceny zadań:

Zadania laboratoryjne:



Laboratorium (A0)  -  Konfiguracja środowiska Android Studio
Zapoznanie się ze środowiskiem programistycznym:
  1. Pobierz materiały pomocnicze rozdziały 2-6 z darmowego podręcznika
    "Android Studio Development Essentials" z portalu Techotopia.
  2. Zapoznaj się z rozdziałem 2 a następnie użyj SDK Manager
    aby sprawdzić/zainstalować/odinstalować odpowiednie Android SDK
    ( tzn. oprogramowanie platformy, przykłady, narzędzia, dokumentację, itp.)
    dla wybranej wersji systemu Android (API level)
  3. Zapoznaj się z rozdziałem nr 5 i użyj Virtual Device Manager aby utworzyć nową instancję emulatoratora dla wersji API skonfigurowanej w zadaniu (b)
  4. Na podstawie instrukcji z rozdziału nr 3, przetestuj proces tworzenia / kompilacji / uruchamiania przykładowej aplikacji "Blank Activity".
    Do testów, wykorzystaj urządzenie wirtualne (emulator) utworzone w zadaniu (d).
  5. Użyj narzędzie Device Monitor (DDMS) oraz jego okna: Devices, FileExplorer, Emulator Control oraz LogCat, do obserwacji stanu emulatora (lub rzeczywistego urządzenia) oraz testowanej aplikacji.
  • Instalacja Android Studio dla systemów operacyjnych Windows, MacOSX i Linux


Archiwalne materiały dla środowiska Eclipse ADT (2014-07-02):

 
Laboratorium (A1)   -  Analiza cyklu życia Aktywności w aplikacji Android.
Pobierz z Internetu, rozpakuj, zaimportuj i przetestuj w środowisku Android Studio przykładową  aplikację 03-1-LifeCycleDemoarchiwum V. Matosa,
a następnie spróbuj wykonać własną wersję takiej aplikacji, która będzie sygnalizować zmiany wewnętrznego stanu Aktywności, poprzez wyświetlanie powiadomień za pomocą obiektów klasy Toast:.
      Toast.makeText(this, "onCreate", 1).show();
zaimplementuj w ten sposób działanie metod obsługujących wybrane podstawowe wydarzenia:  onCreate, onStart, onResume, onSaveInstanceState, onPause, onStop, onDestroy, onRestart.

Podpowiedź:
To zadanie będzie łatwiejsze gdy wykorzystasz opcję menu
    Code > Override Methods…      (skrót Ctrl+O)
dostępną w środowisku Android Studio.

Zaobserwuj i zanotuj sekwencje komunikatów Toast wyświetlanych po::
  1. Kliknięciu programowego przycisku FINISH
  2. Kliknięciu sprzętowego przycisku BACK
  3. Kliknięciu sprzętowego przycisku HOME
  4. Kliknięciu przycisku połączenia telefonicznego (CALL - zielona słuchawka)
  5. Przytrzymaniu przycisku odłożenia słuchawki (HANG-UP -  czerwona słuchawka)
  6. Otrzymaniu tekstowej wiadomości SMS (z innego emulatora lub telefonu)
  7. Po otrzymaniu połączenia głosowego (z innego emulatora lub telefonu).
Za każdym razem wróć do tego samego podtsawowego stanu "running",
poprzez otwarcie okna z listą zainstalowanych aplikacji (launch pad),
i przywrócenie/uruchomienie aplikacji, klikając na jej ikonie.

Zaobserwowane sekwencje komunikatów opisz i skomentuj, w formie sprawozdania, w pliku o nazwie:  Laboratorium_1.txt  lub  Laboratorium_1.pdf

Materiały/slajdy pomocnicze:
       - Android Application's Life Cycle

   
 
Laboratorium (A2)   -   Implementacja aplikacji wykonującej proste obliczenia
  1. Wzorując się na wskazówkach:
    - z zestawu slajdów Android Devlopment Introduction  (ze stron nr: 32-39)
    - lub przykładowego kalkulatora napiwku omówionego w podrozdziale nr 2.3.2
       z książki "Unlocking Android",
    napisz własny program "Kalkulatora/Przelicznika kursu walut". Jako punkt startowy można wykorzystać domyślny szablon Blank Activity

  2. Wykorzystaj widok Android Monitor (ikona narzędzi w lewym dolnym rogu),
    lub narzędzie / perspektywę DDMS (Tools > Android > Android Device Monitor),
    oraz wydruki kontrolne wykonywane w kodzie Java za pomocą  poleceń:
    Log.i( "TAG", "Tekst komunikatu");
    do śledzenia działania programu i sygnalizowania błędów.
Inne materiały pomocnicze:

 
Laboratorium (A3)  -  ANDROID -  Ćwiczenia z projektowaniem "responsive" UI
Oprogramuj jednoekranową aplikację (single Activity app) demonstrującą wykorzystanie komponentów dziedziczących po klasie View (Layouts, Widgets) do skonstruowania interfejsu użytkownika, który będzie się dynamicznie dopasowywał do: wielkości (small, normal, large, ... itd), rozdzielczości (ldpi, mdpi, ... itd) i orientacji (port, land, square) wyświetlacza:
  1. Program demostrujący różne możliwości zmian koloru/rozmiaru/typu czcionki tekstów wyświetlanych w etykietach lub oknach edycyjnych, jako rezultat klikania na różnych przyciskach lub wyboru różnych opcji menu.

  2. Aplikacja standardowego kalkulatora arytmetycznego, z zestawem klawiszy numerycznych oraz klawiszy podstawowych operacji arytmentycznych (+,-,*,/).
Materiały pomocnicze:

 
Laboratorium (A4)  -  ANDROID -  aplikacje złożone z wielu okien/aktywności
Oprogramuj złożoną wielo-okienkową aplikację, demonstrującą wykorzystanie obiektów klasy Intent oraz metody startActivity(...) do uruchamiania własnych oraz wbudowanych aktywności systemu Android (takich jak: Contacts, PhoneDialer, WebBrowser, GoogleMap). Klikanie przycisków umieszczonych w głównym oknie/aktywności tego programu powinno powodować:   
  1. Wyświetlenie listy kontaktów zapisanych w telefonie (a w wersji zaawansowanej: wybór jednego z kontaktów).
  2. Napisanie wiadomości SMS, której treść oraz odbiorca (numer telefonu) będą wprowadzane za pomocą dwóch pól EditText.
  3. Wyświetlenie mapy (GoogleMap) dla miejsca, którego współrzędne geograficzne tzn. długość i szerokość geograficzna będą wprowadzane w polach EditText.
Przykładowe instrukcje takich wywołań startActivity można znależć w prezentacji Android Intents na stronach nr: 10-26.
  1. Ostatni przycisk powinien uruchamiać nową dodatkową aktywność, w całości napisaną przez studenta, za pomocą metody startActivityForResult(...).
    Aktywność ta będzie otrzymywać parametry z okna głównego (a po zakończeniu działania zwracać wynik) w obiekcie klasy Bundle.
Wykorzystanie obiektów klasy Bundle do przekazywania argumentów jest omówione w wyżej wymienionej prezentacji na stronach nr 44-48, a przykładowa aplikacja realizująca funkcjonalność sumowania dwóch otrzymanych liczb (Example 17), jest zaprezentowana na stronach od 49 do 60.  

Inne materiały pomocnicze:
Tutorial na temat Intencji oraz Aktywności w systemie Android (aut. Lars Vogel):
  -  Android Intents - Tutorial
Rozdziały z podręcznika online "Android Studio Development Essentials (Techotopia)
  - 28 - An Overview of Android 6 Intents
  - 29 - Android 6 Explicit Intents
  - 30 - Android 6 Implicit Intents
Zmiany w systemie nadawania uprawnień (od API Level 23 - Android 6.0)
  - Requesting Permissions at Run Time


Laboratorium (A5)  -   Przesyłanie danych poprzez SMS/MMS (Telephony API)
Napisz aplikację "TelephonyDemo", która zademonstruje jak należy oprogramować następujące funkcjonalności:
  1. Odczyt podstawowych informacji o parametrach i stanie modułu telefonii
    (CallState, PhoneType, NetworkType, subscriber SIM ID, itp) 
    dokumentacja:  [Listing 7.1]  oraz  android.telephony.TelephonyManager
  2. Blokowanie połączeń wychodzących (dla wybranych numerów)
    dokumentacja:  [Listing 7.6]
  3. Programowa obsługa przychodzących wiadomości SMS oraz automatyczne wysyłanie odpowiedzi (np. danych personalnych odbiorcy i jego aktualnej geo-pozycji).
    dokumentacja:  [Listing 7.7 and 7.8] ,  android.telephony.SmsManager
  4. Monitorowanie zmian stanu kanału łącza głosowego oraz transmisji danych
    (np. dostępności Internetu czy zmian mocy/jakości sygnału GSM)
    dokumentacja:  [Listing 7.2] ,  android.telephony.PhoneStateListener
Materiały pomocnicze:
  - Chapter 7. Telephony API  - przykładowy rozdział z podręcznika "Android in Action"
  - Requesting Permissions at Run Time - jak rozwiązać problem odmowy uprawnień
    (permission denied error) gdy targetSdkVersion jest 23 lub nowsze.

Android   Projekt własnej aplikacji Android

Laboratorium (Projekt-Android)
  • Temat projektu może być wybrany/zaproponowany przez studenta.
      
  • Zadanie jest realizowane indywidualnie przez trzy kolejne spotkania laboratoryjne
    (na pierwszym spotkaniu należy przysłać opis / na ostatnim zaprezentować rozwiązanie)
       
  • Zakres projektu powinien uwzględnić przynajmniej dwa wybrane zagadnienia z dziedziny technologii mobilnych, które nie były realizowane na wcześniejszych laboratoriach:
    1. mobilna baza danych (SQLite)
    2. obsługa wbudowanych sensorów: akcelerometr, żyroskop, magnetometer, gps, czujnik światła, kamera, itp
    3. Internet - transmisja danych, synchronizacja, web services
    4. generowanie grafiki 3D oraz animacji na urządzeniach mobilnych
    5. komunikacja Bluetooth pomiędzy różnymi urządzeniami mobilnymi oraz wymiana danych z komputerami PC





iOS   Programowanie aplikacji dla iOS 9 w języku Swift 2.2 (3.0)

Laboratorium (i1)  - Wprowadzenie iOS/Swift, środowisko Xcode, HelloWord
Zadanie domowe:
W ramach przygotowania do pierwszego laboratorium z tematu iOS, zapoznaj się z dwoma wprowadzającymi video-wykładami kursu  "Developing iOS 9 Apps with Swift"
dostępnymi na YouTube:

Podczas laboratorium:
Praktyczne ćwiczenia z programowaniem aplikacji w środowisku Xcode
oraz zapoznanie się z podstawowymi elementami składowymi projektu dla systemu iOS
  1. Wykorzystaj wskazówki z rozdz.15 podręcznika iOS9/Swift z portalu Techotopia:
    Chapter 15. Creating an Interactive iOS 9 App
    do napisania własnej aplikacji "Konwerter Walut", o analogicznych funkcjonalnościach jak aplikacja konwertera walut dla systemu Android
    (napisana podczas laboratorium A2)

  2. W wersji zaawansowanej, zamiast prostego konwertera walut, można oprogramować kalkulator matematyczny o funkcjonalnościach podobnych do aplikacji kalkulatora dla systemu Android (z historią), wykonanej podczas laboratorium A3.

Materiały uzupełniające:
  - Dokumentacja on-line języka programowania Swift w werji 3.0
  - Podręcznik programowania z portalu Techotopia - iOS 9 App Development Essentials
  - Walkthrough iOS 5 - archiwalne slajdy (2013) opisujące znaczenie kontrolek i paneli
    środowiska Xcode (to była wersja 4, ale wiele elementów pozostało bez zmian) 


Laboratorium (i2)  cykl życia ViewController-a, Storyboard i przejścia (Segues)
  1. Zapoznaj się z cyklem życia ViewController-a oraz jego istotną rolą w typowej dla iOS  architekturze Model-View-Controller. Materiały:
      - slajdy CS193p - Lecture 8 - View Controller Life cycle
      - oraz odpowiadające im video 

    Napisz prostą jednoekranową aplikację demonstrującą cykl życia ViewController-a która będzie miała zaimplementowane wszystkie podstawowe metody cyklu życia
    (tzn.. viewDidLoad, viewWill/DidAppear, viewWill/DidDisappear, viewWillTransitionToSize, ..., etc). Jako bazę, można wykorzystać interfejs aplikacji konwertera wykonanej podczas pierwszego laboratorium iOS (i1).

    Do debuggowania (wizualizacji) sekwencji kolejnych stanów cylku życia, wykorzystaj funkcję print(...)  (lub NSLog(...) w Xcode 7 i starszych), które mają podobne znaczenie jak  Toast  lub   wydruki  Log.i( ) podczas wizualizacji cyklu życia aktywności w systemie Android. 

  2. Zapoznaj się z techniką wizualnego tworzenia przejść (Segue) pomiędzy różnymi ViewController-ami złożonej aplikacji iOS, zawierającej wiele widoków/ekranów:
    Techotopia - Chapter 23 - Using Storyboards and Segues in XCode 7

    Wzorując się na pomyśle aplikacji "Psychologist"
    (wykorzystywanej jako demo do archiwalnego wykładu na temat iOS z roku 2011 "Lecture 6: Multiple MVCs and Segues" , którego demonstracja jest pokazana  pokazana podczas ostatnich 25 minut tego video , zaczynając od 44 minuty)

    napisz podobną aplikację "Doradca kierunku studiów", która będzie wspomagać studenta/kandydata w wyborze kierunku/specjalności na wydziale Elektroniki.
    Wykorzystaj pytania typu: Czy bardziej cię interesuje hardware czy software? Czy interesuje cię łączenie elektroniki i mechaniki? Jaki jest twój ulubiony język programowania: Java, C, Asembler? itp. 


Laboratorium (i3)  Komponent TableView(Controller), Architektura Master-Detail
  1. Zapoznaj się z materiałami prezentującymi zasady implementacji UITableView oraz TableViewController w architekturze aplikacji dla iOS:
      - z wprowadzającym tutorialem - Getting Started With UITableView in Swift
      - slajdami CS193p - Lecture 10 - Table View (zaczynając od strony nr 8),
         lub video do tego wykładu (1h 21min)
    Bardziej zaawansowane tutoriale można znaleźć na witrynie Apple Developer:
      - Lesson 7 Working with Table Views (master TableView)
      - Lesson 8 Implementing Navigation  (connect with detail Meal sub-View)

  2. Napisz przykładową aplikację implementującą szablon Master-Detail,
    która wykorzystuje główny TableViewController (master) do wyświetlania wielowierszowej listy przykładowych elementów (np. samochodów, zwierząt, ...)
    oraz szczegółowy (detail) ViewController do zaprezentowania szczegółowego opisu wybranego elementu w/w listy.

    Domyślnym tematem, może być aplikacja wyświetlająca ogólną listę wszystkich kierunków na wydziale Elektroniki oraz szczegółowe informacje o specjalnościach  na wybranym kierunku.

    W zależności od preferencji, można w tym celu wykorzystać listę Static_Cells  wyświetlających stałą listę listę elementów (predefiniowanych w Storyboard)
    lub dynamicznie tworzoną listę Dynamic_Prototypes  (której zawartość może być dynamicznie pobierana z lokalnej tablicy lub zewnętrznej bazy danych).




Windows 10 Mobile Programowanie aplikacji mobilnych
dla systemu
Windows 10
(Universal Windows Platform)

Laboratorium (W1)  -  Środowisko programisty UWP, HelloWord, Cykl życia
Zadanie domowe:
W ramach przygotowania do pierwszego laboratorium z tematu Windows Mobile, zapoznaj się z dwoma wprowadzającymi prezentacjami z portalu Get started with Windows apps
oraz przykładem aplikacji kalkulatora:

Podczas laboratorium:
Praktyczne ćwiczenia z programowaniem aplikacji w środowisku Visual Studio 2015
oraz zapoznanie się z możliwościami tworzenia aplikacji na urządzenia mobilne
z wykorzystaniem Universal Windows Platform:
  1. Wykorzystaj wskazówki z materiałów zadania domowego, do napisania własnej aplikacji "Konwerter Walut", o analogicznych funkcjonalnościach jak aplikacja konwertera walut dla systemu Android (z laboratorium A2)

  2. W wersji zaawansowanej, zamiast prostego konwertera walut, można oprogramować kalkulator matematyczny o funkcjonalnościach podobnych do aplikacji kalkulatora (z historią) dla systemu Android, wykonanej podczas laboratorium A3.
Materiały pomocnicze:

Archiwalne materiały dla Windows Phone 8.1 (duża część jest nadal aktualna)


Laboratorium (W2)  Adaptacyjny interfejs użytkownika. Page Navigation - nawigacja i przekazywanie danych pomiędzy stronami (ekranami) aplikacji.
  1. Przeczytaj wybrane rozdziały z podanego poniżej podręcznika "Windows 10 ... for beginners":
      - UWP-008 - XAML Layout with Grids
      - UWP-009 - XAML Layout with StackPanel
      - UWP-017 - XAML Layout with RelativePanel
    a następnie wykorzystaj zawarte w nich wskazówki do napisania aplikacji zaawansowanego matematycznego kalkulatora (z historią), który będzie adaptacyjnie dopasowywał swój interfejs do rozmiaru oraz orientacji ekranu urządzenia. Uwzględnij przynajmniej trzy różne rozmiary ekranu oraz reakcje na zmianę orientacji (pionowa/pozioma) dla przynajmniej jednego rozmiaru.
    Dodatkowe informacje na temat adaptacji interfejsu dla różnych wielkości/orientacji ekranu oraz różnych urządzeń są opisane w rozdziałach 037-039.
       
  2. Zapoznaj się z rozdziałem UWP-019-Working with Navigation i wykonaj aplikację demonstrującą przejścia pomiędzy ekranami/stronami połączone z przekazywaniem parametrów. Aplikacja nie musi robić niczego "sensownego" ale powinna się składać przynajmniej z 3 stron (Page), a przejścia powinny być inicjowane przez klikanie na umieszczone na tych stronach przyciski oraz przycisk "back".
Materiały pomocnicze:
  - Chanel_9/MSDN kurs: "Windows 10 Development for Absolute Beginners" (Video)
  - podręcznik: "Windows 10 Development for Absolute Beginners" (PDF)


Laboratorium (W3)    Dystrybucja aplikacji poprzez sklep Microsoft Store
  1. Przestudiuj następujące instrukcje:
      - rozdział nr 56 z książki  "Windows 10 Development for Absolute Beginners"
         UWP-056 - Submitting to the Windows Store
      - oraz slajdy Developers Guide to Windows  10 - Submit App (PPTx)
         lub odpowiadające im video (57min)
    demonstrujące jak:
      - wykorzystać Windows Dev Center dashboard do przygotowania publikacji
         własnej aplikacji w sklepie Windows App Store.
      - oraz jak udostępnić aplikację beta testerom z urządzeniami Windows 10

  2. Następnie wykorzystaj zdobytą wiedzę do zarejestrowania się jako developer aplikacji Windows i użyj DevCenter dashboard do publikacji wybranego programu UWP, z dotychczasowych laboratoriów, w sklepie Windows App Store.
    Poprawne zakończenie procesu publikacji należy potwierdzić wysyłając do instruktora prowadzącego laboratorium list z odsyłaczem do wersji beta/testowej  (lub targeted distribution page) w Windows Store.


    Sczegółowa instrukcja jak założyć darmowe/studenckie konto developera:
      - Windows Store registration with student code obtained from Microsoft Imagine
    W skrócie:
         0) Podczas zakładania konta, rejestracji oraz dostępu do WidnowsDevCenter
             najlepiej korzystaj z przeglądarek Microsoft (Edge lub Internet Explorer).
             Niektóre strony są niepoprawnie interpretowane w innych przeglądarkach
             takich jak FireFox, Chrome, Opera, Safari, itp.
             W tych innych, czasem pomaga praca w trybie prywatnym / incognito.
         1) załóż swoje konto edukacyjne na Microsoft Imagine
             lub ogólne konto Microsoft (jedno konto - wszystkie usługi Microsoft)
         2) potwierdź swój status studenta,
              przez wybranie "Account -> Please verify your student status",
              wybranie metody "School email address" i podanie adresu studenta PWr
              (na ten adres przyjdzie list z odpowiednim linkiem)
         3) Pobierz darmowy "Registration Code" do Dev Center :
             "Microsoft Imagine > Downloads > Software Catalog > Windows Store"
         4) załóż konto developera w Windows Dev Center
             i po wypełnieniu danych personalnych, podaj "Promo code"
             pobrane Microsoft Imagine.
            Dalej według podanej powyżej instrukcji.