소개

탭바 및 네비게이션
4인치 디자인만으로 3.5인치 iPhone과 iPad에 대응,
디바이스의 표시 영역의 높이가 부족하면 스크롤시키는 방법으로 구현하는 전제입니다.

찾아보면 발견되는 내용이면서, 코딩 빼는 별로 없었기 때문에
정리했습니다.

구성

절차

rootViewController 설정

(1) TabBarController로 NavigationController



(2) (1)에서 지정한 NavigationController로 설정하는 ViewController

ViewController에 배치

여러가지 문제는 일어나지만 최종 설정은 마지막으로 실시합니다.

(3) ScrollView 배치


(4)View 배치
이해하기 쉽도록 backgroudColor에 빨간색을 지정했습니다.

실행 결과

storyboard상은 3.5 인치와 4 인치의 전환으로 신축하고 있는 것처럼 보입니다만・・・

(a) 4인치 표시로 저장 및 실행


(b) 3.5 인치 디스플레이로 저장 및 실행

설정의 영향 고려

결과
원인


iOS7은 NavigationBar 및 TabBar 높이의 영향
Under Top/Bottom Bars ON

스크롤하지 않음
View의 height가 리사이즈했기 때문에?

ViewController 설정 변경

이미지에서 체크박스를 제거합니다.
Ajust Scroll View Insets를 제거하는 것이 현시점에서 베스트인 것 같다.

참고

htp // 쿠에세라 2. 하테나 bぉg. jp/엔트리/2014/01/19/223234
ぃ tp // 이 m / y 지금 / ms / 254c7하면 b7864678246

Constrain 추가

ScrollView의 Top Space, Bottom Space
NavigationBar의 하한(Top Layout Guide)과 TabBar의 상한(Bottom Layout Guide)에 설정되어 있으면
그리고는 아래를 참고로 설정이 가능합니다.
ぃ tp // 이 m / fr m / ms / a b7848305b019 4 아 f96

보기


ScrollView


View(ScrollView에 포함된 분)

사이고에게

storyboard를 3.5 인치 모드로 표시하지만 4 인치로 표시하고 저장합시다.
결과가 같아진다는 것이 아니라면 위험해서 어쩔 수 없습니다.
iOS7에서의 storyboard 이용은, constrains 제외에서는 어려운 인상입니다.

storyboard만으로 화면을 조립할 수 있는 이점

여기에 쓰는 내용만 있으면 프로그래머는 필요 없습니다.
디자이너에게 전부 맡겨집니다.

스크롤 뷰에서 디자인을 결합하는 이점

일단 4 인치 용 디자인 밖에 준비 할 수없는 경우에 유효합니다.
다만, 유저의 편리함이나 그 밖에도 스크롤 뷰를 다용하는 화면 설계에 들러서는 향하지 않는 경우가 있기 때문에
3.5 인치 디자인을 함께 준비하는 것이 가장 좋습니다.

3.5인치용 디자인을 고집

iPhone4 계에서 끝나고, 디자인이라고 생각하는 개발자가 많습니다만
iPad로 표시시켰을 때는 3.5 인치의 디자인이 됩니다.
현시점에서 iPhone6에서의 대처법은 불명료한 곳이 많지만, AutoLayout는 향후의 주류가 되는 것을 재차 인식했습니다.