【Swift】Auto Layoutで特定のデバイス・画面サイズの時だけ制約を変更する方法

公開日: : iPhoneアプリ開発

20141224-231137.jpg

Auto Layoutで、特定のデバイスや画面サイズの時だけ制約を変更する方法について紹介したいと思います。

    

スポンサード リンク

画面部品を配置して、制約を追加する

まずはストーリーボード上にて、画面部品を配置して、制約を追加します。

    

20141224-224938.jpg

例として、上のピンクのビューは、左・上・右に張り付くように制約を追加します。

    

20141224-225311.jpg

下の緑のビューは、左・下・右に張り付き、高さはピンクのビューと同じ、そしてピンクのビューとの間に24ptの隙間を空けるように制約を追加します。

    

20141224-225639.jpg

この状態でプレビューを確認するとこのようになります。ピンクと緑のビューの隙間は常に一定となりますね。

では例として、iPhone 3.5-inchの時だけ、ピンクと緑のビューの隙間が半分となるようにしてみましょう。

    

隙間の制約のアウトレットを作成する

20141224-230404.jpg

まずは隙間の制約のアウトレットを作成します。隙間の制約をクリックして選択し、Ctrlを押しながらドラッグします。ラベルやテキストフィールドなどのアウトレットの作成方法と同じですね。

    

後は、以下のようにアウトレットを通じて制約の数値(constant)を変更するコードを追加します。

override func viewDidLoad() {
    super.viewDidLoad()
    
    let iPhone5Height:CGFloat = 568
    
    if self.view.bounds.size.height < iPhone5Height {
        verticalSpace.constant /= 2
    }
}

    

以下がその実行結果となります。

20141224-231137.jpg

iPhone 4sの時は、隙間が半分になっているのが分かると思います。

    

@akio0911はこう思った。

今回紹介した方法を使うと、Size Classに比べて制約をより細かく制御できると思います。画面サイズごとにレイアウトを細かく制御したい時にぜひ活用してみて下さい。

ちなみに、Auto Layoutについて理解を深めたい場合は以下の書籍がオススメです。

この記事が気に入ったら「いいね!」しよう

follow us in feedly

Feedlyで最新記事を購読

Twitterで更新情報をゲット!

LINEでご感想・ご要望お送りください!
(スマホでLINEを起動 > 友だち追加 > QRコード)

関連記事

I20160208-152320.jpg

【Swift】privateなタイプメソッド作るなら、privateな関数でも良いかもと思った

structとかclassの中で、ちょっとした処理を担当させるprivateなタイプ

記事を読む

I20160925-163452.jpg

タブバーアイコン非選択時の色を変更する方法【iOS 10】

UITabBarControllerで、タブバーアイコン非選択時の色を変更する方法を紹介します!

記事を読む

I20150720-150147.jpg

Apple Watchアプリを作りたいならこの書籍!「詳細!Apple Watch アプリ開発 入門ノート」

     Apple Watchアプリの作り方を学ぶのにオススメな書籍、「詳細!Apple W

記事を読む

I20150724-135442.jpg

iPhoneのホーム1画面目に置いているオススメなアプリ38本(2015年9月版)

2014年7月に「iPhoneアプリ開発にオススメの本10選(2014年7月版)」という記事

記事を読む

20140807-182914.jpg

【アプリ開発】iOS 8とiOS 7でUIAlertController・UIAlertView・UIActionSheetを切り替えて使う方法

@akio0911です。今までお世話になったUIAlertViewとUIActionShee

記事を読む

I20150721-164252.jpg

【書籍】iPhoneアプリ開発の初心者にオススメの本「詳細! Swift iPhoneアプリ開発 入門ノート」

     Swift 1.1、Xcode 6.1、iOS 8.1に対応している書籍「詳

記事を読む

I20160207-111059.jpg

【Swift】Xcodeで型推論された変数や定数の型を調べる方法

Swiftには、そのデータ型が明らかであれば型を明記する必要が無い「型推論」という機能があります

記事を読む

I20160128-101452.jpg

【解決】Playground execution terminated because the process stopped unexpectedlyが出た時の対処法

Xcodeのプレイグラウンドで「Playground execution terminated

記事を読む

20140905-180905.jpg

英語苦手な人がSwiftを学びたいならこの本を読むといいよ!

アップルのWWDC2014で発表された、iOSおよびOS Xのためのプログラミング言語「Swift」

記事を読む

I20151102-201945.jpg

Swift 2の文法を学べるオススメ本「Swift 2標準ガイドブック」

Swift 2の文法について学べる書籍「Swift 2標準ガイドブック」が発売されたので、紹介し

記事を読む

I20170521-225453.jpg
東京駅八重洲口の「羊肉酒場 悟大」で網焼きジンギスカンを頂きました!

ゆうせいさんと株式会社 大庄さんからご招待頂き、悟大withサッポ

I20170514-165235.jpg
iPhoneと連携できる体重体組成計「Withings Body Cardio」を使ってます

ジムに通い始めて体脂肪率が落ち始めたのをキッカケに、iPhoneと

I20170507-155440.jpg
【派手髪】ハーレイクイン風の髪色に染めてもらいました

2016年10月20日、ハーレイクイン風の髪色に染めてもらいました

I20170504-173110.jpg
【メンズネイル】東京・新宿のネイルサロンでターコイズのホログラムネイルしてもらった

ネイルネタが1年分くらい溜まっているので、ちょっとずつ書いていこう

I20170502-010117.jpg
SNUGGのライトニングケーブルが耐久性高し。8ヶ月使ってますが断線の気配なし!

iPhoneの充電&転送ケーブルであるLightningケーブルっ

→もっと見る

PAGE TOP ↑