[TIP] phonegap(cordova) 이용시 아이폰 7.0 이상버전에서 상태바 겹치는 현상 해결

아이폰 7.0 이상부터는 상태바가 투명해지는 바람에.. 그 영역에 웹뷰가 겹치는 현상이 발생한다.

폰갭으로 기본적으로 생성한 프로젝트의 경우 상단 영역이 겹쳐서 버튼도 안눌러지고.. 이상하게 보이고..

그에 대한 해결은 아래와 같은 코드로 간단히 해결할수 있다.

웹뷰를 status bar로 부터 20 픽셀 아래로 이동시키는 코드이다.

MainViewController.m 파일의 viewWillApㅔear 부분에 아래와 같은 코드를 추가해 준다.

if ([[[UIDevice currentDevice] systemVersion] floatValue] >= 7) {

        CGRect viewBounds = [self.webView bounds];

        viewBounds.origin.y = 20;

        viewBounds.size.height = viewBounds.size.height - 20;

        self.webView.frame = viewBounds;

}

적용된 내용은 아래와 같다.

- (void)viewWillAppear:(BOOL)animated {

    // ios7 이상인 경우 웹뷰를 아래쪽으로 20픽셀 이동

    if ([[[UIDevice currentDevice] systemVersion] floatValue] >= 7) {

        CGRect viewBounds = [self.webView bounds];

        viewBounds.origin.y = 20;

        viewBounds.size.height = viewBounds.size.height - 20;

        self.webView.frame = viewBounds;

    }

    [super viewWillAppear:animated];

}

위와 같이 적용하였을때 일반적인 웹뷰상태에서는 잘 동작한다. 하지만 페이스북 연동을 위해 InAppBrowser를 사용하는 경우에 문제가 발생하였다. 페이스북을 호출하여 인앱브라우저가 떴다가 사라지게 되면... 위 코드가 다시 동작하여 하단에 빈 영역이 20픽셀씩 계속 누적되는 버그가 있다..

따라서 위 코드를 viewWillAppear에 두지 말고 viewDidLoad로 옮김으로써 인앱브라우저 사용시의 문제점이 해결되었다.

적용된 내용은 아래와 같다.

- (void)viewDidLoad

{

    [super viewDidLoad];

    // Do any additional setup after loading the view from its nib.

    if ([[[UIDevice currentDevice] systemVersion] floatValue] >= 7) {

        CGRect viewBounds = [self.webView bounds];

        viewBounds.origin.y = 20;

        viewBounds.size.height = viewBounds.size.height - 20;

        self.webView.frame = viewBounds;

    }

}