Блог

Главная - Вопросы по программированию - Наблюдайте за событием изменения размера окна с помощью SwiftUI

Наблюдайте за событием изменения размера окна с помощью SwiftUI

#swift #swiftui #nsview #nswindow #nsnotifications

#swift #свифтуи #nsview #нсокно #nsnotifications

Вопрос:

В настоящее время у меня есть LazyVGrid настройка как таковая:

 struct NetworkGrid: View {
    var networks: [Network]
    let columns = [
            GridItem(.flexible()),
            GridItem(.flexible()),
            GridItem(.flexible()),
            GridItem(.flexible())
        ]
    
    var body: some View {
        ScrollView {
            LazyVGrid(columns: columns) {
                ForEach(networks) { network in
                    NetworkCard(network: network)
                }
            }
        }
    }
}

Я хотел бы установить количество столбцов сетки на основе текущего размера окна, т.Е.

 func windowDidResize(_ notification: Notification) {
    itemWidth = CGFloat(300)
    if window.width <= itemWidth {
        GridItem(.flexible()), GridItem(.flexible())
    } else if window.width <= itemWidth * 2 {
        GridItem(.flexible()), GridItem(.flexible()), GridItem(.flexible())
    } else if window.width <= itemWidth * 3 {
        GridItem(.flexible()), GridItem(.flexible()), GridItem(.flexible()), GridItem(.flexible())
    }
    ...
}

Как бы я приступил к реализации такого наблюдателя с помощью SwiftUI?

Ответ №1:

Эквивалент SwiftUI для прослушивания размера окна, вероятно, будет использовать GeometryReader . В вашем примере вы можете считывать размер и динамически определять столбцы на основе его значения ширины:

 struct NetworkGrid: View {
    var networks: [Network]
    
    func columnsForWidth(width: CGFloat) -> [GridItem] {
        print("Columns for width: (width)")
        return Array(repeating: GridItem(.flexible()), count: Int(width) / 100)
    }
    
    var body: some View {
        GeometryReader { geometry in
            ScrollView {
                LazyVGrid(columns: columnsForWidth(width: geometry.size.width)) {
                    ForEach(networks) { network in
                        NetworkCard(network: network)
                    }
                }
            }
        }
    }
}

Комментарии:

1. Спасибо, это работает потрясающе! Похоже, оно не появляется, когда я встраиваю его в другое представление и запускаю с помощью переключателя кнопок. Есть идеи?

2.Консоль будет печатать Columns for width: 1356.0 Columns for width: 0.0 Columns for width: 1356.0 при вызове представления.

3. Возможно, он не отображается при встраивании в список.

4. Вы должны были бы показать мне пример — не совсем уверен, о каком именно сценарии вы говорите.

5. Я также скажу (заранее), что GeometryReader это не измеряет размер всего окна — оно измеряет только размер его собственного представления. Таким образом, чтобы получить полный размер окна, это должен быть вид самого высокого уровня.

Ответ №2:

Если вы хотите обновить @State @ObservedObject переменные or при изменении размера представления, вы можете использовать onAppear(выполнить:) для обновления переменных с начальным размером представления и onChange(of:perform:) для обнаружения изменений размера представления:

 struct MyView: View {
  @State private var size: CGSize = .zero

  var body: some View {
    GeometryReader { geometry in
      ZStack {
        Text("Hello World")
      }.onAppear {
        size = geometry.size
      }.onChange(of: geometry.size) { newSize in
        size = newSize
      }
    }
  }
}