07. Storyboard 가이드
HONE Smart Platform 은 앱 화면을 구성하기 위한 기본 윈도우로 HMPWindow, HMPPopupWebWindow, HMPWebWindow, HMPPopupWindow 4종류의 Window를 제공한다.
Window는 하나의 UIViewController로 구성되며, 스토리보드를 활용해 자유롭게 Window 구현이 가능하다.
Table. 지원 Window 종류
No | Class Name | Remark |
1 | HMPWindow | 기본 Native Window |
2 | HMPWebWindow | 기본 Web Window |
3 | HMPPopupWindow | 팝업 Native Window |
4 | HMPPopupWebWindow | 팝업 Web Window |
Web Window 개발
1. 스토리보드 생성 (스토리보드 이름 Main으로 가정)
2. Swift Class 생성 (Class 이름 CustomWebWindow로 가정)
이 때, HMPWebWindow를 상속받는다.
Example
class CustomWebWindow: HMPWebWindow {
override func viewDidLoad() {
super.viewDidLoad()
}
@IBAction func onClickClose(_ sender: Any) {
DAPWindow.goBack()
}
}
@end
@implementation CustomWebWindow
- (void)viewDidLoad {
[super viewDidLoad];
}
-(IBAction)onClickClose:(id)sender {
[DAPWindow goBack:^(NSDictionary *resultDict) {
} failure:^(NSError *error) {
}];
}
@end
3. CustomWebWindow 클래스를 스토리보드에 연결 후 Storyboard ID 추가 (mainWeb으로 가정)
4. 스토리보드 셋팅
4-1. WKWebView를 스토리보드에 추가한다.
4-2. 추가한 WKWebView를 해당 뷰의 Outlets으로 연결한다.
4-3. 연결 확인 - Referencing Outlets 을 통해 WebView가 연결되었음을 확인한다.
5. window.json 내 Window 추가
"windows": {
"customMainWeb": {
"layoutName": "Main",
"layoutId": "mainWeb"
}
}
}
6. 결과화면
Web 팝업 Window 개발
1. Swift Class 생성 (Class 이름 CustomWebPopupWindow로 가정)
이 때, HMPPopupWebWindow를 상속받는다.
Example
class CustomPopUpWebWindow: HMPPopupWebWindow {
override func viewDidLoad() {
super.viewDidLoad()
}
@IBAction func onClickClose(_ sender: Any) {
DAPWindow.goBack()
}
}
@end
@implementation CustomWebPopupWindow
- (void)viewDidLoad {
[super viewDidLoad];
}
-(IBAction)onClickClose:(id)sender {
[DAPWindow goBack:^(NSDictionary *resultDict) {
} failure:^(NSError *error) {
}];
}
@end
2. CustomWebPopupWindow 클래스를 스토리보드에 연결 후 Storyboard ID 추가 (mainWebPop으로 가정)
3. 스토리보드 셋팅
WKWebView를 스토리보드에 추가 후 Oulets의 webView에 추가한 WKWebView를 연결한다.
팝업 영역을 제외한 백그라운드를 반투명하게 셋팅한다.
4. window.json 내 Window 추가
"windows": {
"customMainWebPop": {
"layoutName": "Main",
"layoutId": "mainWebPop"
}
}
}
5. 결과화면
네이티브 Window 개발
1. Swift Class 생성 (Class 이름 CustomWindow로 가정)
이 때, HMPWindow를 상속받는다.
Example
class CustomWindow: HMPWindow {
override func viewDidLoad() {
super.viewDidLoad()
}
@IBAction func onClickClose(_ sender: Any) {
DAPWindow.goBack()
}
}
@end
@implementation CustomWindow
- (void)viewDidLoad {
[super viewDidLoad];
}
-(IBAction)onClickClose:(id)sender {
[DAPWindow goBack:^(NSDictionary *resultDict) {
} failure:^(NSError *error) {
}];
}
@end
2. CustomWindow 클래스를 스토리보드에 연결 후 Storyboard ID 추가 (main으로 가정)
3. 스토리보드 셋팅
원하는 네이티브 뷰를 스토리보드에 추가한다.
4. window.json 내 Window 추가
"windows": {
"customMain": {
"layoutName": "Main",
"layoutId": "main"
}
}
}
5. 결과화면
네이티브 팝업 Window 개발
1. Swift Class 생성 (Class 이름 CustomPopupWindow로 가정)
이 때, HMPPopupWindow를 상속받는다.
Example
class CustomPopUpWindow: HMPPopUpWindow {
override func viewDidLoad() {
super.viewDidLoad()
}
@IBAction func onClickClose(_ sender: Any) {
DAPWindow.goBack()
}
}
@end
@implementation CustomPopupWindow
- (void)viewDidLoad {
[super viewDidLoad];
}
-(IBAction)onClickClose:(id)sender {
[DAPWindow goBack:^(NSDictionary *resultDict) {
} failure:^(NSError *error) {
}];
}
@end
2. CustomPopupWindow 클래스를 스토리보드에 연결 후 Storyboard ID 추가 (mainWebPop으로 가정)
3. 스토리보드 셋팅
원하는 네이티브 뷰를 스토리보드에 추가한다.
팝업 영역을 제외한 백그라운드를 반투명하게 셋팅한다.
4. window.json 내 CustomPopupWindow 추가
"windows": {
"customMainPop": {
"layoutName": "Main",
"layoutId": "mainPop"
}
}
}
5. 결과화면