Каково равенство UISplitViewController в SwiftUI

Question

Мне нужно реализовать пользовательский интерфейс, близкий к стандартному приложению Mail в iPad и iPhone.

Приложение имеет два раздела, как правило, основной вид будет отображаться на левой стороне, а подробный вид будет отображаться на правой стороне в iPad.

В телефоне основной вид будет отображаться на весь экран, подробный вид может быть выдвинут как второй экран.

Как реализовать это в новом SwiftUI

Answer 1

На самом деле в SwiftUI нет SplitView, но то, что вы описываете, автоматически достигается при использовании следующего кода:

import SwiftUI

struct MyView: View {
    var body: some View {
        NavigationView {
            // The first View inside the NavigationView is the Master
            List(1 ... 5, id: \.self) { x in
                NavigationLink(destination: SecondView(detail: x)) {
                    Text("Master\nYou can display a list for example")
                }
            }
            .navigationBarTitle("Master")
            // The second View is the Detail
            Text("Detail placeholder\nHere you could display something when nothing from the list is selected")
                .navigationBarTitle("Detail")
        }
    }
}

struct SecondView: View {
    var detail: Int
    var body: some View {
        Text("Now you are seeing the real detail View! This is detail \(detail)")
    }
}

Это также почему .navigationBarTitle() модификатор должен применяться к представлению внутри NavigationView, а не к самому NavigationView.

Бонус: если вам не нравится splitView navigationViewStyle, вы можете применить .navigationViewStyle(StackNavigationViewStyle()) модификатор в NavigationView.

Изменить: я обнаружил, что NavigationLink имеет isDetailLink(Bool) модификатор. Значением по умолчанию является trueпотому что по умолчанию "назначение" представлено в подробном представлении (справа). Но когда вы установите этот модификатор в false, пункт назначения представлен как мастер (слева).

Answer 2

В iOS 16+ разделенное представление можно создать следующим образом:

      @State private var employeeIds: Set<Employee.ID> = []

var body: some View {
    NavigationSplitView {
        List(model.employees, selection: $employeeIds) { employee in
            Text(employee.name)
        }
    } detail: {
        EmployeeDetails(for: employeeIds)
    }
}

Вы можете настроить макеты как с 2, так и с 3 столбцами.

Документы: https://developer.apple.com/documentation/swiftui/navigationsplitview .