SwiftUI — Как остановить ScrollView, получающий касания за другим представлением

У меня LazyVStack внутри ScrollView, который находится под меньшим видом (желтый вид на изображении).

введите описание изображения здесь

Проблема в том, что когда сетка прокручивается вверх, ячейки все еще могут получать касания через желтый вид, что мне действительно не нужно. Я хочу поместить поиск TextField в это представление, и штрихи перепутаются, а пользовательский опыт — беспорядок. В примере кода я добавил кнопку для переключения на List, чтобы проверить, есть ли у него такая же проблема с прокруткой. Это не так.

import SwiftUI

struct ContentView: View {
    
    @State private var useList = false
    @State private var gridLayout: [GridItem] = [GridItem(.flexible()), GridItem(.flexible()), GridItem(.flexible())]
    
    var data = (0...249).map { "\($0)" }
    
    var body: some View {
        NavigationView {
            VStack {
                TopInfoPane()
                if useList {
                    List(data, id: \.self) { item in
                        NavigationLink(destination: Text(item)) {
                            Text(item)
                        }
                    }
                } else {
                    ScrollView {
                        LazyVGrid(columns: gridLayout, alignment: .center, spacing: 8) {
                            ForEach(data, id: \.self) { item in
                                NavigationLink(destination: Text(item)) {
                                    Cell(item: item)
                                }
                            }
                        }
                    }
                }
            }.navigationBarTitle("Scroller")
            .navigationBarItems(trailing: Button(action: { useList.toggle() }) { Text("Swap") })
        }
    }
}

struct Cell: View {
    var item: String
    var body: some View {
        Text(item)
            .frame(minWidth: 0, maxWidth: .infinity, minHeight: 75)
            .background(Color.green)
    }
}

struct TopInfoPane: View {
    var body: some View {
        Text("TopInfoPane")
            .frame(height: 48)
            .frame(minWidth: 0, maxWidth: .infinity)
            .background(Color.yellow)
    }
}

Я пробовал установить анимацию в представлении на ноль и установить .allowsHitTesting(false), но они не помогли. Я в растерянности, потому что действительно не ожидал, что ScrollView все равно будет прокручиваться за пределы своего собственного фрейма.

См. также:  Добавить новый столбец в кадр данных состояния на основе данных другого столбца
Понравилась статья? Поделиться с друзьями:
IT Шеф
Комментарии: 1
  1. Magnas

    Попробуйте закрепить ScrollView следующим образом

    ScrollView {
        LazyVGrid(columns: gridLayout, alignment: .center, spacing: 8) {
            ForEach(data, id: \.self) { item in
                NavigationLink(destination: Text(item)) {
                    Cell(item: item)
                }
            }
        }
    }
    .contentShape(Rectangle())
    .clipped()
    
Добавить комментарий

;-) :| :x :twisted: :smile: :shock: :sad: :roll: :razz: :oops: :o :mrgreen: :lol: :idea: :grin: :evil: :cry: :cool: :arrow: :???: :?: :!: