ホーム 技術ログ

コードでUIImageをAutoLayoutする - swift

2017年12月10日

説明

自動レイアウトは、画像に制約を適用することによって実現されます。

 

NSLayoutConstraintを使用します。

 

すべてのデバイスに理想的で美しいデザインを実装することが可能です。

 

以下のコードを試してください。

実装

 

//
//  ViewController.swift
//  test
//
//  Created by ryosuke-hujisawa on 2017/12/06.
//  Copyright © 2017年 ryosuke-hujisawa. All rights reserved.
//  vaaaval@gmail.com

import UIKit

class ViewController: UIViewController {

override func viewDidLoad() {
super.viewDidLoad()

let myImageView:UIImageView = UIImageView()
myImageView.backgroundColor = UIColor.red
myImageView.image = UIImage(named:"sample_dog")!
myImageView.translatesAutoresizingMaskIntoConstraints = false
myImageView.layer.borderColor = UIColor.red.cgColor
myImageView.layer.borderWidth = 10
self.view.addSubview(myImageView)

view.removeConstraints(view.constraints)


view.addConstraint(NSLayoutConstraint(
item: myImageView,
attribute: .top,
relatedBy: .equal,
toItem: view,
attribute: .top,
multiplier: 1,
constant:100)

)

view.addConstraint(NSLayoutConstraint(
item: myImageView,
attribute: .centerX,
relatedBy: .equal,
toItem: view,
attribute: .centerX,
multiplier: 1,
constant:0)
)

view.addConstraint(NSLayoutConstraint(
item: myImageView,
attribute: .height,
relatedBy: .equal,
toItem: view,
attribute: .width,
multiplier: 0.5,
constant:40))

view.addConstraint(NSLayoutConstraint(
item: myImageView,
attribute: .width,
relatedBy: .equal,
toItem: view,
attribute: .width,
multiplier: 0.5,
constant:40))

}

override func didReceiveMemoryWarning() {
    super.didReceiveMemoryWarning()
}
}

 

実行

iPhone SE

スクリーンショット 2017-12-10 9.47.56.png

iPhoneX

スクリーンショット 2017-12-10 9.48.35.png

環境

  • swift
  • swift3
  • swift4
  • ios
  • xcode
  • xcode9
  • AutoLayout
  • UIImage
  • UIImageView
Pocket
LinkedIn にシェア

ご報告

off.tokyoは法人化しました、Web/Mobile コンサルティングのご相談なら、bid companyへお問い合わせください :)

ご提供 sponsor
 

Meee!(ミー)は、ビジネスからプライベート利用まで、個人のスキルを気軽に売り買いできるスキルマーケットです。カテゴリや居住地から、検索することが可能です。

 

ランゲージエクスチェンジは、ネイティブスピーカーと気軽にマッチングできる言語交換プラットフォームです。あなたの地元に住む外国人を探したり、留学や海外移住の前に、現地のネイティブスピーカーと繋がることもできます!

宣伝
 

りょすけトークchは、仕事や私生活をより豊にするYouTubeチャンネルです。文献(本、映画、論文)から役に立つ情報をまとめ、生涯にわたり役に立つ哲学をお届けしています。是非、チャンネル登録してみてね

  • この記事を書いた人

ryosuke-hujisawa

-ホーム, 技術ログ
-, ,

Copyright© off , 2020 All Rights Reserved Powered by AFFINGER5.