SwiftUI HStack llena todo el ancho con el mismo espacio

Necesitamos tu ayuda para difundir nuestros tutoriales referente a las ciencias informáticas.

Solución:

los frame modificador de diseño, con .infinity Para el maxWidth parámetro se puede utilizar para lograr esto, sin la necesidad de un adicional Shape Vista.

struct ContentView: View 
    var data = ["View", "V", "View Long"]

    var body: some View 
    VStack 

        // This will be as small as possible to fit the data
        HStack 
            ForEach(data, id: .self)  item in
                Text(item)
                    .border(Color.red)
            
        

        // The frame modifier allows the view to expand horizontally
        HStack 
            ForEach(data, id: .self)  item in
                Text(item)
                    .frame(maxWidth: .infinity)
                    .border(Color.red)
            
        
    
    

Los diversos *Stack los tipos intentarán reducirse al tamaño más pequeño posible para contener sus vistas secundarias. Si la vista secundaria tiene un tamaño ideal, entonces el *Stack no se expandirá para llenar la pantalla. Esto se puede superar colocando a cada niño encima de un claro Rectangle en un ZStackPorque un Shape ampliará tanto como sea posible. Una manera conveniente de hacer esto es a través de una extensión en View:

extension View 
    func inExpandingRectangle() -> some View 
        ZStack 
            Rectangle()
                .fill(Color.clear)
            self
        
    

A continuación, puede llamarlo así:

struct ContentView: View 
    var data = ["View", "View", "View"]

    var body: some View 
        VStack 

            // This will be as small as possible to fit the items
            HStack 
                ForEach(data, id: .self)  item in
                    Text(item)
                        .border(Color.red)
                
            

            // Each item's invisible Rectangle forces it to expand
            // The .fixedSize modifier prevents expansion in the vertical direction
            HStack 
                ForEach(data, id: .self)  item in
                    Text(item)
                        .inExpandingRectangle()
                        .fixedSize(horizontal: false, vertical: true)
                        .border(Color.red)
                
            

        
    

Puede ajustar el espacio en el HStack como se desee.

Si los elementos son compatibles con el ancho completo, se hará automáticamente, puede envolver elementos entre espaciadores para que esto suceda:

struct Resizable: View 
    let text: String

    var body: some View 
        HStack 
            Spacer()
            Text(text)
            Spacer()
        
    

Vos tambien. puede usarlo en un bucle como:

HStack 
    ForEach(data, id: .self)  item in
        Resizable(text: item)
    

Puedes añadir valor a nuestro contenido informacional cooperando tu veteranía en las reseñas.

---

---

Utiliza Nuestro Buscador