Swift UI

Änderungen unter der Haube lassen sich nicht so einfach beispielhaft darstellen, deshalb greifen wir uns diesmal die besonders bildlichen Neuerungen heraus. Fangen wir mit Xcode an.

Beim ersten Start kann man nun entscheiden, ob man die zusätzlichen Entwickler-Plattformen Apple TV und Apple Watch überhaupt benötigt. Das spart Download-Zeit

Endlich kann man bei der Installation entscheiden, ob man bestimmte Simulatoren und Plattformen gar nicht braucht. Beispielsweise fürs Apple TV oder für die Apple Watch. Das spart unzählige Daten beim Download. Xcode 13 brachte zum Schluss über 12 GB auf die Waage, in einem einzigen Download! Ohne die genannten Simulatoren sind es bei Xcode 14 „nur“ noch etwas mehr als 7 GB. Immer noch sehr viel, wenn man jedoch bedenkt, dass man bei jeder neuen Xcode-Version die gesamte Installation komplett neu herunterladen muss, spart das nun viel Zeit. Allerdings sollte Apple Xcode in der Zukunft noch granularer gestalten und es dem Entwickler schon beim Download überlassen, welche Frameworks und Tools er benutzen will.

Bessere Unterstützung für Multiplattform-Apps

Prima: Apple hat die Unterstützung für Multiplattform-Apps verbessert. Es wird nun deutlich einfacher aus einem einzigen Quellcode Apps für iOS, macOS, tvOS oder watchOS zu erzeugen. Bislang musste man dazu verschiedene Targets anlegen und jedes einzelne separat behandeln. Ab Xcode 14 kann man das in einem einzigen Target erledigen. Dazu gibt es gleich beim Erzeugen eines Projects ein Multiplattform-Template, das bereits für mehrere Plattformen vorbereitetet ist. Das erspart jede Menge doppelte Arbeit und verhindert so manches graue Entwickler-Haar, wenn man mal wieder vergeblich versucht, Funktion aus iOS-SDK (AppKit) unter dem Mac-SDK (UIKit) zu nutzen.

Endlich: App-Icons automatisch erzeugen

Nur noch ein Bild für alle Icon-Größen benötigt.

Zumindest für iOS atmen Entwickler nun auf. Bislang musste man fürs iPhone und iPad knapp 20 verschiedene Icon-Versionen für das App-Icon separat erzeugen und ins Projekt einbinden. Mit der Option „Single Size“ reicht es nun, ein einziges Bild mit 1024×1024 Pixeln hochzuladen. Xcode erzeugt alle anderen Formate daraus automatisch. Das wurde wirklich Zeit!

Klebende Funktionsnamen

Beim Scrollen nach unten bleiben Funktionsnamen nun am oberen Rand des Fensters stehen. Das erleichtert die Navigation im Code.

Eine Erleichterung beim Zurechtfinden in Funktionen mit viel Code sind die sogenannten „Sticky Scopes“. Scrollt man in einer langen Funktion nach unten, bleiben die Funktionsnamen ganz oben im Fenster stehen, man weiß also immer, in welcher Funktion man sich gerade befindet. Ferner hat Apple auch die Code-Completion in Xcode verbessert und viele weitere kleine Optimierungen vorgenommen. Unser Tipp: Ausprobieren und auf Entdeckungsreise gehen. Das macht am meisten Spaß!

SwiftUI 4

Kommen wir jetzt zu den richtig spannenden Erweiterungen. Es geht um SwiftUI, Apples deklaratives Framework, um App-Bedienoberflächen per Code zu erzeugen.

Diagramme lassen sich nun ganz leicht in SwiftUI erzeugen

Eine unerwartete, aber höchst willkommene Neuerung stellt „Charts“ dar. Damit kann man Diagramme direkt in die Oberfläche einer App einbauen. Ob horizontale oder vertikale Balken, Linien oder Punkte, mit dem neuen Framework werden solche Darstellungen quasi zum Kinderspiel.

Wir haben eine Beispiel-App programmiert, die die Grundfunktionen des Charts-Frameworks demonstriert. Wir wollen dazu die Anzahl der WM-Tore visualisieren, die in den Fußballweltmeisterschaften von 1990 bis 2018 geschossen wurden. Uns interessieren die Gesamtzahl der Tore aus allen Spielen, die Tore der deutschen Nationalelf und die der englischen Mannschaft.

Nur sieben Zeilen Code generieren ein professionelles Liniendiagramm, das die Zahlen visualisiert, inklusive Legende. Die Recherche und Aufbereitung der Daten hat deutlich mehr Zeit in Anspruch genommen, als die eigentliche Programmierung der Diagramme.

Unser Beispiel-Code enthält auch ein Balkendiagramm, das man durch Ändern einer einzigen Zeile bekommt.

Kurze Info: sämtliche hier gezeigten Code-Beispiele finden Sie in einem XCode-Workspace-Repository auf Github .

Bottom Sheets

Die neuen Bottom-Sheets lassen sich von unten in den Bildschirm hineinschieben. Praktisch, um kurze Informationen einzublenden.

Ein ebenfalls lange gewünschtes Feature sind sogenannte Bottom-Sheets. Das sind Views, die sich von unten in den Bildschirm hineinschieben und sich per Swipe jederzeit wieder nach unten rausschieben lassen. Das gibt es nun in SwiftUI 4! Ein Bottom-Sheet lässt sich beispielsweise als Modifier „.sheet“ an einen Button anhängen. Klickt man den Knopf, schiebt sich das Bottom-Sheet von unten in den Bildschirm. Man kann bestimmen, wie viel Platz es einnehmen soll. Im Beispiel sind es 10 Prozent (0.1) und gleichzeitig 80 Prozent (0.8). Damit erscheint es zunächst klein, man kann es aber manuell weiter auf 80 Prozent der Bildschirmhöhe aufziehen.

Hier ist allerdings Vorsicht geboten, denn dreht man das Gerät in den Landscape-Modus, nimmt das Bottom-Sheet immer den gesamten Bildschirm ein und es lässt sich nicht mehr nach unten hinausschieben. Das ist offensichtlich noch ein Bug in der Beta.

Interessant: Wenn man das Sheet manuell wieder hinausschiebt, ändert sich auch der Wert der boolschen State-Variable (im Beispiel „showInfo“) automatisch zu "false". Darum muss man sich nicht selbst kümmern! Sehr nett!

Multidate Picker zum Auswählen von mehreren Datumsangaben

Mit dem neuen MultidatePicker lassen sich mehrere Termine auf einmal im Kalender auswählen.

Manchmal muss man mehrere Termine in einem Kalender auswählen. Das geht nun mit dem Multidate-Picker. Der Vorteil: Das System sorgt selbst dafür, dass man keinen Termin auswählen kann, den es gar nicht gibt, beispielsweise den 30. Februar.

Im Beispiel zeigt ein Text unterhalb des Kalenders alle ausgewählten Termine an.

Variable Icons mit SF-Symbols 4

Mit SF-Symbols 4 gibt es nun variable Icons, um verschiedene Zustände zu visualisieren, wie man es beispielsweise von der WLAN-Feldstärke her kennt.

Diese neue Funktion spart ebenfalls viel Zeit. In SF-Symbols 4 sind inzwischen variable Icons enthalten, die verschiedene Zustände annehmen können. Jeder kennt sicher das Icon für die WLAN-Feldstärke. Anstatt das Icon je nach Wert mühsam manuell auszutauschen, kann man nun den fraglichen Wert direkt in die Definition des Icons eintragen. Ändert sich der Wert, ändert sich das Icon automatisch mit. Toll! In unserem Beispiel kann man den Wert manuell mit einem Slider zwischen 0 und 100 Prozent einstellen. Probieren Sie es aus.

Farben und Textstyles animieren!

Auch Schriftparameter wie Größe oder Farbe lassen sich nun animieren.

Das war lange überfällig. Swift und SwiftUI bieten jede Menge Möglichkeiten für Animationen im UI. Ausgespart davon waren allerdings bislang jegliche Schriftparameter. Das ändert sich jetzt. Mit SwiftUI 4 lassen sich Parameter wie Schriftdicke oder Schriftfarbe animieren. Im Beispiel schalten wir einen Text vom dünnsten Schriftschnitt in den dicksten Schriftschnitt um. Ein zweiter Text ändert gleichzeitig seine Farbe von Blau nach Gelb. Bei verschiedenen Schriftfamilien funktioniert das aber nicht mehr gut. Es wird dann eine einfache Überblendung vorgenommen. Man sollte bei der Schriftanimation also innerhalb einer Schriftfamilie bleiben.

Any Layout

Mit der Funktion „AnyLayout“ kann SwiftUI Interface-Elemente nun je nach Bildschirmgröße und Ausrichtung automatisch horizontal oder vertikal anordnen.

Automatisches UI-Layout, je nachdem wie viel Platz auf dem Bildschirm ist, davon träumt jeder Entwickler. In den letzten Jahren wurden da Fortschritte gemacht, nun kommt eine weitere Funktion hinzu: „AnyLayout“. Damit kann man ein Layout definieren, das UI-Elemente zum Beispiel in Abhängigkeit von der SizeClass des Gerätes (iPhone oder iPad, Landscape- oder Porträt-Modus) entweder horizontal oder vertikal anordnet. In unserem Beispiel fragen wir ab, ob die SizeClass „.regular“ ist. Das trifft auf alle iPads (egal ob horizontal oder vertikal gehalten) zu und für die meisten iPhones, wenn sie quer gehalten werden. In diesem Fall bleiben die insgesamt acht SF-Symbol-Icons in horizontaler Anordnung, da dafür genug Platz ist. Dreht man ein iPhone jedoch in den Porträt-Modus, werden die Icons automatisch vertikal angeordnet, da sich die SizeClass dann in „.compact“ ändert und in der Breite zu wenig Platz für alle Icons wäre.

Farbverläufe und Schatten

Mit den neuen Modifiern „.gradient“ und „.shadow“ lassen sich grafische Elemente mit Farbverläufen und Schatten versehen.

Zum Schluss noch zwei Schmankerl für Ästheten. Man kann nun beliebige Formen wie Rechtecke, Kreise etc. direkt mit Farbverläufen füllen oder mit Schatten (auch nach innen) versehen. Unsere Beispiel-App stellt dazu drei Reihen mit jeweils acht Kreisen dar. Die erste Reihe ist mit leichten Farbverläufen gefüllt, was die Objekte gleich lebendiger erscheinen lässt. Die mittlere Reihe ist zusätzlich mit einem leichten Schatten nach außen versehen. Die linke Reihe kommt ohne Verlauf, dafür mit einem Schatten, der nach innen fällt. Hierdurch sehen die Kreise schon fast wie 3D-Kugeln aus. Das Ganze funktioniert durch die neuen Modifier „.gradient“ und „.shadow“, die man direkt an eine Farbe hängen kann.

Beispiele selbst compilieren

Damit Sie unsere Beispielprogramme selber compilieren und ausführen können, laden Sie das komplette Archiv am besten als ZIP von Github herunter . Jedes Beispiel ist ein eigenes Xcode-Projekt. Achtung: Die Beispiele verlangen Xcode 14, das derzeit nur unter der Betaversion von macOS 13 Ventura läuft. iOS-Geräte müssen zudem mit der Betaversion von iOS 16 ausgestattet sein. Viel Spaß beim Ausprobieren!