SwiftUI отображает элементы навигации - PullRequest
0 голосов
/ 24 января 2020

В моем приложении SwiftUI я хотел бы опустить элементы панели навигации, как в собственных приложениях Apple UIKit.

Ниже приведен скриншот из приложения Health. Обратите внимание, как изображение профиля соответствует тексту «Сводка». Это то, чего я хочу достичь. enter image description here

Я пытался использовать .padding(.top, 90), но это не сработало, так как не вызывало виртуальное окно, позволяющее нажимать кнопку. Использование отступов означает, что вы должны нажать кнопку над изображением / текстом.

Спасибо.

1 Ответ

1 голос

К сожалению, я не нашел никакого решения для изменения высоты панели навигации в iOS 13 с SwiftUI, и у меня были те же проблемы ранее. Приведенное ниже решение подойдет вам, если ваша навигационная панель всегда только черная и у вас все в порядке с пробелом сверху:

struct NavBarCustomItems: View {

    init() {
        setNavigationBarToBlackOnly()
    }

    func setNavigationBarToBlackOnly() {
        let blackAppearance = UINavigationBarAppearance()
        blackAppearance.configureWithOpaqueBackground()
        blackAppearance.backgroundColor = .black
        blackAppearance.shadowColor = .clear // to avoid border line

        UINavigationBar.appearance().standardAppearance = blackAppearance
        UINavigationBar.appearance().scrollEdgeAppearance = blackAppearance
    }

    var body: some View {

        NavigationView {

            VStack {

                NavigationBarMimicry()

                // here is your content
                HStack {
                    Text("Favorites")
                    Spacer()
                    Button(action: {}) { Text("Edit") }
                }
                .padding()


                Spacer()

                VStack {
                    Text("Main screen")
                }
                // you need spacer(s) to be sure, that NavigationBarMimicry is always on the top
                Spacer()

            }

        }

    }

}

// MARK: here is what you need in navigation bar
struct NavigationBarMimicry: View {

    var body: some View {
        HStack {

            Text("Summary")
                .bold()
                .font(.system(size: 40))
                .foregroundColor(.white)
                .padding(.horizontal)

            Spacer()

            Rectangle()
                .foregroundColor(.white)
                .frame(width: 40)
                .padding(.horizontal)

        }
        .background(Color.black)
        .frame(height: 40)
        .navigationBarTitle("", displayMode: .inline)
        // you can add it to hide navigation bar, navigation will work via NavigationLink
//        .navigationBarHidden(true) 
    }

}

struct NavBarCustomItems_Previews: PreviewProvider {
    static var previews: some View {
        NavBarCustomItems().environment(\.colorScheme, .dark)
    }
}

результат должен быть таким:

enter image description here

PS может быть и другие способы:

  • Положить представления в таком порядке: VStack { NavigationBarMimicry(); NavigationView {...}};
  • раскомментируйте строку кода: .navigationBarHidden(true);
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...