Apps... Wie macht man sowas? | iOS
21.07.2016
4 minute read

Endlich ein App-Post für iOS!

Zurück zur Übersicht >>


Diese Post-Serie entstand für das Forum “elitepvpers”.
Einen Backlink zum zugehörigen Thread findest du hier


1. Vorbereitung

Um Apps für iOS zu entwickeln benötigt ihr leider zwingend einen Mac. (Hackintosh sollte auch funktionieren. Allerdings kann ich euch da nicht mit Problemen helfen).

Fast wie bei Android ist der Start unfassbar einfach.

2. Installation

Öffnet den App Store und sucht nach XCode. Dann installiert die App. Die weitere Einrichtung ist selbsterklärend. Solltet ihr dennoch Probleme haben gibt es haufenweise Hilfen im Internet.

3. Projekt erstellen

Klickt im “Splashscreen” auf Create a new XCode project und wählt dann die Single View iOS Application

Gebt nun einen Namen ein und eine umgedrehte Domain. Diese wird als Präfix für eure Apps benutzt und muss eindeutig sein. Als Sprache nehmen wir Objective-C. Eigentlich wäre es gut hier Swift vorzustellen, aber da ich mit dieser Sprache noch nicht genug Erfahrung habe muss ich einen Post dazu wohl nachreichen.

Als Device wird ein iPhone festgelegt. Responsive Apps sind wieder ein Thema für sich und haben hier noch nichts zu suchen.

Auf dem letzten Screen werdet ihr noch aufgefordert einen Speicherort anzugeben. Ob ihr GIT (Versionskontrolle) aktiviert oder nicht bleibt euch überlassen und hängt vor allem davon ab ob ihr bereits erfahrung damit habt oder nicht.

GIT zu erklären würde leider den Rahmen dieses Posts sprengen. Falls sich genug Leute finden die Interesse haben werde ich allerdings gerne etwas darüber erzählen.

Weiter gehts. Klickt oben links in der Dateiliste auf euer Projekt um die Projekteinstellungen zu verwalten.

Stellt sicher, dass eure App nur Portrait als Orientation zulässt.

4. Design

Öffnet euer LaunchScreen.storyboard. Dies ist der SplashScreen den iOS vor dem Start der eigentlichen App anzeigt. Hier kann man ein Logo oder Text einfügen oder evtl einen Ladebalken.

Wir werden den SplashScreen simpel halten und einfach nur den Namen der App anzeigen.

Sucht unten Rechts im Designer nach Label.

Das zieht ihr dann einfach in die App bis es in der Mitte einrastet oder sich an einer Position befindet die euch gefällt.

Das Label bearbeitet ihr mit einem Doppelklick. Wenn ihr es einmal anklickt könnt ihr rechts mit der Formatierung spielen.

Wenn ihr fertig seid könnte das z.B. so aussehen:

Damit das Label trotz verschiedener Displaygrößen an der selben Position steht müssen wir dem Label noch Constraints hinzufügen. Zieht dazu mit gedrückter CTRL-Taste eine Verbindung zwischen eurem Label und dem View. Dann klickt auf center.

Wechseln wir nun zur Main.storyboard Datei. Sucht unten rechts nach “web” und zieht die Web View in die Mitte.

Zieht sie nun auf die volle Größe. Achtet aber darauf oben die Statusleiste auszusparen weil diese sonst über Facebook “fliegt”.

Zum Schluss klickt ihr die WebView an um sie auszuwählen und klickt unten rechts auf Add Missing Constraints. (Der Button ist das Dreieck zwischen den zwei Strichen).

5. Programmierung

Wechselt oben rechts in den Assisted-Editor Modus.

Zieht nun mit gedrückter CTRL-Taste eure WebView in das @interface. Gebt als Name webView ein und schon generiert XCode euch ein @property mit dem wir arbeiten können.

Das sieht in etwa so aus:

Wechselt nun zurück in den Standard-Modus:

Öffnet eure ViewController.m Datei und schon geht’s los mit dem Programmieren.

Schreibt in die - (void)viewDidLoad Methode folgenden Code:

- (void)viewDidLoad {
    [super viewDidLoad];

    // WebView Content auf die Bildschirmgröße anpassen
    _webView.scalesPageToFit = YES;

    // URL festlegen
    NSURL *url = [NSURL URLWithString:@"https://m.facebook.com"];
    NSURLRequest *urlRequest = [NSURLRequest requestWithURL:url];

    // URL laden
    [_webView loadRequest:urlRequest];
}

6. TESTEN \o/

Wählt oben in der Liste ein Gerät aus das Simuliert werden soll. Dann klickt auf den “Play”-Button.

Sobald die App startet sollte das Ganze etwa so aussehen:

7. Deployment?

Anders als Google verlangt Apple für einen Dev-Account $99 pro Jahr. Daher kann ich euch den Deployment-Prozess leider nicht zeigen.

Dieser ist allerdings gut dokumentiert und sollte für jeden der es bis hier her geschafft hat keine Hürde darstellen.


If you like when I write words, you can fund future blogging (and other cool things) by throwing some spare money into my dev-fund.
It's very much appreciated.



comments powered by Disqus