簡體   English   中英

SwiftUI:如何使用語義放置呈現多個 ToolbarItem?

[英]SwiftUI: how to present more than one ToolbarItem using semantic placement?

WWDC 2020 SwiftUI 會談提到了一個新的“.toolbar”修飾符。 工具欄因所使用的設備而異,工具欄修飾符應為設備創建正確類型的工具欄。 此外,工具欄因視圖的顯示方式而異——即您是導航到場景還是以模態方式呈現場景?

在下面的 playground 代碼中,有兩個 View 結構。 第一個稱為MainToolbarView並顯示(我相信),就好像操場已經導航到它一樣。 第二個稱為PresentedView並從MainToolbarView模態呈現。

MainToobarView(非模態)

在 MainToolbarView 中,工具欄為其SaveCancel按鈕( .navigationBarLeading.navigationBarTrailing )定位。 這很好用。 點擊任一按鈕都會導致文本字段顯示“保存”或“取消”。

PresentedView(模態)

當點擊Present Sheet按鈕時,將以模態方式呈現第二個視圖。 所顯示工作表的工具欄中存在問題。 工具欄為其ConfirmDeny按鈕( .confirmationAction.cancellationAction )使用語義放置。 但是,僅顯示Confirm按鈕。

誰能告訴我為什么MainToolbarView上顯示了兩個按鈕,而PresentedView工具欄上只有一個按鈕? 我試過更改按鈕的順序,將兩個按鈕變成一個 HStack,甚至嘗試使用位置放置。 這些選項都不適合我。

import SwiftUI
import PlaygroundSupport

struct MainToolbarView: View {

    @State private var buttonIdentifier = "initial state"
    @State private var showSheet = false

    var body: some View {
        NavigationView {
            VStack {
                Spacer()
                Text( $buttonIdentifier.wrappedValue )
                Spacer()
                Button( "Present Sheet" )
                    { showSheet = true }
                Spacer()
            }
            .toolbar {
                ToolbarItem( placement: .navigationBarLeading )
                    { Button( "Save", action: reportSave ) }
                ToolbarItem( placement: .navigationBarTrailing )
                    { Button( "Cancel", action: reportCancel ) }
            }
            .navigationBarTitle( "MAIN" )
        }
        .sheet(isPresented: $showSheet )
            { PresentedView(buttonIdentifier: $buttonIdentifier ) }
    }
    private func reportSave()
    {
        buttonIdentifier = "save"
    }

    private func reportCancel()
    {
        buttonIdentifier = "cancel"
    }
}


struct PresentedView: View {

    // MARK: API
    @Binding var buttonIdentifier: String

    // MARK: instance variables
    @Environment( \.presentationMode ) var mode

    //.confirmationAction

    var body: some View {
        NavigationView {
            Text( "Tap action buttons" )
                .toolbar {
                    ToolbarItem( placement: .confirmationAction )
                        { Button( "Confirm", action: reportConfirm ) }
                    ToolbarItem( placement: .cancellationAction )
                        { Button( "Deny", action: reportDenied ) }
                }
                .navigationBarTitle( "SHEET" )
        }
    }

    private func reportDenied() {
        buttonIdentifier = "sheet denied"
        self.mode.wrappedValue.dismiss()
    }

    private func reportConfirm() {
        buttonIdentifier = "sheet confirmed"
        self.mode.wrappedValue.dismiss()
    }
}


 PlaygroundPage.current.setLiveView( MainToolbarView() )

`

我認為訣竅(對我來說是一個錯誤)是使用 .navigationBarBackButtonHidden(true) 修飾符。 使用它之后(將其添加到下方。navigationBarTitle("SHEET")),我看到了兩個按鈕。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM