Kategorien-Archiv sin categoría

VonTobias Stephan

SwiftUI TableView ListView example sample code project

En mi opinión, SwiftUI es un hito absoluto en el desarrollo de software. Ciertamente lleva tiempo acostumbrarse a esta nueva forma de desarrollo, pero el tiempo que se ahorra en otros proyectos puede ser bien invertido. Aquí puede encontrar un simple ejemplo de un SwiftUI TableView. El Proyecto de Muestra puede ser descargado y utilizado libremente. El proyecto deliberadamente no contiene más, de modo que las funciones esenciales contribuyen al entendimiento.

Download XCode Sample Project.

Es bastante impresionante las pocas líneas de código que puedes crear un TableView / ListView con SwiftUI. Sólo crea un nuevo proyecto y asegúrate de que SwiftUI sea seleccionado como interfaz de usuario.

SwiftUI Interace selektieren

Por supuesto que todavía necesitas 3 imágenes para este ejemplo, también están incluidas en el proyecto de ejemplo.

Assets für die Bilder in der Liste

El código real del proyecto.

import SwiftUI

struct ContentView: View {
    var oListArray: [oListenEntries] = testData
    var body: some View {
        List(oListArray) { item in
            Image(item.imageName).resizable().frame(width: 32.0, height: 20.0)
            VStack(alignment: .leading){
                Text(item.make)
                Text(item.model)
                    .font(.subheadline)
                    .foregroundColor(Color.gray)
            }
        }
    }

    struct ContentView_Previews: PreviewProvider {
        static var previews: some View {
            ContentView(oListArray: testData)
        }
    }
}

Aquí está el código de la matriz subyacente. Para ello he creado una vista SwiftUI con el nombre de oListEntries.swift.

import SwiftUI

struct oListenEntries : Identifiable {
    var id = UUID()
    var make: String;
    var model: String;
    var imageName: String { return make }
}

let testData = [
    oListenEntries(make: "Flaschenhalter", model: "für Balkon oder Pool"),
    oListenEntries(make: "Pooladapter", model: "32 mm auf 12 mm"),
    oListenEntries(make: "Sektglashalter", model: "schwimmend")
]
VonTobias Stephan

Swiftui tabbar selecteditem

Durante mis primeros intentos con Swift UI, intenté desesperadamente averiguar cómo seleccionar la pestaña activa de forma programada. El truco está en la encuadernación.

@State public var selection = 0

Con un clic en el botón de selección le dice al valor uno. Como la selección está directamente vinculada a la barra de pestañas, el elemento de pestaña activo cambia según se desee.

Button("Go",action: {self.selection = 1})

La vinculación es la señal de acceso que se puede pasar para permitir el acceso directo de lectura y escritura al valor sin conceder la posesión (en el sentido de conservar un tipo de referencia) o la copia (para un tipo de valor).

Cuando el usuario selecciona una pestaña en la vista de pestañas, cambia el valor unilateralmente a través de la vinculación y asigna el correspondiente .tag(…) a la variableTab seleccionada. Esto funciona de la misma manera para @Estado y Objeto Observable.

El programador también puede asignar un valor a esta variable Tab seleccionada en cualquier momento, y el TabView cambia inmediatamente la pestaña visualizada.
Esta es la clave para la navegación programada en SwiftUI.

Aquí hay un ejemplo que puedes copiar/pegar directamente para jugar con él.

import SwiftUI

struct ContentView: View {
    @State public var selection = 0

    let defaults = UserDefaults.standard

    var body: some View {
        TabView(selection: $selection){
            VStack {
                Text("First View")
                Button("Go",action: {self.selection = 1})
            }
            .font(.title)
            .tabItem {
                VStack {
                    Image("first")
                    Text("First")
                }
            }
            .tag(0)
            Text("Second View")

                .font(.title)
                .tabItem {
                    VStack {
                        HStack{
                            Image("second")
                            Text("Second")
                        }
                    }
            }
            .tag(1)
        }
    }
}



struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}