Objective-C und das Cocoa-Framework/ Cocoa/ Xcode und Interface Builder
Aus Wikibooks
Inhaltsverzeichnis |
[Bearbeiten] !Baustelle!
Bevor wir uns den ersten Lektionen in Objective-C zuwenden, werden wir die Möglichkeiten von Xcode und dem Interface Builder ausschöpfen. Wir schreiben also weiterhin keine einzige Zeile Code, auch wenn wir damit bald an unsere Grenzen stoßen werden. Wir betrachten beide Programme zunächst genauer.
[Bearbeiten] Cocoa
[Bearbeiten] Xcode
Wir wenden uns wieder unserem Programm "HalloWelt" zu. Falls es erneut geöffnet werden muss kann man dies erreichen, indem man "File" -> "Open" wählt und anschließend "HalloWelt.xcodeproj" wählt. Zunächst öffnen wir die Einstellungen von Xcode durch "Xcode" -> "Preferences..." in der Apple-Leiste. Dort ändern wir das Layout auf "All-in-one". Den Rest lassen wir wie er ist und bestätigen mit "ok". Diese Ansicht von Xcode wird von vielen Programmierern bevorzugt, da sie einen größeren Überblick ermöglicht.
Betrachten wir nun die Titelleiste von Xcode. "Page" regelt die verschiedenen Ansichten von Xcode, von denen uns zur Zeit nur die Interessiert, die bereits eingerastet ist. "Overview" ermöglicht es uns, dem Compiler zu sagen, wie genau er unser Programm kompilieren soll. Soll es nur für 10.6/Snow Leopard oder auch für 10.5/Leopard getestet werden? Ist das Programm für Intel oder PowerPC? und ebenfalls wichtig: Release oder Debug? Release bedeutet, dass man mit dem Programm fertig ist und es weitergeben möchte. Debug, dass man im Moment nur für sich selbst testet. Der Debug-modus ermöglicht ein leichteres Nachvollziehen von Fehlern, ist aber dafür ungeeignet auf anderen Rechnern ausgeführt zu werden.
"Tasks" erlaubt das Abwürgen unseres Programms, falls wir einmal einen Fehler gemacht haben, der es zum Einfrieren gebracht hat.
Der Bereich "Groups & Files" auf der linken Seite zeigt alle Dateien, die in irgend einer Weise mit dem Projekt verbunden sind. Vor allem der Inhalt der Rubrik "HalloWelt" mit den Unterrubriken "Classes", "Other Sources", "Resources", "Frameworks" und "Products" interessiert uns im Moment, genauer gesagt nur der Inhalt der Ordner Classes und Resources.
Im Ordner Classes legen wir später alle unsere selbst geschriebenen Klassen ab und im Ordner Resources befindet sich all die Dateien, die eigentlich nichts mit Objective-C zu tun haben, aber trotzdem zum Projekt gehören, wie zum Beispiel Bilder oder auch unsere Interface-Datei. Nehmen wir den Ordner Resources genauer unter die Lupe finden wir die Datei Info.plist, die einige allgemeine Eigenschaften des Programms festhält.
Wählen wir sie aus, erhalten wir rechts unten in Xcode eine Auflistung dieser Eigenschaften. Uns interessieren die Einträge "Localization native development region" und "Icon file". Den ersten Eintrag setzen wir auf "Germany" und in den zweiten schreiben wir "app.icns".
Wir öffnen nun das Programm Icon Composer im Ordner Utilities. Wir brauchen nun natürlich schon ein nettes Bild für unser Programmicon. Wer keines zur Hand hat kann nach einem suchen, zum Beispiel auf den Seiten CrystalXP.net oder Gnome-Look.org.
Haben wir ein gutes Bild gefunden, müssen wir es noch mit irgend einem Programm auf die Größe 512x512 Pixel vergrößern und anschließend in den Icon Composer ziehen. Wir wählen den Eintrag "Copy to all smaller sizes" und bestätigen.
Jetzt speichern wir das ganze unter dem Namen "app" in unseren Projektordner, beenden den Icon Composer, öffnen unseren Projektordner im Finder und ziehen die Datei "app" in den Ordner Resources in Xcode. Die angezeigten Optionen ändern wir nicht und bestätigen. Jetzt können wir unser Programm mit "Build and go" starten und uns an dem neuen Icon im Dock erfreuen.
[Bearbeiten] Interface Builder
Im Ordner Resources befindet sich eine weitere interessante Datei namens "MainMenu.xib". Ein Doppelklick darauf Öffnet uns den Interface Builder. Es müssten sich nun 3 neue Fenster geöffnet haben. Einmal unsere leere Vorlage, dann das Menü unseres Programms und dann noch ein Fenster mit der Überschrift "MainMenu.xip (English)". Das reicht uns aber noch nicht, denn wir benötigen noch zwei weitere Fenster: Die Library und den Inspector, die wir beide durch das Menü "Tools" in der Apple-Leiste öffnen können.
Das Fenster MainMenu.xip (English) zeigt uns alle Objekte, die die xip-Datei enthält. Wir finden dort auch unser Menü und unser leeres Fenster wider.
In der Library finden wir all das, was wir in unser Fenster und Menü hineinstopfen können, unsere Steuerelemente. Selbst neue Fenster können wir von diesem Fenster aus in unsere Vorlage einbinden. Alles funktioniert mit normalem Drag and Drop. Betrachten wir den obersten Teil dieses Fensters, sehen wir, dass es 2 Reiter hat, von dem bisher nur "objects" ausgewählt ist. Der Zweite Punkt "Media" beinhaltet im Gegensatz zu den Steuerelementen nur externe Objekte wie Bilder oder Musikstücke, die wir vielleicht auch mit einbinden wollen.
Der Inspektor ermöglicht es uns einige Eigenschaften der von uns im Fenster platzierten Steuerelemente zu verändern, wie zum Beispiel das Ausdehnungs- oder Verankerungsverhalten. Eigenschaften, die wirklich das Steuerelement selbst massiv betreffen, wie zum Beispiel seine Farbe, regelt man dagegen größtenteils und sehr effizient indem man Unterklassen der Steuerelemente schreibt, also das Aussehen mit Code beeinflusst. Dazu später mehr.
Wir nehmen uns jetzt die Library vor und suchen das Steuerelement "Toolbar" heraus. Wir ziehen es in die Nähe der Titelleiste unsere Fensters, so dass sich in unserem Fenster die Titelleiste erweitert und sich die Auswahlfelder "Colors", "Fonts", "Print" und "Customize" hinzufügen. Jetzt suchen wir das Steuerelement "Text View" und lassen es in unser Fenster fallen. Nun das Text View vollständig an das Fenster anpassen und darauf achten, dass es auch ausgewählt ist, da wir es nun im Inspector betrachten möchten. Im Inspektor wählen wir den Reister mit dem gelben Lineal aus und sehen unter der Überschrift "Autosizing" ein Schema des Verhaltens unserers Text Views innerhalb des Fensters. in dem Kästchen mit den vielen Pfeilen auf der linken Seite können wir per Mausklick das Verhalten verändern. Wir wollen, dass sich unser Text View beim Vergrößern oder Verkleinern des Fensters in seiner Größe weiterhin an das Fenster anschmiegt. Haben wir das erledigt, speichern wir unsere Vorlage [(cmd + S) bzw. (Apfel + S)].
Jetzt kehren wir zu Xcode zurück und Starten unser Projekt. Wenn alles richtig gemacht wurde, haben wir jetzt einen kleinen Texteditor, mit dem wir zwar weder drucken, noch Texte speichern können, der aber dennoch interessante Textfunktionen bietet, wie das Verstellen der Schriftart und der Schriftfarbe.
[Bearbeiten] Cocoa Touch
[Bearbeiten] Xcode
Hier fällt gleich auf, dass wir 2 neue Dateien haben, die uns bei unserem OS X-Beispiel noch nicht begegnet sind. Diese beiden Dateien sind später dazu da um direkt per Code an unserem Fenster herumzuspielen. Da ein iPhone-Programm immer ein Fenster hat, das angezeigt wird, ein OS X-Programm aber nicht unbedingt, erstellt XCode diese Dateien von vornherein für uns. Bei unserem OS X-Programm müssen wir diese später selbst noch erstellen.
Das Icon für unser iPhone-Programm muss hier ebenfalls auf eine andere Weise angelegt werden. Wir benötigen keine spezielle Icon-Datei, sondern bloß irgendein PNG-Bild, das wir icon.png nennen und in unseren Resources-Ordner ziehen. jetzt geben wir noch in der Info.plist unter Icon file den Dateinamen unseres Bildes ein (icon.png), damit Xcode auch weiß, dass dies das Bild für unser Programm sein soll, und testen unser Projekt. Es ist wichtig zu wissen, dass man sich beim Programmieren grundsätzlich um jede Kleinigkeit kümmern muss. Der Compiler (Das Programm, das kompiliert, also die Programmiersprache in Systemsprache übersetzt. Es wird ganz unsichtbar von Xcode aufgerufen, wenn man sein Programm testen will und beendet, wenn die Übersetzung abgeschlossen ist.) rät nicht, was man von ihm wollen könnte, alles muss explizit und korrekt angegeben werden. Xcode ist so einfach zu bedienen, weil die Programmierer von Xcode sich die Mühe gemacht haben uns so viel Mühe wie Möglich abzunehmen, aber ab diesem Punkt müssen wir eben die Regeln des Compilers berücksichtigen.
[Bearbeiten] Interface Builder
Ein Doppelklick auf die Datei MainWindow.xib im Resources-Ordner in Xcode bringt uns wieder in den Interface Builder. Im Grunde ist auch hier alles wie in unserem OS X-Programm. Dieses Mal klicken wir bloß auf unser Fenster und schauen uns den Inpector, Bereich Attributes an. Dort ändern wir die Hintergrundfarbe unseres Programmes in Schwarz. Jetzt kommt die Library an die Reihe. Wir suchen uns eine "Navigation Bar" heraus und platzieren sie ganz oben in unserem Fenster. Jetzt verändern wir bei ihr im Inspector den Punkt "Status Bar" in "Translucent Black". Nun noch ein Doppelklick auf die neue Leiste und wir können ihren Anzeigenamen in "Hallo Welt" ändern. Um die Größe des Steuerelements müssen wir uns hier nicht kümmern, da das iPhone ja grundsätzlich nur eine Fenstergröße kennt. Zum Abschluss suchen wir uns noch ein "Text View" heraus und platzieren es so, dass es das ganze Fenster einnimmt. Im Inspector ändern wir seine Textfarbe in Weiß, stellen sicher, dass es "Editable" ist, und bestimmen eine mittige Textausrichtung. Nun noch ein Doppelklick auf den Text und einmal alles löschen, so dass nur ein schwarzer Bildschirm übrig bleibt.
Das wars! Testen wir das Projekt, dann können wir ganz iPhone-typisch etwas in das Text View schreiben, auch wenn wir die Tastatur nicht mehr ausgeblendet bekommen, das ist nämlich ohne Code nicht möglich.
Damit haben wir den leichten ersten Teil dieses Buches hinter uns, denn jetzt kommen wir ohne Code nicht mehr weiter.
Nächstes Kapitel - Variablen und Funktionen
