"Programowanie aplikacji mobilnych"
  ARES00213  LABORATORIUM    '2019         

Terminy: Poniedziałek   09:15-11:00,  11:15-13:00
Miejsce:
Lab. 2.3 / C16
Prowadzący:  
dr Marek Piasecki
Konsultacje:
 prowadzacy.pwr.edu.pl  pok. 321/C3

Terminarz spotkań i oceny zadań:


Przykładowy grafik obecności i ocen (z poprzednich lat):

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

 
Laboratorium (A1)   -  Analiza cyklu życia Aktywności w aplikacji Android.
Pobierz z Internetu, rozpakuj, zaimportuj i przetestuj w środowisku Android Studio przykładową  aplikację LifeCycle demo z  archiwum 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 EXIT (w oknie aplikacji)
  2. Kliknięciu sprzętowego przycisku BACK (na telefonie)
  3. Kliknięciu sprzętowego przycisku HOME (na telefonie)
  4. Kliknięciu przycisku połączenia telefonicznego (CALL - zielona słuchawka)
    (uwaga: w starszych telefonach/emulatorach były dodatkowe przyciski Call / Hang-up)
  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 podstawowego 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.
  - przykładowy tutorial  Detecting & sending SMS on Android  (2018 - zaktualizowany
     do nowej polityki uprawnień i nowej obsługi odbierania SMS)

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 wybranego tematu
       (wstępnie uzgodnionego z prowadzącym laboratorium)
    - po trzecim laboratorium (do 10 maja) należy przysłać kod wykonanego projektu
       wraz z krótkim opisem zrealizowanych funkcjonalności,
    - podczas kolejnych laboratoriów (L9-L13) będzie mozliwość indywidualnego
       zaprezentowania projektu "do oceny".   
       
  • Zakres projektu powinien uwzględnić przynajmniej dwa wybrane zagadnienia z dziedziny technologii mobilnych, które nie były realizowane na wcześniejszych laboratoriach, np:
    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
  • Aplikacja powinna mieć interfejs użytkownika o średniej złożoności (3-4 widoki / aktywności lub fragmenty) dopasowujący się do konfiguracji i orientacji urządzenia.




iOS   Programowanie aplikacji dla iOS 10 w języku Swift 3.1
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 10 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.16 podręcznika iOS10/Swift z portalu Techotopia:
    Chapter 16. Creating an Interactive iOS 10 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 wersji 3 / 4
  - Podręcznik programowania z portalu Techotopia - iOS 10 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 24 - Using Storyboards and Segues in XCode 8

    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 - Introducing Table Views in Swift 3
      - slajdami  CS193p - Lecture 9 - Table View 
         lub video do tego wykładu (1h 30min)
    Bardziej zaawansowane tutoriale można znaleźć na witrynie Apple Developer:
      - Working with Table Views (master TableView)
      - Implementing Navigation  (connect with detail Meal sub-View)
    lub Techotopia:
      26) An Overview of iOS 11 Table Views
      27) Using Xcode 9 Storyboards to Build Dynamic TableViews
      28) Implementing iOS 11 TableView Navigation

  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).

Inne materiały:


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. 
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.
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)   
Nawigacja i przekazywanie danych pomiędzy stronami (ekranami) aplikacji.
Dystrybucja aplikacji poprzez sklep Microsoft Store
  1. 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:
     -   Microsoft tutorial: UWP - Implement navigation between two pages
  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

    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.