© Zühlke 2013 Oliver Brack Workshop 6 (ws6C) native Entwicklung für mobile Geräte Mono 11. März...

© Zühlke 2013

Oliver Brack

Workshop 6 (ws6C) native Entwicklung für mobile GeräteMono

11. März 2013Folie 1

http://4.bp.blogspot.com/-C3JdJCVJsD8/T-WPeLMIg9I/AAAAAAAAAEc/0MOE6Ko-s2U/s1600/the_new_windows_logo__original_and_colored__by_dakirby309-d4q2ybv-934x1024.png

© Zühlke 2013Workshop 6 (ws6C) native Entwicklung für mobile Geräte | Oliver Brack

Oliver [email protected]

• HSR Hochschule für Technik RapperswilInformatikstudium

2003 – 2006

• Zühlke Engineering AGSoftware Engineer2007 – 2012

• HWZ Hochschule für Wirtschaft ZürichEMBA & MBA in International Business

2010 – 2012

• Zühlke Engineering AGLead Software Architect

2013 – heute

• Client-Entwicklung mit .NET• Projektleitung

Schwerpunkte

11. März 2013 Folie 2

mailto:[email protected]


«Flughöhe» des Workshops

Beginner

Advanced

Expert

Dieser Kurs

Semesterarbeit

> 1 Jahr Projekterfahrung

Level

Tech.




Was machen wir in diesem Workshop?




Unser Plan (1/2)

18.2. (Romano) Einführung, «Mega CRM», Aufsetzen25.2. (Romano) Einführung in Windows Phone 8 Entwicklung04.3. (Romano) Umsetzung «Mega CRM» mit Windows Phone 8 11.3. (Oliver) Einführung in Mono-Entwicklung18.3. (Oliver) Umsetzung «Mega CRM» mit MonoTouch25.3. (Oliver) Umsetzung «Mega CRM» mit MonoDroid01.4. Kein Workshop (Ostern)08.4. (Michael) Einführung in iOS Entwicklung15.4. (Michael) Umsetzung «Mega CRM» mit iOS22.4. (Michael) Umsetzung «Mega CRM» mit iOS






Unser Plan (2/2)

29.4. (Philipp) Einführung in Android 06.5. (Philipp) Umsetzung «Mega CRM» mit Android13.5. Kein Workshop (Projektwoche)20.5. (Philipp) Umsetzung «Mega CRM» mit Android27.5. (Matthias) Einführung in PhoneGap03.6. (Matthias) Umsetzung «Mega CRM» mit PhoneGap10.6. (alle) Präsentation Eurer Arbeit



• Entwicklungsumgebungen eingerichtet– inkl. Emulator für Android

• Lauffähige App je Client (iOS/Android)– Karten-App als Beispiel

• Grundlagen der Entwicklungsumgebung(en)– UI-Elemente im Code ansprechen– Designer nutzen (bei Bedarf)– kompilieren, deployen, debuggen (Emulator)

Erster WorkshopZiele



Erster WorkshopAgenda

• Einführung (5’)• Mono (15’)• Karten-App (20’)

– Einführung– Erste Schritte

Pause (5’)• Demo iOS (10’)• Demo Android inkl. Emulator (15’)• Karten-App (15’)• Retrospektive und Ausblick (5’)

– Was war gut?– Was kann verbessert werden?


© Zühlke 2013

Workshop 6 (ws6C) native Entwicklung für mobile Geräte

Oliver Brack

Mono

Was ist MonoTouch bzw. Mono for Android?



Gemeinsamer Code (DRY)

Service (Azure)

Business Layer Business LayerBusiness Layer

Kundendaten

User Interface User Interface



Kompetenzen

Plattformspezifisch Mono

ServiceService

Objective-C Java

z.B. .NET.NET

.NET



Kompetenzen

Plattformspezifisch Mono

Objective-C- Xcode

z.B. .NET

.NET (C#)- Xcode- XML

Java- XML



• Weiterhin C#– Konzepte– Code– Tools, Prozesse

• Mehrere Plattformen– Quellcode hybrid– App nativ (Store)– Zugriff auf Hardware– Natives UX (z.B. UI-Controls)

• Kompetenzen– Technologie-Portfolio (Kosten)– Fokussierung– Austauschbarkeit (Risiken)

Vorteile Mono



Xamarin 2.0MonoTouch bzw. Mono for Android

Xamarin 2.0MonoTouch Mono for Android

Sprache C# (statt Objective-C)

C# (statt Java)

Framework

Mono Mono

IDE MonoDevelop, Xamarin Studio, (Visual Studio)

MonoDevelop, Xamarin Studio, Visual Studio

UI-Designer

Xcode Xamarin Studio, Visual Studio, Eclipse

Hardware Intel-Mac Windows PC/Intel-MacPreise Xamarin: USD

299.-/Jahr*Apple Dev: USD 99.-/Jahr

Xamarin: USD 299.-/Jahr*Google Dev: USD 25.-/Jahr

*: verschiedene Preispläne, siehe Webseite11. März 2013 Folie 16

https://store.xamarin.com/


• «Ahead of Time» Kompilierung (AOT)– Runtime wird nicht installiert– Native App entsteht (Store)– Quellcode hybrid

• Xamarin wrappt native APIs (Apple bzw. Google)– Namespaces grösstenteils gleich (Dokumentation)– Vorgehen automatisiert (schnelle Updates)

• .NET Framework nutzen– Funktionsumfang Silverlight 4

– Keine Codegenerierung zur Laufzeit (z.B. Emit)– Einschränkungen bei Reflection und Generics (Laufzeit)

– Nur benutzte Assemblys werden mitkompiliert– «Framework-Komfort» (z.B. Garbage Collection)

Wie funktioniert Mono?


© Zühlke 2013

Workshop 6 (ws6C) native Entwicklung für mobile Geräte

Oliver Brack

Karten-App

Beispielapplikation für Workshop 1



Seid Ihr bereit für Mono? (1/2)11.03.13 – 25.03.13

Allgemein• Apple Rechner mit OS X 10.7.5

– Xcode 4.6 (über App Store)– Xamarin for Mac (http://xamarin.com/download)

• PC mit Windows 7 (optional, empfohlen)– Visual Studio 2010 (wenn Entwicklung in VS statt

Xamarin Studio gewünscht, empfohlen)– Xamarin for Windows (http://xamarin.com/download)

• Xamarin Account– Begin a 30-day-Trial: http://

docs.xamarin.com/guides/cross-platform/getting_started/beginning_a_xamarin_trial (nötig, um App im Emulator laufen zu lassen)

• Hardware (optional)– iOS-Gerät (iPhone, iPod Touch)– Android-Gerät


http://xamarin.com/download

http://xamarin.com/download

http://docs.xamarin.com/guides/cross-platform/getting_started/beginning_a_xamarin_trial





Seid Ihr bereit für Mono? (2/2)11.03.13

Erster Workshop (11.03.13)• Google APIs für Android 4.0 (API14)

– http://docs.xamarin.com/guides/android/platform_features/maps_and_location/part_2_-_maps_api Kapitel «Google APIs Add-On»

• Google Maps API Key– Für gewünschte Android-Entwicklungsplattform

(Windows oder OS X):http://docs.xamarin.com/guides/android/platform_features/maps_and_location/obtaining_a_google_maps_api_key


http://docs.xamarin.com/guides/android/platform_features/maps_and_location/part_2_-_maps_api


http://docs.xamarin.com/guides/android/platform_features/maps_and_location/obtaining_a_google_maps_api_key





Karten-AppScreenshots Musterlösungen

iOS Android



Koordinaten• FHNW: 47.479° N, 8.213° E• Zühlke: 47.399850° N, 8.443796° EiOS• Hilfsklasse mit Extension Method für MKMapView-

Control:MapExtensions.CenterMap()– Komfortables Zentrieren/Zoomen der Karte

Android• Tutorial von Xamarin zur Orientierung

Karten-AppHilfen






• Vorbereitungen (wenn noch nicht erledigt)– Google APIs für Android 4.0 (API14) herunterladen– Google Maps API Key erzeugen

• Solutions mittels Template erstellen– iOS: iOS > iPhone > Single View Application– Android: Android > Android Application

• Karten-Control verwenden– iOS: Map View (Xcode)– Android: com.google.android.maps.MapView (XML, API Key

einsetzen)• App in Emulator starten

– Android: Emulator mit Google API erstellen (AVD Manager, Demo)

– Breakpoint setzen und debuggen

Karten-AppErste Schritte



iOS• Sogenannte «Outlets» in UI-Editor (Xcode)

erstellen:http://oleb.net/blog/2011/06/creating-outlets-and-actions-via-drag-and-drop-in-xcode-4/

• Outlets sind im Code direkt als Instanzvariablen ansprechbar

Android• Benennung mit ID direkt in UI-XML:android:id="@+id/map"

• Ansprechen im Code via FindViewById-Methode und Resource-Konstante:var mapView = FindViewById<MapView>(Resource.Id.map);

DemoUI-Elemente ansprechen


http://oleb.net/blog/2011/06/creating-outlets-and-actions-via-drag-and-drop-in-xcode-4/




• Map View• Outlet erstellen• Map View aus Code ansprechen• Toolbar mit Buttons

Demo iOSKarten-App



Emulator• Google APIs – API Level 14• SnapshotKarten-App• com.google.android.maps.MapView• ID zuweisen (XML): @+id/map• MapView aus Code ansprechen• LinearLayout mit Buttons

Demo AndroidEmulator erstellen und Karten-App



• Layout gemäss Screenshots– Karten-Control– Toolbar (bzw. LinearLayout) mit Buttons

• Zentrierung auf Koordinate mittels Button-Click– UI-Controls aus Code ansprechen– iOS: Hilfsklasse für Zentrierung

• Entwicklungsumgebung nutzen– Debuggen (Schritt für Schritt)– Breakpoints– Call Stack– Watch (Variablen)

• Weitere Ausbauschritte– Aktuelle Koordinate/Zoomstufe anzeigen– Layers (z.B. Verkehr) oder Overlays anzeigen– GPS zur Positionierung nutzen

Karten-AppFertig stellen



Was war gut?• Alle haben nun lauffähige Umgebungen.Was kann verbessert werden?• Lieber vormachen am Beamer und alle machen 1:1

mit.• Vorbereitung der Studenten.

Retrospektive



Seid Ihr bereit für Mono?18.03.13

Zweiter Workshop (18.03.13)• Karten-App (iOS und Android)

– max: selber fertig stellen– min: Musterlösungen verstehen

– MonoTouch.FHNW.Map.zip– MonoDroid.FHNW.Map.zip

• ServiceStack anschauen– http://www.servicestack.net/

• MonoTouch.Dialog anschauen– https://

github.com/migueldeicaza/MonoTouch.Dialog – http://

docs.xamarin.com/guides/ios/user_interface/monotouch.dialog


http://www.servicestack.net/

http://www.servicestack.net/

https://github.com/migueldeicaza/MonoTouch.Dialog

https://github.com/migueldeicaza/MonoTouch.Dialog

http://docs.xamarin.com/guides/ios/user_interface/monotouch.dialog



Date post:	06-Apr-2016
Category:	Documents
Upload:	odila-schlimgen
View:	212 times
Download:	0 times

© Zühlke 2013 Oliver Brack Workshop 6 (ws6C) native Entwicklung für mobile Geräte Mono 11. März...

Documents