Die List in Swift UI - Teil 1 - Eine einfache Liste


List ist eines der wichtigsten Steuerelemente in SwiftUI, denn kaum eine Anwendung kommt ohne sie aus. Auf der iOS-Plattform ist es oft unumgänglich, Daten in Listen anzuzeigen, denn der kleine Bildschirm ermöglich oft keine andere sinnvolle Darstellung. Aus der List kann dann oft zu einer Detailansicht der ausgewählten Daten navigiert werden. Gute Beispiele für diese Vorgehensweise sind die Optionen von iOS oder die eMail-App auf dem iPhone.

Definiert wird eine List wenig überraschend mit dem Bezeichner List, gefolgt von einem Block aus geschweiften Klammer. In den Klammern befindet sich der Inhalt der List, also die Elemente, die als Liste angezeigt werden sollen. Wenn es ganz einfach sein soll, genügt eine ForEach-Schleife, mit der ein Bereich von Zahlen durchlaufen wird. So wie es das folgende Listing zeigt.

import SwiftUI


struct ContentViewView {

       

   var body: some View {

       

       List{

           ForEach (1...10, id: \.self) { number in

               Text("\(number)").font(.headline)

           }

       }

    }

}

Stacks Image 195

Es sollte erwähnt werden, dass in SwiftUI nur eine ForEach-Schleife verwendet werden kann. Die For-Schleife steht dort nicht zur Verfügung. Das wird auch daran liegen, dass die Elemente in der List eindeutig identifizierbar sein müssen. Das geschieht im gezeigten Beispiel mit id: \.self. Zur Identifizierung dient die Zahl selbst. Das funktioniert problemlos, solange alle Zahlen unterschiedlich sind.

Der Inhalt der List muss nicht zwangsläufig mit einer Schleife generiert werden. Statische Elemente, die direkt im Code hinterlegt werden, sind ebenfalls möglich. Es funktioniert sogar, beide Arten zu mischen. Das folgende Listing zeigt eine List mit den Namen von Städten. Zwei Namen sind direkt im Code hinterlegt. Die anderen Listenelemente werden mit einer ForEach-Schleife generiert, die ihre Daten aus einem Array bezieht. Auf der grafischen Oberfläche ist kein Unterschied zu erkennen.

import SwiftUI


struct ContentViewView {

  

    var cities = ["London""Berlin""Tokyo""Amsterdam""Paris""Rom" ]

        

    var body: some View {

   

        List{

            Text("Madrid")

                .font(.headline)

            

            Text("Buenos Aires")

                .font(.headline)

            

            ForEach (cities, id: \.self) { city in

                Text("\(city)").font(.headline)

            }

        }

    }

}

Stacks Image 199

Geschrieben am: 05.07.2021
Technologien: SwiftUI, List