article

Monday, May 24, 2021

SwiftUI Horizontal scroll or horizontal list view

SwiftUI Horizontal scroll or horizontal list view
 
//
//  ContentView.swift
//  Testapp
//
//  Created by Cairocoders
//

import SwiftUI


struct ContentView: View {

    
    var body: some View {
        VStack {
            Divider()
            ScrollView(.horizontal) {
                HStack(spacing: 10) {
                    ForEach(0..<21) { index in
                        NumberView1to20(label: "\(index)")
                    }
                }.padding()
            }.frame(height: 100)
            Divider()
            Spacer()
        }
    }
}

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

struct NumberView1to20: View {
    @State var label: String
    
    var body: some View {
        ZStack {
            Circle()
                .fill(Color.green)
                .frame(width: 70, height: 70)
            Text(label)
                .foregroundColor(.white)
        }
    }
}

Related Post