반응형
📝 요약 설명
Flutter로 macOS 앱을 개발할 때 기본 창 크기를 설정하고, 앱을 "항상 위에 고정(Always on Top)"으로 띄우는 방법을 소개합니다. 에디터와 앱을 나란히 띄우기 위한 실사용 팁!
🖥️ 문제 상황
Flutter로 macOS 앱을 개발할 때, 앱을 항상 에디터 옆에 띄워놓고 싶었어요.
하지만 앱을 실행하면 매번 이상한 위치에 뜨거나 다른 창 뒤로 가버리는 게 너무 불편했습니다.
그래서 macOS 앱을 항상 위에 고정시키고, 기본 창 크기도 지정하는 방법을 정리해봤습니다.
🔧 해결 방법 요약
- MainFlutterWindow.swift에서 macOS 앱의 창 속성을 직접 설정할 수 있습니다.
- 여기서 창 크기, 창 위치, 항상 위에 고정(floating)을 커스터마이징하면 됩니다.
📁 수정할 파일
macos/Runner/MainFlutterWindow.swift
✅ 최종 코드 예시
import Cocoa
import FlutterMacOS
class MainFlutterWindow: NSWindow {
override func awakeFromNib() {
let flutterViewController = FlutterViewController()
// 원하는 창 크기
let windowWidth: CGFloat = 800
let windowHeight: CGFloat = 600
// 화면 중앙에 창 위치 설정
if let screenFrame = NSScreen.main?.frame {
let originX = (screenFrame.width - windowWidth) / 2
let originY = (screenFrame.height - windowHeight) / 2
let newFrame = NSRect(x: originX, y: originY, width: windowWidth, height: windowHeight)
self.setFrame(newFrame, display: true)
}
// 항상 위에 설정
self.level = .floating
self.contentViewController = flutterViewController
RegisterGeneratedPlugins(registry: flutterViewController)
super.awakeFromNib()
}
}
📌 추가 팁
- self.level = .floating → 이걸 설정하면 앱 창이 항상 다른 창 위에 떠 있어요.
특히 코드 에디터 + 앱 창 나란히 테스트할 때 엄청 편합니다. - self.setFrame(...) → 앱의 기본 위치와 크기를 지정할 수 있습니다.
반응형
✨ 마무리
에디터와 앱을 동시에 띄워놓고 작업할 때, 이 설정 하나로 스트레스가 확 줄었어요.
macOS 앱에서 UI 디버깅 자주 하시는 분들께 꼭 추천드립니다.
필요하면 이미지나 gif 첨부용 예시도 만들어줄 수 있어.
티스토리에 바로 붙여넣을 HTML 포맷도 원해?
반응형
'programing > App' 카테고리의 다른 글
[Flutter]UUID 사용법 완벽 정리 – v1, v4, v5 차이점과 예제까지 (1) | 2025.04.03 |
---|---|
[React] key를 분명히 넣었는데도 Warning이 뜬다면? (Fragment 주의!) (0) | 2025.03.27 |
[React Native/Expo] uuid 사용 시 crypto.getRandomValues() 에러 해결하기 (0) | 2025.03.26 |
[React Native] Cannot read property of undefined – default export vs named export 완전 정복 (0) | 2025.03.26 |
React Native에서 Pressable vs TouchableOpacity: 어떤 걸 써야 할까? (1) | 2025.03.25 |