Xcode simulator does not show the same as Preview

Could you some some example code and the parts that are skipped by simulator ?

Sorry for the mess!!

struct tarjetaMomentoDia: View{
    var colorFondo: Color
    var altoTarjetas: CGFloat
    var textoTitulo: String
    var colorLetraTitulo: Color
    var separacion: CGFloat
    var imagenMedicamento: String
    var nombreImagenSistema: String
    var hayFotografia: Bool
    var nombreMedicamento: String
    var textoTiempo: String
    var temporizador: Int
    var anchoRelojCircular: CGFloat
    var diametroReloj: CGFloat
    var separacionTextoEniPad: CGFloat
    var accesibilidad: Bool

    var body: some View {
        Rectangle()
            .frame(maxWidth: .infinity, maxHeight: altoTarjetas/*Hay que hacer variable*/)
            .cornerRadius(30)
            .foregroundColor(colorFondo)
            .padding()
            .overlay(
                VisualEffectBlurView(blurStyle: .systemUltraThinMaterialLight, vibrancyStyle: .fill, content: {/*AQUÍ SE PUEDE METER TEXTO*/})
                    .frame(maxWidth: .infinity, maxHeight: altoTarjetas)// Esto junto a padding permite que funcione en cualquier dispositivo
                    .mask(RoundedRectangle(cornerRadius: 30, style: .continuous))
                    .overlay(RoundedRectangle(cornerRadius: 30, style: .continuous).stroke(lineWidth: 0.5).fill(Color.white))
                    .shadow(color: Color.black.opacity(0.3), radius: 10, x: 0, y: 0)
                    .padding()
            ).overlay(
                VStack(spacing:separacion){
                    HStack{
                        tituloMomentoDia(texto: textoTitulo, colorLetras: colorLetraTitulo, accesibilidadTextoActiva: accesibilidad)
                    }.padding(.top,20)
                    HStack(spacing:separacionTextoEniPad){
                        temporizadorMomentoDia(texto: textoTiempo, colorLetras: colorLetraTitulo, anchoCirculo: anchoRelojCircular, tamanoCirculo: diametroReloj, tiempoRestante: temporizador, accesibilidadTextoActiva: accesibilidad);
                        vistaCompletaListaMedicamentos(imagenMedicamento: imagenMedicamento, nombreImagenSistema: nombreImagenSistema, hayFotografia: hayFotografia, nombreMedicamento: nombreMedicamento, accesibilidadTextoActiva: accesibilidad)
                    }.padding(.horizontal)
                }.padding(.vertical,5)
            )
    }
}

It completely ignores the creation of the rectangle and the struct vistaCompletaListaMedicamentos, everything else executes it. Thanks for helping!!

sorry for the text, it does not allow to send images and the text was very long, according to the page. Thanks again!!

Your code samples are too messed up, to make any sense of them.

Paste the code into a new answer:

• ...as a "Code Block"
• ...using "Paste and Match Style"

A "Code Block" puts one line before and one line after your code, each of those two lines containing three "backtick" characters.

Then your code should format nicely.

Once people can read your code, they may be able to help with your problem!

Properly pasted code should look nice, like this:

    @State var accesibilidadActivaTexto = false //Cambiar a true
    @State var separacioTexto: CGFloat = 0 // Separación entre texto
    @State var separacionTextoiPad: CGFloat = 0
    // etc...

struct ContentView: View {

    @Environment(\.sizeCategory) var category

    /*Inicialización de variables*/
    //Hay que inicializar las clases y las funciones para que operen
    // El @State es muy importante para que funcione la accesibilidad y también para que no chille

    @State var accesibilidadActivaTexto = false //Cambiar a true
    @State var separacioTexto: CGFloat = 0 // Separación entre texto
    @State var separacionTextoiPad: CGFloat = 0
    @State var cambioFuente: ContentSizeCategory = .large {
        didSet{
            //el problema es que category no se actualiza
            accesibilidadActiva()
        }
    }

    let contTarj: [tarjMomentoDia] = tarjMomentoDia.datos
    let tamanosPantalla = tamanosDispositivos()

    init(){
        tamanosPantalla.interfazCambio()
    /*Esto permite ejecutar funciones metidas en una clase que no de resultado y guarde lo que realice en una estructura*/
    }

    var body: some View {
        ZStack{
            VStack{
                ZStack{
                    ForEach(contTarj, id: \.self) {tarjMomentoDia in

                        tarjetaMomentoDia(colorFondo: tarjMomentoDia.colorFondo, altoTarjetas: tarjMomentoDia.altoTarjetas, textoTitulo: tarjMomentoDia.textoTitulo, colorLetraTitulo: tarjMomentoDia.colorLetraTitulo, separacion: separacioTexto, imagenMedicamento: tarjMomentoDia.imagenMedicamento, nombreImagenSistema:tarjMomentoDia.nombreImagenSistema, hayFotografia: false, nombreMedicamento: tarjMomentoDia.nombreMedicamento, textoTiempo: tarjMomentoDia.textoTiempo, temporizador: tarjMomentoDia.temporizador, anchoRelojCircular: tarjMomentoDia.anchoRelojCircular, diametroReloj: tarjMomentoDia.diametroReloj, separacionTextoEniPad: separacionTextoiPad, accesibilidad: accesibilidadActivaTexto).offset(y:tarjMomentoDia.offset)
                    }
            }
        }.onAppear(perform: {cambioFuente = category;accesibilidadActiva()})//Los corchetes, la función y el texto en general es muy importante
    }.onChange(of: category, perform: {value in cambioFuente = value})/*He conseguido que funcione pero "category" no se actualiza porque es una variable del sistema que solo reacciona ante estímulos de este, es por eso que necesito una variable auxiliar "cambioFuente" para que funcione el conjunto*/
}
    //Esta función permite crear una varible que indique si está activo el texto Accesible
    func accesibilidadActiva() -> Void {
        /*Se pueden añadir más if para otras cosas de accesibilidad relacionadas*/
        /*Mira si la letra es accesible o no y lo copia en la variable creada*/
        if cambioFuente != .accessibilityMedium && cambioFuente != .accessibilityLarge && cambioFuente != .accessibilityExtraLarge &&  cambioFuente != .accessibilityExtraExtraLarge && cambioFuente != .accessibilityExtraExtraExtraLarge {
            self.accesibilidadActivaTexto = false
        }else{
            self.accesibilidadActivaTexto = true
        }
        switch cambioFuente {/* Esto permite modificar la distancia según la pantalla y el tamaño de la letra*/
            case .extraSmall:
                separacioTexto = interfazCambiante.extraSmall
                separacionTextoiPad = interfazCambiante.separacionRelojListaiPad
            case .small:
                separacioTexto = interfazCambiante.small
                separacionTextoiPad = interfazCambiante.separacionRelojListaiPad
            case .medium:
                separacioTexto = interfazCambiante.medium
                separacionTextoiPad = interfazCambiante.separacionRelojListaiPad
            case .large:
                separacioTexto = interfazCambiante.large
                separacionTextoiPad = interfazCambiante.separacionRelojListaiPad
            case .extraLarge:
                separacioTexto = interfazCambiante.extraLarge
                separacionTextoiPad = interfazCambiante.separacionRelojListaiPad
            case .extraExtraLarge:
                separacioTexto = interfazCambiante.extraExtraLarge
                separacionTextoiPad = interfazCambiante.separacionRelojListaiPad
            case .extraExtraExtraLarge:
                separacioTexto = interfazCambiante.extraExtraExtraLarge
                separacionTextoiPad = interfazCambiante.separacionRelojListaiPad
            case .accessibilityMedium:
                separacioTexto = interfazCambiante.activeAccesibility
                separacionTextoiPad = interfazCambiante.separacionRelojListaiPad
            case .accessibilityLarge:
                separacioTexto = interfazCambiante.activeAccesibility
                separacionTextoiPad = interfazCambiante.separacionRelojListaiPad
            case .accessibilityExtraLarge:
                separacioTexto = interfazCambiante.activeAccesibility
                separacionTextoiPad = interfazCambiante.separacionRelojListaiPad
            case .accessibilityExtraExtraLarge:
                separacioTexto = interfazCambiante.activeAccesibility
                separacionTextoiPad = interfazCambiante.separacionRelojListaiPad
            case .accessibilityExtraExtraExtraLarge:
                separacioTexto = interfazCambiante.activeAccesibility
                separacionTextoiPad = interfazCambiante.separacionRelojListaiPad
            @unknown default:
                separacioTexto = interfazCambiante.large
                separacionTextoiPad = interfazCambiante.separacionRelojListaiPad
        }
    }
}

We also need to see the code for:

• tarjMomentoDia
• tamanosDispositivos
• interfazCambiante

You earlier posted tarjetaMomentoDia, but I assume that is different to tarjMomentoDia?

And where is VisualEffectBlurView coming from?

struct tarjMomentoDia: Identifiable, Hashable {

    

    var id: UUID
    var colorFondo: Color
    var altoTarjetas: CGFloat
    var textoTitulo: String
    var colorLetraTitulo: Color
    var imagenMedicamento: String
    var nombreImagenSistema: String
    var hayFotografia: Bool
    var nombreMedicamento: String 
    var textoTiempo: String
    var temporizador: Int
    var anchoRelojCircular: CGFloat
    var diametroReloj: CGFloat
    var offset: CGFloat// Esto es la separación del texto

    

    init(id: UUID = UUID(), colorFondo: Color, altoTarjetas: CGFloat, textoTitulo: String, colorLetraTitulo: Color, imagenMedicamento: String, nombreImagenSistema: String, hayFotografia: Bool, nombreMedicamento: String, textoTiempo: String, temporizador: Int, anchoRelojCircular: CGFloat, diametroReloj: CGFloat, offset: CGFloat ) {

       

        self.id = id

        self.colorFondo = colorFondo

        self.altoTarjetas = altoTarjetas

        self.textoTitulo = textoTitulo

        self.colorLetraTitulo = colorLetraTitulo

        //self.separacion = separacion

        self.imagenMedicamento = imagenMedicamento

        self.nombreImagenSistema = nombreImagenSistema

        self.hayFotografia = hayFotografia

        self.nombreMedicamento = nombreMedicamento

        self.textoTiempo = textoTiempo

        self.temporizador = temporizador

        self.anchoRelojCircular = anchoRelojCircular

        self.diametroReloj = diametroReloj

        //self.separacionTextoEniPad = separacionTextoEniPad

        //self.accesibilidad = accesibilidad

        self.offset = offset

        

    }

}

/*Esto no puede ser static var si una de las variables cambia con el tiempo*/

extension tarjMomentoDia {

     static var datos: [tarjMomentoDia] {

        [

            

            tarjMomentoDia(colorFondo: Color(red: 0.8, green: 1.0, blue: 0.92), altoTarjetas: interfazCambiante.altoTarjetas, textoTitulo: "Mañana", colorLetraTitulo: Color(red: 0.08, green: 0.32, blue: 0.39), imagenMedicamento: "", nombreImagenSistema: "pills.fill", hayFotografia: false, nombreMedicamento: "Alprazolam 200mg", textoTiempo: "Siguiente Toma", temporizador: 12, anchoRelojCircular: interfazCambiante.anchoCirculos, diametroReloj: interfazCambiante.tamanoCirculos, offset: 0)

            

        ]

    }

}

struct interfazCambiante {

    

//-----------------------------------------------------------------TARJETAS-----------------------------------------------------------------

    

    static var altoTarjetas: CGFloat =  0 // Se queda

    static var anchoTarjetas = 0

    static var espacioEntreTarjetas = 0

    static var separacionMenuTarjetas = 0

    static var separaciónMedicacionUsuarios = 0

    static var separacionEntreElementos = 0

    static var separacionUsuariosAnuncios = 0

    

//------------------------------------------------------------CONTENIDO TARJETAS-------------------------------------------------------------

    

    //@Environment(\.sizeCategory) public var sizeCategory: ContentSizeCategory

    @State private var accesibilidadActiva: Bool = false

    @State private var textoTarjeta: String = ""

    @State private var colorTextoTarjeta: Color = Color(red: 0, green: 0, blue: 0)

    static var tamanoLetra: CGFloat = 0

    //<<<<<<<<<<<<<<DISTANCIA CABECERA-CONTENIDO SEGÚN TAMAÑO DE LETRA>>>>>>>>>>>>>>>

    static var normal: CGFloat = 0

    static var extraSmall: CGFloat = 0

    static var small: CGFloat = 0

    static var medium: CGFloat = 0

    static var large: CGFloat = 0

    static var extraLarge: CGFloat = 0

    static var extraExtraLarge: CGFloat = 0

    static var extraExtraExtraLarge: CGFloat = 0

    static var activeAccesibility: CGFloat = 0

    static var separacionRelojListaiPad: CGFloat = 0

    //-------------------------------------------------------------------------------

    static var tamanoTituloTarjetas = 0

    static var posicionTituloNocheX = 0

    static var posicionTituloTardeX = 0

    static var posicionTituloMediodiaX = 0

    static var posicionTituloMananaX = 0

    static var posicionTituloTarjetasY = 0

    static var posicionRestoLetrasTarjetaX = 0

    static var posicionRestoLetrasTarjetaY = 0

    static var tamanoRestoLetrasTarjeta = 0

    static var tamanoCirculos: CGFloat = 0

    static var anchoCirculos: CGFloat = 0

    static var posicionCirculosX = 0

    static var posicionCirculosY = 0

    static var tamanoSiguienteToma = 0

    static var posicionSiguienteTomaX = 0

    static var posicionSiguienteTomaY = 0

    static var tamanoCompartidoCon = 0

    static var posicionCompartidoConX = 0

    static var posicionCompartidoConY = 0

    static var contador = 0

    

//-------------------------------------------------------------------MENÚ----------------------------------------------------------------------

    

    static var alturaMenu = 0

    static var plantillaLargo = 0

    static var circuloAncho =  0

    static var iconosMenu = 0

    static var separacionIconosMenu = 0

    static var separacionIndividialIconosMenu = 0

    static var altoPlantilla = 0

    //static var anuncioY = 0

    static var logoX = 0

    static var logoY = 0

}

We are getting there, but we still need:

• tamanosDispositivos

Also, your property names (correctly) begin with a lowercase letter, but you should capitalize your struct names, so

• struct tarjetaMomentoDia: View {
• struct tarjMomentoDia: Identifiable, Hashable {
• struct interfazCambiante {

should be:

• struct TarjetaMomentoDia: View {
• struct TarjMomentoDia: Identifiable, Hashable {
• struct InterfazCambiante {

         func interfazCambio () -> Void {

            let modelo = UIDevice.modelName

            let flotanteModelo = (modelo as NSString).floatValue

            print(modelo)

             if (flotanteModelo < 4.7){

            //Que devuelva los parámetros

                //<<<<<<<<<<<<<<<<<<ESTRUCTURAS>>>>>>>>>>>>>>>>>

                interfazCambiante.separaciónMedicacionUsuarios = 210

                interfazCambiante.separacionEntreElementos = 100

                interfazCambiante.separacionUsuariosAnuncios = 125

                interfazCambiante.logoX = 160

                interfazCambiante.logoY = 170

                //<<<<<<<<<<<<<<<<MENÚ CABECERA>>>>>>>>>>>>>>>>>

                interfazCambiante.plantillaLargo = 25

                interfazCambiante.circuloAncho = 185

                interfazCambiante.iconosMenu = 25

                interfazCambiante.separacionIconosMenu = 200

                interfazCambiante.separacionIndividialIconosMenu = 25

                interfazCambiante.altoPlantilla = 20

                interfazCambiante.alturaMenu = 10

                interfazCambiante.separacionMenuTarjetas = 10

                //<<<<<<<<<<<<<<<<<<<TARJETAS>>>>>>>>>>>>>>>>>>>>

                interfazCambiante.altoTarjetas = 170 // Se queda

                interfazCambiante.anchoTarjetas = 50

                //Esta es la separación

                interfazCambiante.espacioEntreTarjetas = 25

                //<<<<<<<<<<<<<<CONTENIDO TARJETAS>>>>>>>>>>>>>>>

                interfazCambiante.tamanoTituloTarjetas = 16

                interfazCambiante.posicionTituloMananaX = 250

                interfazCambiante.posicionTituloMediodiaX = 165

                interfazCambiante.posicionTituloTardeX = 123

                interfazCambiante.posicionTituloNocheX = 72

                interfazCambiante.posicionTituloTarjetasY = 15

                interfazCambiante.tamanoCirculos = 80

                interfazCambiante.anchoCirculos = 12

                interfazCambiante.posicionCirculosX = 90

                interfazCambiante.posicionCirculosY = 75

                interfazCambiante.tamanoSiguienteToma = 15

                interfazCambiante.tamanoCompartidoCon = 10

                interfazCambiante.posicionSiguienteTomaX = 90

                interfazCambiante.posicionSiguienteTomaY = 130

                interfazCambiante.posicionCompartidoConX = 80

                interfazCambiante.posicionCompartidoConY = 150

                //<<<<<<<<<<<<<<DISTANCIA CABECERA-CONTENIDO SEGÚN TAMAÑO DE LETRA>>>>>>>>>>>>>>>

                interfazCambiante.normal = -13

                interfazCambiante.extraSmall = -10

                interfazCambiante.small = -12

                interfazCambiante.medium = -13

                interfazCambiante.large = -13

                interfazCambiante.extraLarge = -18

                interfazCambiante.extraExtraLarge = -20

                interfazCambiante.extraExtraExtraLarge = -23

                interfazCambiante.activeAccesibility = 0

                interfazCambiante.separacionRelojListaiPad = 0

                
            }

the text is too long and it won't let me write it, thanks again!!

         func interfazCambio () -> Void {
            let modelo = UIDevice.modelName
            let flotanteModelo = (modelo as NSString).floatValue
            print(modelo)
              else if (flotanteModelo == 4.7){
                //<<<<<<<<<<<<<<<<<<ESTRUCTURAS>>>>>>>>>>>>>>>>>
                interfazCambiante.separaciónMedicacionUsuarios = 252
                interfazCambiante.separacionEntreElementos = 100
                interfazCambiante.separacionUsuariosAnuncios = 145
                interfazCambiante.logoX = 185
                interfazCambiante.logoY = 175
                //<<<<<<<<<<<<<<<<MENÚ CABECERA>>>>>>>>>>>>>>>>>
                interfazCambiante.plantillaLargo = 25
                interfazCambiante.circuloAncho = 200
                interfazCambiante.iconosMenu = 26
                interfazCambiante.separacionIconosMenu = 215
                interfazCambiante.separacionIndividialIconosMenu = 25
                interfazCambiante.altoPlantilla = 20
                interfazCambiante.alturaMenu = 40
                interfazCambiante.separacionMenuTarjetas = 15
                //<<<<<<<<<<<<<<<<<<<TARJETAS>>>>>>>>>>>>>>>>>>>>
                interfazCambiante.altoTarjetas = 185// Se queda
                interfazCambiante.anchoTarjetas = 30
                interfazCambiante.espacioEntreTarjetas = 35
                //<<<<<<<<<<<<<<CONTENIDO TARJETAS>>>>>>>>>>>>>>>
                interfazCambiante.tamanoTituloTarjetas = 20
                interfazCambiante.posicionTituloMananaX = 290
                interfazCambiante.posicionTituloMediodiaX = 194
                interfazCambiante.posicionTituloTardeX = 137
                interfazCambiante.posicionTituloNocheX = 79
                interfazCambiante.posicionTituloTarjetasY = 20
                interfazCambiante.tamanoCirculos = 90
                interfazCambiante.anchoCirculos = 10
                interfazCambiante.posicionCirculosX = 90
                interfazCambiante.posicionCirculosY = 85
                interfazCambiante.tamanoSiguienteToma = 15
                interfazCambiante.tamanoCompartidoCon = 12
                interfazCambiante.posicionSiguienteTomaX = 90
                interfazCambiante.posicionSiguienteTomaY = 150
                interfazCambiante.posicionCompartidoConX = 90
                interfazCambiante.posicionCompartidoConY = 170
                //<<<<<<<<<<<<<<DISTANCIA CABECERA-CONTENIDO SEGÚN TAMAÑO DE LETRA>>>>>>>>>>>>>>>
                interfazCambiante.normal = -10
                interfazCambiante.extraSmall = -2
                interfazCambiante.small = -8
                interfazCambiante.medium = -10
                interfazCambiante.large = -10
                interfazCambiante.extraLarge = -18
                interfazCambiante.extraExtraLarge = -18
                interfazCambiante.extraExtraExtraLarge = -20
                interfazCambiante.activeAccesibility = 0
                interfazCambiante.separacionRelojListaiPad = 0
                print("4.7")
            } 

Your code will not build in Xcode, as you have not supplied the definition of "tamanosDispositivos".

• I think "func interfazCambio ()" should be within "tamanosDispositivos"?
• Your code for "func interfazCambio ()" is not valid (there is an "else if", which is not part of an "if" statement).

So it is very difficult to say what might be going wrong.
However, I can make some general comments:

You seem to have made things very, very complicated.
This does not seem to be in keeping with the principles of SwiftUI, which allow the building of a device-independent User Interface, without explicitly accounting for every variation between the different screen sizes (as you seem to do).

I would suggest that you simplify your UI down to a minimal specification, and get that working first:

• What Views appear on screen?
• What are the spatial relationships between them?
• What conditions affect these?

I would also suggest that you consider abandoning the external code library (which is just an extra complication, at this stage), and use standard SwiftUI until you have a more thorough understanding of it. (This only affects "VisualEffectBlurView", in the supplied code.)

You might also want to consider some further study of SwiftUI... ...I highly recommend Paul Hegarty's Stanford course, at https://cs193p.sites.stanford.edu

If you have more specific issues, I suggest you post them here on the forum, as new questions.

Hello, well, I am going to tell you about the problem and the "solution" that I have obtained. A few days ago, because I followed one of Apple's tutorials (https://developer.apple.com/tutorials/app-dev-training/displaying-data-in-a-list), I came up with the idea of simplify my code, I wanted to create a list using cards with CHANGING INFORMATION, and to be able to add or remove data easily. Since I'm new to Swift (I've used more C and Python), I didn't know how to do it, so I followed the tutorial above. I had many problems adding the code and Xcode did not stop complaining and "screaming" 😂, once I changed the code to what you see up there more or less (things are missing and there are many others that the program does not use but, for various reasons, I have not erased 😅), and Xcode did the miracle, it did not complain, there was nothing in red and in Preview it looked just the way I wanted, my pain came, when I connected my iPhone to see the result of my work, and I found a blank app, I built it in the simulator and it also happened the same, there was nothing. I spent the next few days researching the problem, desperate, tired, and stymied, I wrote on the forum. I thank the two people who have answered me, their effort and time dedicated to my problem, I really believed that no one was going to appear and I appreciate it very much. After reading the last answer, I gave up and went back to the backup I made before changing anything, but my stubbornness didn't leave me alone and I removed all the code except a rectangle, foreach, and the data.

IN SUMMARY:

FOREACH DOES NOT ACCEPT DATA THAT CHANGES WITH TIME, YOU GIVE IT A FIXED LIST, A STRING, WITH ALREADY KNOWN DATA AND PROCESSES IT. THE PROBLEM IS THAT IF THE FOREACH FUNCTION IS DESIGNED FOR IMMUTABLE DATA IT SHOULD, AT LEAST, GIVE AN ERROR IF THE DATA IS VAR INSTEAD OF LET, XCODE YELLS AT ME AND PUTS EVERYTHING IN RED, HOWEVER IT COMPILES IT BOTH IN THE SIMULATOR AS IN PREVIEW, WITHOUT IMMUTING. AND IF IT'S A BUG AND NOT DESIGNED FOR THAT, PLEASE, PREVIEW SHOULD NOT WORK. THAT I GOT HAPPY AND THEN I CRY. 🤣🤣

Well that's it, thanks for your patience.

Good afternoon.