Help disable the digitalCrown in ScrollView or List

Hello Apple Developer Forum,

I'm reaching out because I've encountered an issue with my app's implementation involving the ScrollView and the digitalCrown, and I'm hoping to find some guidance or assistance from the community.

Currently, I'm developing an app where users can navigate through dates using the digitalCrown to change the "$scrollAmount", which then dynamically updates the ScrollView with events corresponding to that date. However, I've run into a problem where the ScrollView is being inadvertently scrolled by the digitalCrown every time it's initiated.

Ideally, I would like to disable the digitalCrown's interaction with the ScrollView altogether, so that the ScrollView is only scrolled using touch inputs and not by the digitalCrown. I've tried several approaches to achieve this, but haven't had much success so far.

Could anyone please provide some guidance or suggestions on how I can effectively disable the digitalCrown's interaction with the ScrollView while still allowing touch-based scrolling?

Any help or insights into this matter would be greatly appreciated. Thank you very much in advance for your time and assistance.

Best regards,

Example code:

var body: some View {
    NavigationView {
        VStack {
            HStack{
                Text("\(formattedDate(for: scrollAmount, format: lineOne))")
                    .onTapGesture {
                        scrollAmount = 0.0
                    }
            }
            ScrollView{
                    ForEach(viewModel.events, id: \.event) { viewModelItem in
                        let event = viewModelItem.event
                        
                        VStack {
                            HStack {
                                Text(event.title)
                            }
                        }
                    }
                }
                .scrollDisabled(true)
            }
        }
        .focusable(isFocused)
        .digitalCrownRotation(
            detent: $scrollAmount,
            from: -365.0,
            through: 365.0,
            by: 1.0,
            sensitivity: .low,
            isContinuous: false,
            isHapticFeedbackEnabled: true)
        .onChange(of: scrollAmount) {
            let roundedValue = round(scrollAmount)
            scrollAmount = roundedValue
            viewModel.fetchEvents(for: scrollAmount)
        }
    }
}

Replies

Disabling something that users expect to work is a bad user experience. If I encounter a list, I want to be able to scroll it with the Digital Crown. If that doesn't work, then I'll likely think your app is broken.

Add a Comment