UIViewの上辺だけに枠線をつけたい
TabBarを自作のUIViewで実装する機会があり、Viewの上線だけをつけたかったのですが、あまり調べても出てこなかったので書いておきます。ちなみにこんな感じのものを想定(見づらいですが上辺だけボーダー線が付いてます)。
コード
ViewController.swift
import UIKit
class ViewController: UIViewController {
override func viewDidLoad() {
super.viewDidLoad()
// Do any additional setup after loading the view, typically from a nib.
self.view.backgroundColor = UIColor.cyan
//UIViewを作成
let myView = UIView()
myView.frame = CGRect(x: 0, y: 0, width: self.view.frame.width/2, height: self.view.frame.height/2)
myView.center = CGPoint(x: self.view.frame.midX, y: self.view.frame.midY)
myView.backgroundColor = .white
self.view.addSubview(myView)
//上線のCALayerを作成
let topBorder = CALayer()
topBorder.frame = CGRect(x: 0, y: 0, width: myView.frame.width, height: 1.0)
topBorder.backgroundColor = UIColor.lightGray.cgColor
//作成したViewに上線を追加
myView.layer.addSublayer(topBorder)
}
override func didReceiveMemoryWarning() {
super.didReceiveMemoryWarning()
// Dispose of any resources that can be recreated.
}
}
CALayerで枠線を生成してそれをViewに載っけるという方法。CALayer.frameのwidthもしくはheightで線の太さを調整という形(左辺か右辺か、上辺か下辺かで変わる)。ちなみに以下のように左辺の線なんかも追加すればつけたいところにつけることができる。
ViewController.swift
//UIViewを作成
let myView = UIView()
myView.frame = CGRect(x: 0, y: 0, width: self.view.frame.width/2, height: self.view.frame.height/2)
myView.center = CGPoint(x: self.view.frame.midX, y: self.view.frame.midY)
myView.backgroundColor = .white
self.view.addSubview(myView)
//上線のCALayerを作成
let topBorder = CALayer()
topBorder.frame = CGRect(x: 0, y: 0, width: myView.frame.width, height: 1.0)
topBorder.backgroundColor = UIColor.lightGray.cgColor
//左線のCALayerを作成
let leftBorder = CALayer()
leftBorder.frame = CGRect(x: 0, y: 0, width: 1.0, height:myView.frame.height)
leftBorder.backgroundColor = UIColor.lightGray.cgColor
/*
//下線のCALayerを作成
let bottomBorder = CALayer()
bottomBorder.frame = CGRect(x: 0, y: myView.frame.height, width: myView.frame.width, height:1.0)
bottomBorder.backgroundColor = UIColor.lightGray.cgColor
//右線のCALayerを作成
let rightBorder = CALayer()
rightBorder.frame = CGRect(x: myView.frame.width, y: 0, width: 1.0, height:myView.frame.height)
rightBorder.backgroundColor = UIColor.lightGray.cgColor
*/
//作成したViewに上線を追加
myView.layer.addSublayer(topBorder)
//作成したViewに左線を追加
myView.layer.addSublayer(leftBorder)
まとめ
とりあえずViewのLayerに乗っければいいんじゃないのということで実装してみたら出来たのでこれでやってますが、何か他にいい方法があれば教えていただきたい。