How to make iOS App fullscreen using SwiftUI views?

How to make iOS App fullscreen using SwiftUI views?

如何使用 SwiftUI 视图让 iOS App 全屏显示？

iPad 全屏时钟

自开发 App，无广告，纯净版 🚀

...todo

SwiftUI x fullscreen API

fullScreenCover

nonisolated
func fullScreenCover<Content>(
    isPresented: Binding<Bool>,
    onDismiss: (() -> Void)? = nil,
    @ViewBuilder content: @escaping () -> Content
) -> some View where Content : View

https://developer.apple.com/documentation/swiftui/view/fullscreencover(ispresented:ondismiss:content:)

nonisolated
func fullScreenCover<Item, Content>(
    item: Binding<Item?>,
    onDismiss: (() -> Void)? = nil,
    @ViewBuilder content: @escaping (Item) -> Content
) -> some View where Item : Identifiable, Content : View

https://developer.apple.com/documentation/swiftui/view/fullscreencover(item:ondismiss:content:)

import SwiftUI


struct FullScreenModalView: View {
  @Environment(\.presentationMode) var presentationMode
  var body: some View {
    VStack {
      Text("Hello, World!")
        .padding()
      Button("Dismiss") {
        presentationMode.wrappedValue.dismiss()
      }
    }
    .frame(maxWidth: .infinity, maxHeight: .infinity)
    .background(Color.red)
    .edgesIgnoringSafeArea(.all)
    .onTapGesture {
      presentationMode.wrappedValue.dismiss()
    }
  }
}



struct ContentView: View {
  @State private var isPresented = false
  var body: some View {
    Button("Show Full Screen Modal") {
      self.isPresented.toggle()
      // isPresented.toggle()
    }
    .fullScreenCover(isPresented: $isPresented, content: FullScreenModalView.init)
  }
}

struct ContentView_Previews: PreviewProvider {
  static var previews: some View {
    ContentView()
  }
}

@main
struct MyApp: App {
  var body: some Scene {
    WindowGroup {
      ContentView()
    }
  }
}

https://www.youtube.com/results?search_query=SwiftUI+Fullscreen

demos

fliqlo / 飞客

收费: $ 0.99 / ¥ 8.0

https://apps.apple.com/cn/app/fliqlo/id900833042?l=en-GB

https://search.bilibili.com/all?vt=61108718&keyword=ipad+桌面时钟

Web 网页版 WKWebView

Fullscreen API

webView.configuration.preferences.isElementFullscreenEnabled = true


webView.loadHTMLString("""
<script>
  button.addEventListener('click', () => {
    canvas.webkitRequestFullscreen()
  }, false);
</script>
…
""", baseURL:nil)


// 👇🏻 use this if you want to customize the full screen transactions in your app
let observation = webView.observe(\.fullscreenState, options: [.new]) { object, change in
  print("fullscreenState: \(object.fullscreenState)")
}

https://wwdcnotes.com/documentation/wwdcnotes/wwdc22-10049-whats-new-in-wkwebview/

refs

---

---

©xgqfrms 2012-2021

www.cnblogs.com/xgqfrms 发布文章使用：只允许注册用户才可以访问！

原创文章，版权所有©️xgqfrms, 禁止转载 🈲️，侵权必究⚠️！

---