How to display images horizontally in one line SWIFTUI?

Question

iOS

How to change the display of images in one line horizontally and not vertically as it is now (



Now the code is this:

//I1
            HStack {
                VStack(alignment: .leading) {
                    Image(champions.imagei1)
                        .resizable()
                        .scaledToFit()
                        .aspectRatio(1, contentMode: .fit)
                    
                                }
                .frame(width: 60, height: 60)
            }
            
            //I2
            VStack(alignment: .leading) {
                Image(champions.imagei2)
                    .resizable()
                    .scaledToFit()
                    .aspectRatio(1, contentMode: .fit)
                            }
                            .frame(width: 60, height: 60)
            
            //I3
            VStack(alignment: .leading) {
                Image(champions.imagei3)
                    .resizable()
                    .scaledToFit()
                    .aspectRatio(1, contentMode: .fit)
                            }
                            .frame(width: 60, height: 60)
            
            
            
        }.frame(minWidth: 0, idealWidth: 0, maxWidth: .infinity, minHeight: 0, idealHeight: 0, maxHeight: .infinity, alignment: .topLeading)
    }
}

Answer 1

If I understand you correctly:

HStack {
            Image(champions.imagei1)
                .resizable()
                .scaledToFit()
                .aspectRatio(1, contentMode: .fit)
                .frame(width: 60, height: 60)
            
            Spacer()
            
            Image(champions.imagei2)
                .resizable()
                .scaledToFit()
                .aspectRatio(1, contentMode: .fit)
                .frame(width: 60, height: 60)
                    
            Spacer()
            
            Image(champions.imagei3)
                .resizable()
                .scaledToFit()
                .aspectRatio(1, contentMode: .fit)
                .frame(width: 60, height: 60)
      
        }.padding()

HStack - a container in which child elements are arranged horizontally.
VStack - vertically, respectively.