도형(UIView)의 표시 위치를 조작하는【Swift3.0】

UIView의 표시 위치에 관한 기본 사항을 둔다면, 예를 들면 배너 광고를 표시할 때, 광고업체의 SDK에서 제공되는 배너 광고의 대부분은 UIView를 상속하고 있으므로 임의의 장소에 표시시킬 수 있다 할 수 있습니다. 라고 할까 거의 배너 광고용의 기사입니다.

전제

self는 ViewController의 인스턴스입니다.

self.view.bounds.width는 화면 너비입니다.

self.view.bounds.height는 화면 높이입니다

사각형 표시

사각형을 표시해 봅니다. 표시 위치를 확정시키려면 , frame property에, CGRect 메소드로 구형의 좌각의 좌표 (x, y), 및 폭과 높이 (width, height)를 세트 합니다. 여기에서는 가로폭 320px, 높이 50px의 구형을 정의하고 있습니다.

// 左寄せ・画面上部に表示
let rect1 = UIView()
rect1.frame = CGRect(x:0,y:0,width:320,height:50)
rect1.backgroundColor = UIColor.orange
self.view.addSubview(rect1)

가로폭을 화면 채우기

사각형의 너비를 화면 크기로 채우려면 CGRect width에 화면 가로 너비 (self.view.bounds.width)를 지정합니다.

// 幅＝画面の幅
let rect2 = UIView()
rect2.frame = CGRect(x:0,y:100,width:self.view.bounds.width,height:50)
rect2.backgroundColor = UIColor.green
self.view.addSubview(rect2)

오른쪽 맞추기

오른쪽 정렬하려면 CGRect x에 화면의 가로 너비와 사각형 자체의 가로 너비의 차이 (self.view.bounds.width-320)를 설정합니다.

// 右寄せ
let rect3 = UIView()
rect3.frame = CGRect(x:(self.view.bounds.width-320),y:200,width:320,height:50)
rect3.backgroundColor = UIColor.red
self.view.addSubview(rect3)

센터링하다

센터링으로 하려면 CGRect의 x에 화면의 가로폭과 구형 자신의 가로폭의 차이를 2분할한 값((self.view.bounds.width-320)/2)을 설정합니다.

// 中央寄せ
let rect4 = UIView()
rect4.frame = CGRect(x:((self.view.bounds.width-320)/2),y:300,width:320,height:50)
rect4.backgroundColor = UIColor.yellow
self.view.addSubview(rect4)

하단에 표시

하단에 표시하려면 CGRect의 y에 화면 높이와 직사각형 높이의 차이(self.view.bounds.height-50)를 지정합니다.

// 中央寄せ・下部に表示
let rect5 = UIView()
rect5.frame = CGRect(x:((self.view.bounds.width-320)/2),y:(self.view.bounds.height-50),width:320,height:50)
rect5.backgroundColor = UIColor.blue
self.view.addSubview(rect5)

코드 전체

//
//  ViewController.swift
//  ViewPosition
//
//

import UIKit

class ViewController: UIViewController {

    override func viewDidLoad() {
        super.viewDidLoad()

        // 上部左角に表示・幅、高さ固定
        let rect1 = UIView()
        rect1.frame = CGRect(x:0,y:0,width:320,height:50)
        rect1.backgroundColor = UIColor.orange
        self.view.addSubview(rect1)

        // 幅＝画面の幅
        let rect2 = UIView()
        rect2.frame = CGRect(x:0,y:100,width:self.view.bounds.width,height:50)
        rect2.backgroundColor = UIColor.green
        self.view.addSubview(rect2)

        // 右寄せ
        let rect3 = UIView()
        rect3.frame = CGRect(x:(self.view.bounds.width-320),y:200,width:320,height:50)
        rect3.backgroundColor = UIColor.red
        self.view.addSubview(rect3)

        // センタリング
        let rect4 = UIView()
        rect4.frame = CGRect(x:((self.view.bounds.width-320)/2),y:300,width:320,height:50)
        rect4.backgroundColor = UIColor.yellow
        self.view.addSubview(rect4)

        // センタリング & 下部に表示
        let rect5 = UIView()
        rect5.frame = CGRect(x:((self.view.bounds.width-320)/2),y:(self.view.bounds.height-50),width:320,height:50)
        rect5.backgroundColor = UIColor.blue
        self.view.addSubview(rect5)

    }

    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
    }

}

실행 결과

보충

UIView는 frame을 매개 변수로 한 생성자 (init)가 존재하므로 이렇게 쓸 수도 있습니다.

let rect1 = UIView(frame:CGRect(x:0,y:0,width:320,height:50))