I am creating a macOs SwiftUI document based app, and I am struggling with the Window sizes and placements. Right now by default, a normal window has the minimize and full screen options which makes the whole window into full screen mode.
However, I don't want to do this for my app. I want to only allow to fill the available width and height, i.e. exclude the status bar and doc when the user press the fill window mode, and also restrict to resize the window beyond a certain point ( which ideally to me is 1200 x 700 because I am developing on macbook air 13.3-inch in which it looks ideal, but resizing it below that makes the entire content inside messed up ).
I want something like this below instead of the default full screen green
When the user presses the button, it should position centered with perfect aspect ratio from my content ( or the one I want like 1200 x 700 ) and can be able to click again to fill the available width and height excluding the status bar and docs.
Here is my entire @main code :-
@main
struct PhiaApp: App {
@NSApplicationDelegateAdaptor(AppDelegate.self) var appDelegate
var body: some Scene {
DocumentGroup(newDocument: PhiaProjectDocument()) { file in
ContentView(
document: file.$document,
rootURL: file.fileURL
)
.configureEditorWindow(disableCapture: true)
.background(AppColors.background)
.preferredColorScheme(.dark)
}
.windowStyle(.hiddenTitleBar)
.windowToolbarStyle(.unified)
.defaultLaunchBehavior(.suppressed)
Settings {
SettingsView()
}
}
}
struct WindowAccessor: NSViewRepresentable {
var callback: (NSWindow?) -> Void
func makeNSView(context: Context) -> NSView {
let view = NSView()
DispatchQueue.main.async { [weak view] in
callback(view?.window)
}
return view
}
func updateNSView(_ nsView: NSView, context: Context) { }
}
extension View {
func configureEditorWindow(disableCapture: Bool = true) -> some View {
self.background(
WindowAccessor { window in
guard let window else { return }
if let screen = window.screen ?? NSScreen.main {
let visible = screen.visibleFrame
window.setFrame(visible, display: true)
window.minSize = visible.size
}
window.isMovable = true
window.isMovableByWindowBackground = false
window.sharingType = disableCapture ? .captureBlocked : .captureAllowed
}
)
}
}
This is a basic setup I did for now, this automatically fills the available width and height on launch, but user can resize and can go beyond my desired min width and height which makes the entire content inside messy.
As I said, I want a native way of doing this, respect the content aspect ratio, don't allow to enter full screen mode, only be able to fill the available width and height excluding the status bar and doc, also don't allow to resize below my desired width and height.
