Table of Contents
- 今回のサンプルの画面はカープカラーからジャイアンツカラーへ遷移します。丸のFA風サンプルになります。
このサンプルの特徴
- ナビゲーションバー(NavigationBar)を非表示
- ナビゲーションバーのバックボタンも非表示
- ナビゲーションバーのタイトルも非表示
- safeareaのカラーを指定
- ステータスバーにもカラーを指定
import SwiftUI
/// メイン画面
struct MainView: View {
@State private var navigationLinkIsActive = false
var body: some View {
NavigationView() {
ZStack {
Color.red.edgesIgnoringSafeArea(.all)
VStack {
Spacer()
Button(action: {
self.navigationLinkIsActive = true
}, label: {
Text("Push")
.font(.largeTitle)
.frame(width: 250, height: 100)
.foregroundColor(Color.white)
.background(Color.red)
.foregroundColor(Color("ColorText"))
.frame(maxWidth: .infinity)
})
NavigationLink(destination: SubView(pushed: $navigationLinkIsActive),
isActive: $navigationLinkIsActive,
label: {
EmptyView()
})
Spacer()
}
.background(Color.white)
.frame(maxWidth: .infinity, maxHeight: .infinity)
.navigationBarBackButtonHidden(true)
}
.navigationBarTitle("")
.navigationBarHidden(true)
}
.navigationBarBackButtonHidden(true)
}
}
/// サブ画面
struct SubView: View {
// @Environment(\.presentationMode) var presentationMode
@Binding var pushed: Bool
var body: some View {
ZStack {
Color.orange.edgesIgnoringSafeArea(.all)
VStack {
Spacer()
Button(action: {
self.pushed = false;
}, label: {
Text("Pop")
.font(.largeTitle)
.frame(width: 250, height: 100)
.foregroundColor(Color.white)
.background(Color.orange)
.foregroundColor(Color("ColorText"))
.frame(maxWidth: .infinity)
})
.navigationBarItems(leading: PopButton() {
self.pushed = false
})
Spacer()
}
.background(Color.black)
.frame(maxWidth: .infinity, maxHeight: .infinity)
.navigationBarBackButtonHidden(true)
}
.navigationBarTitle("")
.navigationBarHidden(true)
.navigationBarBackButtonHidden(true)
}
}
/// Popボタン
struct PopButton: View {
let closure: () -> ()
var body: some View {
Button(action: { self.closure() }) {
EmptyView()
}
}
}
/// プレビュー
struct MainView_Previews: PreviewProvider {
static var previews: some View {
MainView()
}
}