Swfitui List Make Scrolling Disabled

SwfitUI List Make Scrolling disabled

Instead of using List which is scrollable, use ForEach.

ForEach is not scrollable by default.

Here is an example using ForEach

struct ContentView: View {
    let colors: [Color] = [.red, .green, .blue]

    var body: some View {
        VStack {
            ForEach(colors, id: \.self) { color in
                Text(color.description.capitalized)
                    .padding()
                    .background(color)
            }
        }
    }
}

A good resource for ForEach can be found here similarly one for List can be found here.

---

Update

There are currently two ways to stop a List from scrolling:

• Using UITableView.appearance().isScrollEnabled = false (but this can unintended side-effects)
• Using the 3rd party dependency Introspect

Caveats

List contained in a NavigationView

If your List is contained in a NavigationView then it will still scroll. Neither of the above methods stop it from scrolling.

Here is an example view:

import SwiftUI
import Introspect

struct ContentView: View {
    var body: some View {
        NavigationView {
            List {
                ForEach(0..<10, id: \.self) { _ in
                    NavigationLink("Tap") {
                        Text("Hello").onTapGesture {
                            print("hello")
                        }
                    }
                }
            }
//            .onAppear {
//                UIScrollView.appearance().isScrollEnabled = false
//            }
//            .introspectTableView { tableView in
//                tableView.isScrollEnabled = false
//            }
        }
    }
}

Uncommenting the onAppear or the introspectTableView does not stop the List from scrolling.

List not contained in a NavigationView

If the List is not contained in a NavigationView then we can be possible to stop the List from scrolling.

If we remove the NavigationView from the above example, we can see that by uncommenting the onAppear or the introspectTableView the List does stop scrolling.

Here is a video of the above situations.

SwiftUI: How to Disable List Scrolling on Reusable View

Use .disabled(true) on the list to disable interaction with the list.

How to show the entire List without scrolling in SwiftUI

You should use a VStack instead of a List. This will get rid of the scrolling behavior, but will still give vertically organized cells. You can still use ForEach inside if that's what you are doing inside List.

SwiftUI: Disable ScrollView scrolling to top if top of screen is touched

This is not a SwiftUI or Xcode or ScrollView problem.

This is a built-in feature of iPhone.

When you tap the top-center edge of the screen, displayed contents will be scrolled up.

Try opening apps like Facebook, WhatsApp, then scroll and tap at the same position, you will see the displayed contents scroll up.

Disable the scrolling but not the content (iOS 13 and higher)

Don't forget to provide a minimum reproducible example something we can copy and paste to ensure that the integrity if what you want is kept.

If your *StepView.count is static the code below might work for you

struct ButtonScroll: View {
    @State var myId: Int = 0
    
    init() {
        //Add this
        //It does NOT work with ScrollView
        UIScrollView.appearance().isScrollEnabled = false
    }
    var body: some View {
        VStack{
            //Simulates myId changing
            Button("change-position", action: {
                myId = Int.random(in: 0...3)
                print(myId.description)
            })
            ZStack{
                //TabView does not allow for changes in Tab/Page count nicely
                TabView(selection: $myId){
                    //Used Button to test interaction
                    Button("FirstStepView", action: {
                        print("FirstStepView")
                    }).tag(0)
                    Button("SecondStepView", action: {
                        print("SecondStepView")
                    }).tag(1)
                    Button("ThirdStepView", action: {
                        print("ThirdStepView")
                    }).tag(2)
                    Button("FourthStepView", action: {
                        print("FourthStepView")
                    }).tag(3)
                }.tabViewStyle(PageTabViewStyle(indexDisplayMode: .never))
                .animation(
                    Animation.easeOut(duration: 1)
                )
            }
        }
    }
}

List not scrolling (in SwiftUI -- to disambiguate from other questions)

Turns out, the issue wasn't with anything in the struct that was posed above; it all had to do with the View where that struct was being used. Specifically, when a Color() -- even of .opacity(0) -- was in a ZStack sitting "above" the List(), the latter stops scrolling. Displays fine, but just won't scroll.

This question describes the same thing happening, albeit in somewhat different circumstances.

I'll leave this question up, since somebody else may be at the same place I was, "why isn't my List() scrolling?", rather than "why isn't my List() in a ZStack scrolling?" Hopefully a version of Swift later than 13 will fix this behavior!

---

Related Topics