Xcode6でUIWebViewを画面サイズぴったりで表示する

Xcode6でStory Boardを使ってUIWebViewを中央に配置しそのままのレイアウトで実行すると残念な感じになります。

f:id:chitans:20141214215704p:plain

上側はステータスバーに重なり、右側ははみ出し、下側は足りない...これを綺麗に画面に収まるようにします。

まずは、Constraintsの設定をします。下図のように上下左右にConstraintsを張り、上側だけ20(ステータスバーの分だけずらす)、その他は0に設定します。左右を −16に設定して調整する方法もありますが、長さがマイナスというのは気持ちが悪ので、ここではゼロに設定し、Add 4 Constraintsを押します。

f:id:chitans:20141214220421p:plain

これで実行してみます。

f:id:chitans:20141214220544p:plain

左右に16ピクセルのマージンが空いています。次はこの部分を調整します。

Document Outlineを開き、WebViewの下のConstraintsを開きます。

f:id:chitans:20141214221050p:plain

「Horizontal Space - View - Web View」を選択し、Attributes Inspectorを表示し、「 First Item」の「Relative to margin」のチェックを外します。

f:id:chitans:20141214221239p:plain

同様に、「Horizontal Space - Web View - View」を選択し、「Second Item」「のRelative to margin」のチェックを外します。

f:id:chitans:20141214221731p:plain

そして、実行すると、UIWebViewの上下左右が画面サイズぴったりになります。

f:id:chitans:20141214221456p:plain

ちなみにUIWebViewにAppleのサイトを表示するコードはこんな感じです。

- (void)viewDidLoad {
    [super viewDidLoad];
    NSURL *url = [NSURL URLWithString:@"http://www.apple.com/"];
    NSURLRequest *urlReq = [NSURLRequest requestWithURL:url];
    [_webview loadRequest:urlReq];
}