【SwiftUI】写真をインスタグラムのようにおしゃれに並べる方法！グリッドデザインの最も簡単な実装方法を紹介します！

struct ContentView: View {

    var imgArr = [
        "hamburger-1", "hamburger-2", "hamburger-3",
        "hamburger-4", "hamburger-5", "hamburger-6",
        "hamburger-7", "hamburger-8", "hamburger-9"
    ]
    var columns: [GridItem] = Array(repeating: .init(.flexible()), count: 3);

    var body: some View {
        VStack {
            Spacer()
            LazyVGrid(columns: columns) {
                ForEach(imgArr, id: \.self) { img in
                    ZStack(alignment: .topLeading) {
                        Image("\(img)")
                            .resizable()
                            .aspectRatio(contentMode: .fill)
                            .frame(
                                width: UIScreen.main.bounds.size.width / 3 - 10,
                                height: UIScreen.main.bounds.size.width / 3 - 10
                            )
                            .clipped()
                        VStack {
                            Spacer()
                            HStack {
                                Spacer()
                                Text("\(img)")
                                    .font(.body)
                                    .foregroundColor(.white)
                                    .bold()
                                Spacer()
                            }
                            Spacer()
                        }
                    }
                }
            }
            .padding(.horizontal, 10)
            Spacer()
        }
    }
}

ForEach(imgArr, id: \.self) { img in
    Image("\(img)")
}