© Zühlke 2013 Oliver Brack Workshop 6 (ws6C) native Entwicklung für mobile Geräte MonoTouch (iOS) 18. März 2013 Folie 1.

Präsentation zum Thema: "© Zühlke 2013 Oliver Brack Workshop 6 (ws6C) native Entwicklung für mobile Geräte MonoTouch (iOS) 18. März 2013 Folie 1."—  Präsentation transkript:

1 © Zühlke 2013 Oliver Brack Workshop 6 (ws6C) native Entwicklung für mobile Geräte MonoTouch (iOS) 18. März 2013 Folie 1

2 © Zühlke 2013 Unser Plan (1/2) 18.2. (Romano) Einführung, «Mega CRM», Aufsetzen 25.2. (Romano) Einführung in Windows Phone 8 Entwicklung 04.3. (Romano) Umsetzung «Mega CRM» mit Windows Phone 8 11.3. (Oliver) Einführung in Mono-Entwicklung 18.3. (Oliver) Umsetzung «Mega CRM» mit MonoTouch 25.3. (Oliver) Umsetzung «Mega CRM» mit MonoDroid 01.4. Kein Workshop (Ostern) 08.4. (Michael) Einführung in iOS Entwicklung 15.4. (Michael) Umsetzung «Mega CRM» mit iOS 22.4. (Michael) Umsetzung «Mega CRM» mit iOS Workshop 6 (ws6C) native Entwicklung für mobile Geräte | Oliver Brack18. März 2013Folie 2

3 © Zühlke 2013 Unser Plan (2/2) 29.4. (Philipp) Einführung in Android 06.5. (Philipp) Umsetzung «Mega CRM» mit Android 13.5. Kein Workshop (Projektwoche) 20.5. (Philipp) Umsetzung «Mega CRM» mit Android 27.5. (Matthias) Einführung in PhoneGap 03.6. (Matthias) Umsetzung «Mega CRM» mit PhoneGap 10.6. (alle) Präsentation Eurer Arbeit Workshop 6 (ws6C) native Entwicklung für mobile Geräte | Oliver Brack18. März 2013Folie 3

4 © Zühlke 2013 Übersetzungen – In Musterlösung vorhanden App Store – Thema bei nativer iOS-Entwicklung (Michael Mühlebach) UI rudimentär – Verfeinerung im nativen Workshop – Selbständiges Finish für Präsentation Nicht alle CRUD-Operationen – Zeitbudget – Musterlösung als Beispiel – Selbständiges Finish für Präsentation Zweiter Workshop Einschränkungen Workshop 6 (ws6C) native Entwicklung für mobile Geräte | Oliver Brack18. März 2013Folie 4

5 © Zühlke 2013 «Mega CRM» auf iOS mit Mono Service konsumieren – ServerAccess (Business Layer, shared Code) – ServiceStack Navigation in iOS Kundenliste anzeigen – Tabellen in iOS – Hintergrund-Tasks (TPL) Kunde anzeigen – MonoTouch.Dialog Kunde bearbeiten Kunde löschen Kunde hinzufügen Kunde suchen (filtern) Zweiter Workshop Ziele Workshop 6 (ws6C) native Entwicklung für mobile Geräte | Oliver Brack18. März 2013Folie 5

6 © Zühlke 2013 Zweiter Workshop Agenda Einführung (5’) Repetition/Rückblick (5’) «Mega CRM» (30’) – Service prüfen – ServerAccess mit ServiceStack – Tabellen in iOS Pause (5’) «Mega CRM» (40’) – Hintergrund-Tasks – MonoTouch.Dialog – Kunde anzeigen – Kunde bearbeiten Retrospektive und Ausblick (5’) – War Form gut? Beibehalten? Workshop 6 (ws6C) native Entwicklung für mobile Geräte | Oliver Brack18. März 2013Folie 6

7 © Zühlke 2013 Karten-App (iOS und Android) – max: selber fertig stellen – min: Musterlösungen verstehen – MonoTouch.FHNW.Map.zip MonoTouch.FHNW.Map.zip – MonoDroid.FHNW.Map.zip MonoDroid.FHNW.Map.zip Installationen und Konfigurationen – Android-Emulator Repetition/Rückblick 18. März 2013Workshop 6 (ws6C) native Entwicklung für mobile Geräte | Oliver BrackFolie 7

8 © Zühlke 2013 http://ws6c.cs.technik.fhnw.ch/group1 – Gruppen 1-8 – Vorsicht bei gegenseitigen Änderungen der Kundendaten! RESTful API mit JSON: –[{"Id":1,"Title":"Mrs","FirstName":"Lilliane","MiddleName ":"Catrina","LastName":"Wyss","Company":"Volkswagen","Web Page":"http://www.volkswagen.com","PhoneNumber":"+65 (1418) 832671","FaxNumber":"+21 (4004) 257244","MobileNumber":"+91 (6007) 144197","Street":"Lake Street 343","Email":"nadia.huber@volkswagen.com","City":"Madison ","State":"","PostalCode":"42481","Country":"Western Sahara","Department":"NPP","Office":"225","Profession":"w elder","ManagersName":"Leopoldo Keller","AssistantName":"Agnes Weber","Nickname":"The Unpredictable","Birthday":"/Date(1042844400000+0100)/"}] Service Workshop 6 (ws6C) native Entwicklung für mobile Geräte | Oliver Brack18. März 2013Folie 8

9 © Zühlke 2013 Startprojekt mit ServerAccess – 10_MonoTouch.CustomerManager.zip 10_MonoTouch.CustomerManager.zip ServiceStack übernimmt Verbindungsaufbau und JSON- Serialisierung: –var restClient = new JsonServiceClient("http://ws6c.cs.technik.fhnw.ch/group1"); var customers = restClient.Get >("/customer"); – Customer-Klasse aus Service-Projekt (C#) Service-Zugriff analysieren: – Ausgabe auf Kommandozeile: Console.WriteLine() – Debugging mit Breakpoint ServiceStack Workshop 6 (ws6C) native Entwicklung für mobile Geräte | Oliver Brack18. März 2013Folie 9

10 © Zühlke 2013 NavigationController als Startview – ViewController mit Kundenliste – ViewController mit Kundendetails – Back-Button als Navigationselement UINavigationController erstellen und als Startview zuweisen UIViewController für Kundenliste erstellen und in NavigationController «pushen» Navigation in iOS Workshop 6 (ws6C) native Entwicklung für mobile Geräte | Oliver Brack18. März 2013Folie 10

11 © Zühlke 2013 Tabelle als universelles Gestaltungselement in iOS – Einstellungen – Apps (z.B. Facebook) – Zellen: Vorgegebene Layouts oder frei konfigurierbar Daten in Tabelle abfüllen – Eigene TableViewSource – Ableitung von UITableViewSource – Überschreiben der gewünschten Methoden –RowsInSection() –GetCell() Kundenliste als Tabelle anzeigen – UITableView in Xcode hinzufügen (inkl. Outlet) – Eigene TableViewSource-Klasse erstellen – Kunde (Name/Vorname) mit vorgegebenem Layout ( UITableViewCellStyle.Default ) – Kundendaten entgegen nehmen und TableViewSouce instanziieren Tabellen in iOS (1/2) Workshop 6 (ws6C) native Entwicklung für mobile Geräte | Oliver Brack18. März 2013Folie 11 Tabellenzelle

12 © Zühlke 2013 Überschriften anzeigen – Anfangsbuchstaben der Nachnamen –TitleForHeader() Fusszeile anzeigen – Anzahl Kunden –TitleForFooter() Index für Schnellzugriff – Anfangsbuchstaben der Nachnamen –SectionIndexTitles() Zeile selektieren – Kundendetails anzeigen (neue View) –RowSelected() Zwischenlösung – 20_MonoTouch.CustomerManager.zip 20_MonoTouch.CustomerManager.zip Tabellen in iOS (2/2) 18. März 2013Workshop 6 (ws6C) native Entwicklung für mobile Geräte | Oliver BrackFolie 12

13 © Zühlke 2013 Kundendaten im Hintergrund laden – UI nicht blockieren – Benutzer kann lokal weiterarbeiten Task Parallel Library (TPL) http://msdn.microsoft.com/en-us/library/dd460717.aspx http://msdn.microsoft.com/en-us/library/dd460717.aspx Methode im Hintergrund ausführen –Task.Factory.StartNew(DoSomethingOnBackgroundThread); UI aktualisieren (aus dem Hintergrund) –InvokeOnMainThread(delegate { DoSomethingOnUiThread(); }); Hintergrund-Tasks mit TPL Workshop 6 (ws6C) native Entwicklung für mobile Geräte | Oliver Brack18. März 2013Folie 13

14 © Zühlke 2013 MonoTouch.Dialog – Fester Bestandteil von Xamarin 2.0 – Open Source: https://github.com/migueldeicaza/MonoTouch.Dialog https://github.com/migueldeicaza/MonoTouch.Dialog – UI aufgrund von Daten erstellen (lassen) – Automatisches Data Binding Kunde anzeigen – Klasse «Customer» könnte benutzt werden – Besser: UiCustomer erstellen – Copy-Konstruktor mit Customer als Argument Kunde bearbeiten – Weitere Klasse UiEditCustomer erstellen – Attribute zur Steuerung der Eingabe-Möglichkeiten: [Entry(AutocapitalizationType = UITextAutocapitalizationType.Words) public string Street { get; set; } MonoTouch.Dialog Workshop 6 (ws6C) native Entwicklung für mobile Geräte | Oliver Brack18. März 2013Folie 14

15 © Zühlke 2013 Kunde löschen Kunde hinzufügen Kunde suchen (filtern) Mehrsprachigkeit Progress-Overlay während Serverzugriff Kundenadresse auf Karte visualisieren – Wegbeschreibung ab aktuellem Standort (GPS) Kundenfoto mit Kamera aufnehmen Kennzahlen des Kunden visualisieren – evtl. Chart Library einsetzen Kunde als Kontakt hinzufügen Ausbaumöglichkeiten 18. März 2013Workshop 6 (ws6C) native Entwicklung für mobile Geräte | Oliver BrackFolie 15

16 © Zühlke 2013 War gewählte Form gut? Vorzeigen am Beamer Alle arbeiten synchron mit Bilaterale technische Lösung, wenn nötig Beibehalten oder Modusänderung? … Retrospektive Workshop 6 (ws6C) native Entwicklung für mobile Geräte | Oliver Brack18. März 2013Folie 16

17 © Zühlke 2013 Seid Ihr bereit für Mono? 25.03.13 Dritter Workshop (25.03.13) «Mega CRM» für iOS – max: selber fertig stellen – min: Musterlösung verstehen – 99_MonoTouch.CustomerManager.zip 99_MonoTouch.CustomerManager.zip Android-Emulator einrichten und testen – Beispiel-App (Template) muss laufen! Workshop 6 (ws6C) native Entwicklung für mobile Geräte | Oliver Brack18. März 2013Folie 17

18 © Zühlke 2013 Links Präsentationen Source Code \\Fsemu18.edu.ds.fhnw.ch\e_18_data11$\E1862_U nterrichte_I\E1862_6iCa\ws6C\ \\Fsemu18.edu.ds.fhnw.ch\e_18_data11$\E1862_U nterrichte_I\E1862_6iCa\ws6C\ Workshop 6 (ws6C) native Entwicklung für mobile Geräte | Oliver Brack18. März 2013Folie 18