FMK 2013, Eigene Apps für iOS mit FileMaker Go, Markus Schneider

FileMaker Konferenz 2013 Salzburg !www.filemaker-konferenz.com

Vortragender: Markus Schneider, ReM Software GmbH FileMaker Pro (Advanced) als Entwicklungsumgebung für FileMaker Go

Eigene App's für iOS mit

FileMaker Go

Mit Hilfe von FileMaker Pro und FileMaker Pro Advanced können für FileMaker Go ,Datenbankanwendungen‘ erzeugt werden, die sich wie echte iOS-App‘s präsentieren

! Dieses Referat soll Möglichkeiten und Lösungsideen aufzeigen ! Tipps & Tricks, auf Fehlerquellen und Fallstricke hinweisen ! Ein gewisser Spassfaktor darf dabei auch mit dabei sein (-:

��1



Beispiele zum Beginn...

Wie sehen denn diese ,Apps‘ aus? ! Als Einstieg ein paar Beispiele

��2



Währungsrechner++

��3

Weisses iPhone? Kein Problem - einfach Farben anpassen!



Geräte-Einstellungen

��4



Leuchtmittel

��5



Zum Spass

��6



Trainingsfrequenz

��7

ACHTUNG: Erzeugt Anhaltswerte. Immer mit einem Arzt abklären, wenn's zur Sache geht - vor allem im Alter, beim Neueinstieg, bei Problemchen oder Problemen



Kontroll-Programme

��8



Damit wir iOS7 nicht vergessen..

��9

FLAT Sieht in ,Natura‘ viel besser aus - das ,flat-design‘ wirkt bei diesen Anwendungen sehr gut!



Mit FileMaker Server..

��10



Demo

��11

- Währungsrechner (Eingabe per Tastatur, Anzeige, Differenzanzeige) !- MP5 (Dateneingabe (scrollen bei Pop-Up) !- Leuchtmittel (Steuerung, Anzeige) !- Morsen (Eingabe, Horizontal/Querformat) !- Trainingsfrequenz (Eingaben, Anordnung der Elemente) !- Kontrolle der Steuer (Tastatur, Auswahl Berechnung) !- Etiketten (Horizontal/Quer, Drucken via Serverdatei auf Labeldrucker)



Eigene App‘s? Wofür?

Gibt es nicht für alles bereits eine App - oder eine Web-Site? !• Bedarf nach Hilfsroutinen, individuellen Informationen, Kontrollberechnungen, kunden-/projektspezifisch !• Arbeiten in Gebieten ohne oder mit zu schlechter Netzabdeckung !• Infos erforderlich, wo kein PC (z.B. im Baumarkt) !• Einstelldaten für eine Installation oder eine Messeinrichtung !• Vor Ort Aussagen aufgrund Messergebnisse im ,Feld‘ machen !• Bedarf für ein 'Frontend' für bestimmte Eingaben zu einer

Serverlösung

��12



Eigene App‘s? Wieso?

Früher hatte man • Rechenschieber oder Rechenscheibe • Addiator !dann !• die ersten handlichen Taschenrechner sind auf dem Markt • kurz darauf die ersten programmierbaren Taschenrechner, die

bereits in einem hohen Masse konfektionierte, persönliche Berechnungen ermöglichten - ,auf Abruf‘ (mehrere 100 DM, CHF)

!• Heute sieht dies etwas anders aus. Man hat die Tabellenkalkulation

für Berechnungen aller Art - aber (meist) nicht in ,der Tasche‘ !• In der Tasche hat man das Telefon!

��13



Vom programmierbaren Taschenrechner zu iOS

Mit FileMaker Go

��14



Wieso das Telefon?

• Taschenrechner - in der Tasche! Die Serien der HP (Hewlett-Packard) Taschenrechner, die

heute ,Kult-Status‘ haben, die Texas-Instruments, -> man konnte bereits sehr viele Aufgaben Lösen -> man konnte für sich selbst kleine Rechenabläufe speichern und

abrufen !• Mächtige Hilfsprogramme sind verfügbar auf dem Desktop -

stehen aber 'auf dem Feld' nicht zur Verfügung !• iOS - immer dabei (zumindest das iPhone) !! Zudem ist iOS aus meinem Alltag nicht mehr wegzudenken -

sowohl als iPhone wie auch als iPad

��15



Wieso überhaupt alles in ,der Tasche‘?• Obsidian Ein fantastisches Gerät in der Einstiegs-Sequenz eines

Computerspiels - Notizbuch (Wie findet man Notizen in einem analogen Notizbuch?) - Internet - Informationen - 'Wissen' - Kommunikation - Unterhaltung !• Der Newton !• iOS !!!

��16



Vor FileMaker Go...• Nutzung der XCode-Umgebungen kein Thema (kann ich nicht) • Kein einfaches Übertragen von App‘s auf iPhone • Einschränkungen (iTunes, keine ,fremden‘ iPhones,) !• unzählige App‘s gekauft wie Lua, Python, MobileBasic, • Verschiedene Bücher gekauft • Nichts gefunden, das schnell umsetzbare Programme ermöglicht

hätte - mit einer grafischen Oberfläche !!!Ich habe zum Kontrollieren von Berechnungen in FileMaker-Datenbanken kleine Programme in Lua (iOS) geschrieben: -> mühsam (App‘ in App‘, Zeilenorientiert,)

��17



Fangen wir an!Mit einem einfachen Beispiel !Nein - kein Taschenrechner !-> zu kompliziert für das Referat -> gibt zu Hauf‘ solcher Dinger -> kaum machbar mit einer Datenbank

��18


Vortragender: Markus Schneider, ReM Software GmbH FileMaker Pro (Advanced) als Entwicklungsumgebung für FileMaker Go ��19

oops...



Fangen wir an!Ausgangslage: (Als Beispiel eine möglichst simple Anwendung) !- Wunsch nach kleiner Berechnungsroutine zur Kontrolle einer neuen

FileMaker-Anwendung, die eine ,fremde‘ Buchhaltungs-Software speisen soll und dabei vermeintlich Fehler überträgt

!- Durch anhaltende Anpassungen an der Fibu muss immer wieder

kontrolliert werden. Im Wesentlichen handelt es sich um die Steuerbeträge..

!- Zu Taschenrechnerzeiten wäre das ein kurzes Progrämmchen

gewesen, das auf eine Eingabe die Steuer berechnet !* Nicht zwingend ,Datenbank‘ * * Spassfaktor *

��20



Vor FileMaker Go...

��21

ein kurzes ,Medley‘...









Mit FileMaker Go...

��25

(-:





Schwerpunkt?+ App‘s, kleine Helfer im Alltag (wirklich ,Kleinst-Progrämmchen‘!) + Fokus mehrheitlich auf dem iPhone/iPodTouch + Einfach! - sowohl bezüglich Bedienung wie auch bezüglich

Features + Verzichten! (,Fokus‘ setzen...) + Persönliche App - muss nicht für alle sein, nicht alles können !!- Datenbanken, Datenbanktheorie, Normalformen... - Multiuser - Hochstehende, ausgeklügelte Techniken - Datenerfassung - Synchronisation

��27

Beim Synchronisieren / Sichern mit iTunes werden FileMaker Go Dokumente nicht mitgesichert!



Ziel• Anreiz geben FileMaker Pro und FileMakerGo etwas ,anders‘ einzusetzen !• ,Mein‘ iPhone / iPodTouch / iPad !• Eine ,App‘ im Zusammenspiel mit FileMaker Server !• Erweiterter Einsatz von iOS (mit FileMaker!) !• Übersicht Werkzeuge - das ,Rüstzeug‘ !• Hilfsmittel Vorlagen, ,Sekundärprogramme‘ !• Etwas Spass! ,Gluschtig mache‘, wie man in der Schweiz sagt

��28



Am Anfang ist immer die Idee!• Ideen haben ist relativ einfach, wenn man eine stupide

Rechenaufgabe immer und immer wieder lösen muss und so einen gewissen ,Druck‘ hat - oder wenn man sich z.B. nie merken kann, welche LED-Lampe einer herkömmlichen 60 Watt Glühlampe entspricht...

!• Wo kann mir ein Programm Arbeit abnehmen? !• Bei welcher regelmässigen Tätigkeit hätte ich gerne Dies oder Das?

��29





,Methodik‘• Was will ich !• Grundlagen sicherstellen, beschaffen (,Bekannte‘, ,Unbekannte‘) !• Geht das überhaupt? Kann ich das? !• Projektumgebung erstellen !• Template kopieren (sofern eines vorhanden ist) !• FileMaker Struktur/Funktionen/erste Oberfläche !• Gleich zu Beginn: Dokumentation... (Im Template vorbereitet!)

��31



VorbereitungKontroll-App‘ für unsere Fibu-Schnittstelle !!!!!!!!!!- Am Einfachsten mit einer Formel - Zwei Felder - Vertikales Layout, iPhone ,normal‘ in der Hand

��32



Arbeitsschritte• Backup-Strategie -> zip-Archive! TimeMachine: Macht 'unbestimmte Backups' (Stand?)

!• Arbeiten mit FileMaker Pro / FileMaker Pro Advanced -> über FMNET Kontrolle !• Kopie in Kiosk-Ordner !• Kiosk-User aktivieren !• Entwicklungs-Werkzeuge -> Kiosk-Lösung !• iTunes -> Übertrag auf iOS-Gerät !• Kontrolle

��33





,Entwicklungszyklus‘

��35

FileMaker Pro

FileMaker ProAdvanced

FMNet

Kiosk

iPhone



Layoutgestaltung• Wie viel Platz steht zur Verfügung? !• Auf was muss geachtet werden?

��36



,Schablonen‘

��37

http://help.filemaker.com/app/answers/detail/a_id/10678

iOS Status Bereich: 20 pt

Symbol-Leiste: 44 pt

480

pt

Navigation (FM..): 31 pt

460

pt -

Nut

zbar

bei

m ‘K

iosk

’

320 pt

iPhone 4s (und früher)

429

pt -

Nut

zbar

ohn

e zu

scr

olle

n

385

pt -

Nut

zbar

ohn

e zu

scr

olle

n

3 1/2” Bildschirm



iOS Status Bereich: 20 pt

Symbol-Leiste: 44 pt

568

pt

Navigation (FM..): 31 pt

548

pt -

Nut

zbar

bei

m ‘K

iosk

’

320 pt

iPhone 5 (und später)

517

pt -

Nut

zbar

ohn

e zu

scr

olle

n

473

pt -

Nut

zbar

ohn

e zu

scr

olle

n

4” Bildschirm





Live!

��40

• möglichst rasch ein Resultat !• Template - Design ,Onyx Touch‘ (iOS7 -> 'Klassisch') - Standard-Felder (3 Text-, 3 Zahlenfelder) - ein paar wenige Layouts -> ,Ende‘-Taste! (Kiosk - sonst kein ,Beenden‘) - ein ,Startup-‘ und ein ,Close-Script‘ Startup: Layout, Fensterposition, Zoom100% [fixieren] - sonst Zoom bei ,Doppel-Tap‘ Close: Im Wesentlichen Eintrag ,Release Notes‘ (einfachste Möglichkeit zur Dokumentation)

! - Felder im Layout plazieren, Formel erstellen ! - Tabulator-Folge anpassen, Felder anpassen (gesamter Inhalt..) !-> 0-Version



Notizen zur Demo

��41

• Ordnerstruktur im OS • Template kopieren und allenfalls umbenennen • FileMaker Pro (Advanced - bis auf Kioskmethode auch ohne Advanced) • 1 Zahlenfeld (Eingabe), 1 Zahlenfeld (Steuersatz), 1 Formelfeld (Zahl) • Auf Layout plazieren • Taste mit 'Schliess-Script' (Grundsätzlich... Gewohnheiten können Ärger sparen) • voilà !• Layout 430 Pixel -> scrollen... • Layout 429 Pixel (Kiosk: 460px) -> kein scrollen (-: !



Resumé

��42

Im Hinblick auf die Nutzung der Kiosk-Methode



Demo - Keine 'Beenden'-Taste

��43

• Starten einer Anwendung im Kioskmdus • FileMaker Go beenden (die App ist noch geladen..) • FileMaker Go per 'App-Switcher' endgültig beenden • FileMaker Go neu starten -> Die App ist wieder hier !-> Daher: 'Exit'- Taste! !!!• Wieso 429 Pixel Bildschirmgrösse bei Hochformat? -> scrollen... !



Resumé ❶- Eingaben suboptimal, da per Tastatur (ungewohnt, kein Zahlenblock)

!- Felder mit doppelter Höhe wenn aktiviert !- versehentlicher ,Doppel-Tap‘ vergössert stark (zoom) !- Status-Bereich oben sichtbar... (kann durch ,Wischen‘ ausgeblendet werden) !- Das Resultat wird nicht automatisch eingeblendet !+ Zeitaufwand: +/- die Zeit zum Öffnen, Übertragen (Dank dem Template) !+ Grundsätzliche Funktion OK

��44



Live!• Keine Felder -> $$Variablen (in Layout darstellbar) !• Eigene Tastatur, ein Script für ,Einlesen‘ !• Display simuliert, ,Blur‘ manuell erzeugt !!

��45



Notizen zur Demo• Erzeugen und Anordnen der Tasten (einfach - 'Touch-Design) • Erzeugen der Felder für die Steuersätze (CH: Mehr Sätze..) • Erzeugen der Scripts 'keys' und 'display' • Erzeugen der Textplatzhalter ($$) • Definieren der Tasten mit Scriptparameter • Kontrollen, Korrekturen.. • Feinheiten wie Farbwahl, 'Blur', Ausrichten der Elemente -

'Pixelpush' • Methode 'Inkl/Exkl Steuer' einbauen • Gute Gewohnheiten: 'Release Notes' - einfach und nützlich! • Erzeugen Kioskversion !!

��46



Resumé

��47



Resumé ❷+ Eigene Tastatur !+ Kiosk-Modus -> ,App-Like‘! !+ Benutzerführung angepasst (Klick in Anzeigefeld...) !- Zeitaufwand: Deutlich länger... !- Tastatureingaben nicht schnell (aber nicht schlechter als per iOS-Tastatur) !- NICHT iOS 7

��48



Live!• iOS 7 - ,Flaches Design‘ !• Thema ,Onyx Touch‘ ändern nach ,Klassisch‘ !• Grafische Elemente anpassen (abgeändert bei Thema-Wechsel) !• Einfache Tasten in der Hintergrundfarbe !• Schrift ändern zu ,Helvetica Neue‘ (keine Ultra Thin) !• Felder für Zahlendarstellung anpassen

��49



Resumé

��50



Resumé ❸+ iOS 7 !+ Zeitaufwand: Eher weniger aufwändig als Variante 2 !- Tastatureingaben.. !

��51



Genutzte FileMaker Methoden (,Nur als Beispiel‘, kann völlig anders gelöst werden!) !• Tasten rufen EIN Script auf, Funktion per Scriptparameter !• Keine Datenbankfelder - Nur $$Variablen ( 'Fenster aktualisieren'!) !• Display-Steuerung per ,Tap‘ (Finger-Klick) !!• Zusatzfunktionen (indirekt, Zusatzlayout) - Steuersätze variabel - Endbetrag inklusive/exklusive Steuer

!• Effekte: ,Blur‘ manuell

��52







// Steuer Falls ( TEMPLATE::Betrag3= 1; $$Key - ($$Key / (1+TEMPLATE::MwSt1)); $$Key * TEMPLATE::MwSt1 )

// Betrag Ohne Steuer Falls ( TEMPLATE::Betrag3=1; $$A + $$B + $$C - $$MwSt1 - $$MwSt2 - $$MwSt3; $$A + $$B + $$C )



// Steuer SQLQueryAusführen ( "select Steuersatz from STEUER where Code=?" ; "" ; ""; Hole ( ScriptParameter ) )

// Steuerbetrag Falls ( TEMPLATE::Betrag3= 1; $$Key - ($$Key / (1+$$MwSt)); $$Key * $$MwSt )









Fazit• Aufwand bedingt ein Template! !• Übung macht Meister! !• Spassfaktor !

��60



Tipps• Doppel-Tap 'zoomt' (Zoomstufe setzen, Fixieren) !• Tasten anstelle Eingabefelder, allenfalls Wertelisten !• Eigenes Dialogfeld 'kann scrollen' unter FMGo !• Kiosk! (Keine FileMaker-Elemente sichtbar -> Aussehen einer App) !• Hoch-/Querformat automatisch (Script mit ,Timer‘, Abfrage 'Fensterinhalt..') !• Feld wird grösser beim Aktivieren (Klassisches Thema, Rollbalken, Tasten,) !• 'Blur-Effekt' fehlt (Bei Bedarf selbst erzeugen mit dem Inspektor, klassisches Thema) !• 'Splash-Screen' (sorgt für zusätzlichen Effekt, Start scheint kürzer) !

��61



Unterschiede FileMaker Pro / Go• Keine Plug-Ins !• Keine freie Wahl von Schriften !• Ausrichtung, Anordnung nicht immer identisch !• Diverse Unterschiede in Details ! - Einfügen aufgrund vorhandener Einträge - Unterschiedliches Verhalten beim Klick in ein Feld (Feldhöhe) - uepm (und ein paar mehr)...

��62



Schriften• unter iOS können nicht beliebige Schriften genutzt werden! !-> Weitere Hinweise in der FileMaker Go Development Guide

��63





Schriften, nochmals... Auch Schriften, die nicht im FileMaker Go Development Guide

aufgeführt sind, sind möglich (-> iOS Guides). Meist problemlos. Helvetica Neue Ultra Thin geht nicht... ! Einer meiner Lieblingsfonts für iOS: Avenir Next (-: ! Listen erhältlich z.B. unter !• http://www.ios6-fonts.com • http://iosfonts.com • http://support.apple.com/kb/HT5484?viewlocale=en_US&locale=en_US

��65



Übertragung auf das iPhone• iTunes (Standard) !• WebSharing (Nicht mehr ,integriert‘ seit OSX 10.8.x, Windows: Hilfsprogramme) !• Mail (Umständlicher, aber solide) !• DropBox (gezippt: Via GoodReader oder andere Programme) Achtung: Dropbox ist nicht unbedingt ,der‘ Ablageort (Versionen, 'Multiuser'...) !• Weitere

��66



iTunes!• iTunes Starten !• iOS-Gerät per WLAN oder USB-Kabel ,anhängen‘ !• iOS-Gerät in iTunes auswählen ❶ !

• Unter App‘s FileMaker Go wählen ❷❸ !

• rechts im iTunes-Fenster sind die FMGo App's sichtbar ❹ !• per Drag&Drop oder per 'Hinzufügen' !!-> Drag & Drop (Hin- und Zurück!) -> Löschen mittels ,Delete-Taste‘

��67





Das fehlende ,bit‘• Was haben wir? -> ein kleine App, die uns Rechenarbeit abnimmt !• eine App?? -> Wie wird diese denn gestartet?? !!!

-> Ein kleines icon, das per ,Tap‘ unsere App‘ startet!

��69



Auswahl der FileMaker Go Dateien

��70

Ohne icons -> sehr schnell unübersichtlich



Geordnet - mit icons

��71



Eigene App‘-Symbole erzeugen!• Um eigene Icons/Symbole zu erzeugen, mit deren Hilfe eine FMGo-

App auch per ,Tap‘ gestartet werden kann, benötigt man Hilfsprogramme

!!• AppMaker (FileMaker) https://fmdev.filemaker.com/docs/DOC-2654 (Mitgliedschaft erforderlich) !• Apple Configurator !• GoWrap http://apps.gowrap.net

��72

Neue Version 1.04



Eigene App‘-Symbole erzeugenAlle Programme / Methoden nutzen sogenannte ,web-clip‘s‘. !-> Unter OSX kann die zugrunde liegende URL auch in der Adresszeile des Browsers eingetippt werden - und auf den Schreibtisch gezogen werden. Man erhält so einen ,Starter‘! !-> Unter iOS funktioniert diese Methode mit Drag&Drop nicht, daher die Hilfsprogramme !Beispiele: OSX fmp://192.168.1.1/MeineFMDatei iOS fmp://~/filename.fmp12 !!http://help.filemaker.com/app/answers/detail/a_id/11033/~/how-to-create-an-icon-on-the-home-screen-of-your-ios-device-that-can-directly

��73



AppMaker

��74

1.04



Mail (iPhone)

��75



Profil installieren

��76



Profil installiert!

��77



Icon im ,Home‘

��78



GoWrap http://apps.gowrap.net/

��79



GoWrap - Email

��80

• Auf iOS -> in Safari exportieren ,Zum Home-Bildschirm‘



Eigene App‘-Symbole (icons)!!• Mehrere App‘s in einem Profile zusammenfassen * !!• Profil kann jederzeit neu erzeugt/übertragen/installiert werden !!• Auch für eine einzelne darin enthaltene App !!* GoWrap: Pro App‘ ein 'Durchgang' (web-clip)

��81



,PP‘ - Profil-Probleme!• iOS7: Probleme, wenn Datenbank ,Remote‘ genutzt wird !!• iOS7: Multitasking -> App erscheinen nicht (OK unter iOS6) !!• GoWrap: Benötigt Internetverbindung, telefoniert ,nach Hause‘ !!• Apple Configurator - iOS7: Für ,Nur-FileMaker-Entwickler‘ ein NoGo!

��82



Erzeugen der Symbole (Grafiken)Bildbearbeitungsprogramm !• Acorn !• Pixelmator !• Gimp !• Photoshop !• unzählige weitere...

��83



Vorlagen für Symbole (Grafiken)Profis werden diese selbst von Grund auf gestalten !• http://appicontemplate.com !• http://www.pixelstrol.ch/blog/2012/12/generiere-im-handumdrehen-ein-ios-app-icon-in-allen-formaten/

!• http://www.iphoneblog.de/2013/09/08/app-icons-unter-ios-7/ !• http://piotr.soluch.com/blog/3d-ios-icons-psd-freebie/ !• unzählige weitere... (google is Your friend)

��84



,potholes‘ FileMaker Go• Datenverlust! Achtung bei Nutzung einer FMGo Anwendung zur Dateneingabe

wie beispielsweise Notizen, Pendenzenlisten, -> Ungespeicherte Eingaben (,Maus‘ im Feld!) können verloren gehen !-> Unter FileMaker auf den Desktops ist uns dieses Verhalten ja klar,

aber beim mobilen Arbeiten mit iOS ist es etwas unerwartet.. !!• Synchronisation! Bei der Sicherung/Synchronisation werden FileMakerGo

Datenbanken/-App‘s NICHT übertragen -> Regelmässig per iTunes sichern oder Backup-Script -> Eigene Synchronisations-Scripts erstellen -> Eigenes Script, das die App‘ als Kopie per Mail überträgt

��85



,potholes‘ FileMaker Go cont.

• Updates! Läuft nach dem update noch alles wie zuvor? ! Bei iOS Updates ist etwas Gelassenheit gefragt - erst aktualisieren,

wenn man (z.B. im Forum des FileMaker-Magazins oder in den FileMaker-Foren) kurz nachgefragt hat

!-> für uns ,Normalanwendende‘ ist das Einspielen einer älteren iOS-

Version nicht so einfach machbar !! FileMakerGo Updates testen - VOR einer Sicherung... !-> So kann im ,Falle dass‘ die Version auf dem iOS-Gerät gelöscht

werden und über iTunes die Vorversion wieder geladen werden (Daten natürlich immer sichern!) !

��86



Sicherung! An sich ist es sehr einfach, eine Sicherung der FileMaker Go

Datenbank oder der FileMaker Go App‘ zu erstellen ! Obwohl nicht Thema dieses Referates...

��87



Hilfsmittel• FileMaker Pro Advanced !• Eigene Kurzbefehle (Systemeinstellungen OSX!) !• Text-Editor (nicht TextEdit, nicht Word...) !• Typinator (Vordefinierter Befehlssatz, Kurzbefehle) !• ClipManager (FileMaker Objekte Kopieren, Speichern) !• DefaultFolder (,behält Ordner‘, Wählen per Mausklick) !• Clipboard-Manager (z.B. CopyLess)

��88



D A N K E• Fragen !• Anmerkungen !• Diskussion

��89



Vielen Dank unseren Sponsoren

Danke für das Bewerten dieses Vortrages

��90

Date post:	05-Dec-2014
Category:	Documents
Upload:	verein-fm-konferenz
View:	2,638 times
Download:	3 times

FMK 2013, Eigene Apps für iOS mit FileMaker Go, Markus Schneider

Documents