swift中UIButton的簡單使用
UIButton是我們經常用的一個控制元件,它是繼承自UIControl的,下面就總結一下相關屬性及用法:
1.UIButton的建立
a.不帶樣式的:
let btn: UIButton = UIButton()
b.帶樣式的:
let btns:UIButton =UIButton(type: UIButtonType);
其中UIButtonType是一個列舉如下所示:
publicenum UIButtonType :Int { case Custom // no button type 自定義樣式按鈕 @available(iOS 7.0, *) case System // standard system button //系統的樣式按鈕 case DetailDisclosure case InfoLight case InfoDark case ContactAdd//聯絡人按鈕 public staticvar RoundedRect: UIButtonType { get }// Deprecated, use UIButtonTypeSystem instead }
用法如下:
let btn: UIButton = UIButton(type: .Custom)
2.UIButton設定字內容和顏色
btn.setTitle("按鈕", forState: .Normal)
btn.setTitleColor(UIColor.whiteColor(), forState: .Normal)
3.UIButton設定背景顏色和背景圖片
btn.backgroundColor =UIColor.blackColor()
btn.setBackgroundImage(UIImage(named:
4.UIButton設定字型大小
btn.titleLabel?.font =UIFont.systemFontOfSize(20)
5.禁用UIButton
btn.enabled =false//禁止按鈕,預設為true
6.設定圓角
btn.layer.cornerRadius = 8
7.設定背景圖片為圓角(因為我們直接設定UIButton圓角時,圖片不會變為圓角)
buttonImage.setImage(UIImage(named:"1")
, forState: UIControlState.Normal)
//設定背景圖片為圓角
buttonImage.imageView?.layer.cornerRadius = 50
8.在UIButton上新增圖片和文字,有時需要我們調整,此時需要:
方向為逆時針方向,上、左、下、右依次去設定的
btn.imageEdgeInsets =UIEdgeInsetsMake(top: CGFloat, left: CGFloat, bottom: CGFloat, right: CGFloat)
btn.titleEdgeInsets =UIEdgeInsetsMake(top: CGFloat, left: CGFloat, bottom: CGFloat, right: CGFloat)
例子如下:
//建立一個圖片一個文字的按鈕
let btn2: UIButton = UIButton(type: .Custom)
btn2.frame = CGRectMake(50, 100, 120, 35)
btn2.setImage(UIImage(named: "1"), forState: .Normal)
btn2.backgroundColor = UIColor.blackColor()
btn2.titleLabel?.font = UIFont.systemFontOfSize(20)
btn2.imageView?.contentMode = UIViewContentMode.ScaleAspectFit
btn2.setTitle("圖片按鈕", forState: .Normal)
//偏移量,分別為上下左右
btn2.imageEdgeInsets = UIEdgeInsetsMake(0, -50, 0, 0)
btn2.titleEdgeInsets = UIEdgeInsetsMake(0, -80, 0, 5)
btn2.setTitleColor(UIColor.whiteColor(), forState: .Normal)
btn2.adjustsImageWhenHighlighted = false
self.view.addSubview(btn2)
9.新增按鈕的點選事件
第一種是不帶引數的,第二種是帶引數的
btn.addTarget(self, action:"click", forControlEvents: .TouchUpInside)
btn.addTarget(self, action:"clicks:", forControlEvents: .TouchUpInside)
第一種:
func click(){}
第二種:
func clicks(sender:UIButton){}
寫的程式碼如下:func initButtonView() {
//建立有狀態的按鈕
let btn: UIButton = UIButton(type: .Custom)
btn.frame = CGRectMake(50, 20, 100, 30)
btn.setTitle("點選按鈕", forState: .Selected)
btn.setTitle("未點選", forState: .Normal)
btn.backgroundColor = UIColor.blackColor()
btn.addTarget(self, action: "clickBtn:", forControlEvents: .TouchUpInside)
self.view .addSubview(btn)
//建立無狀態的按鈕
let btn1: UIButton = UIButton()
btn1.frame = CGRectMake(50, 60, 100, 30)
btn1.setTitle("Normal", forState: .Normal)
btn1.backgroundColor = UIColor.blueColor()
self.view.addSubview(btn1)
//建立一個圖片一個文字的按鈕
let btn2: UIButton = UIButton(type: .Custom)
btn2.frame = CGRectMake(50, 100, 120, 35)
btn2.setImage(UIImage(named: "1"), forState: .Normal)
btn2.backgroundColor = UIColor.blackColor()
btn2.titleLabel?.font = UIFont.systemFontOfSize(20)
btn2.imageView?.contentMode = UIViewContentMode.ScaleAspectFit
btn2.setTitle("圖片按鈕", forState: .Normal)
//偏移量,分別為上下左右
btn2.imageEdgeInsets = UIEdgeInsetsMake(0, -50, 0, 0)
btn2.titleEdgeInsets = UIEdgeInsetsMake(0, -80, 0, 5)
btn2.setTitleColor(UIColor.whiteColor(), forState: .Normal)
btn2.adjustsImageWhenHighlighted = false
self.view.addSubview(btn2)
//建立禁止按鈕
let btn3: UIButton = UIButton(type: .Custom)
btn3.frame = CGRectMake(50, 140, 100, 35)
btn3.setTitle("點選按鈕", forState: .Highlighted)
btn3.setTitle("禁止按鈕", forState: .Normal)
btn3.enabled = false //禁止按鈕,預設為true
btn3.setTitleColor(UIColor.redColor(), forState: .Disabled)
btn3.backgroundColor = UIColor.purpleColor()
self.view.addSubview(btn3)
//建立圓角按鈕
let btn4: UIButton = UIButton(type: .Custom)
btn4.frame = CGRectMake(50, 180, 100, 35)
btn4.backgroundColor = UIColor.blackColor()
btn4.setTitle("圓角按鈕 ", forState: .Normal)
btn4.setTitleColor(UIColor.whiteColor(), forState: .Normal)
btn4.layer.cornerRadius = 8
self.view.addSubview(btn4)
//部分圓角按鈕,主要利用layer的mask屬性,在tongguoCAShaperLayer和UIBezierPath來畫
let btn5: UIButton = UIButton(type: .Custom)
btn5.frame = CGRectMake(50, 220, 100, 35)
btn5.backgroundColor = UIColor.blackColor()
btn5.setTitle("部分圓角按鈕", forState: .Normal)
btn5.setTitleColor(UIColor.whiteColor(), forState: .Normal)
let shape: CAShapeLayer = CAShapeLayer()
let bepath: UIBezierPath = UIBezierPath(roundedRect: btn5.bounds, byRoundingCorners: [UIRectCorner.TopRight,UIRectCorner.TopLeft,UIRectCorner.BottomLeft], cornerRadii: CGSize(width: 8, height: 8))
UIColor.blackColor().setStroke()
shape.path = bepath.CGPath
btn5.layer.mask = shape
self.view.addSubview(btn5)
//建立帶邊框的按鈕
let btn6: UIButton = UIButton(type: .Custom)
btn6.frame = CGRectMake(50, 260, 100, 35)
btn6.setTitle("邊框按鈕", forState: .Normal)
btn6.setTitleColor(UIColor.blackColor(), forState: .Normal)
btn6.layer.borderColor = UIColor.blackColor().CGColor
btn6.layer.borderWidth = 1
btn6.layer.cornerRadius = 8
self.view.addSubview(btn6)
//顯示提示資訊的UILabel
labelText = UILabel()
labelText.frame = CGRectMake(50, 300, 100, 44)
labelText.textColor = UIColor.orangeColor()
self.view.addSubview(labelText)
let btns: UIButton = UIButton(type: .Custom)
btns.frame = CGRectMake(<#T##x: CGFloat##CGFloat#>, <#T##y: CGFloat##CGFloat#>, <#T##width: CGFloat##CGFloat#>, <#T##height: CGFloat##CGFloat#>)
btn.setTitle("按鈕", forState: .Normal)
btn.setTitleColor(UIColor.whiteColor(), forState: .Normal)
btn.backgroundColor = UIColor.blackColor()
btn.setBackgroundImage(UIImage(named: "1"), forState: .Normal)
btn.imageEdgeInsets = UIEdgeInsetsMake(<#T##top: CGFloat##CGFloat#>, <#T##left: CGFloat##CGFloat#>, <#T##bottom: CGFloat##CGFloat#>, <#T##right: CGFloat##CGFloat#>)
btn.titleEdgeInsets = UIEdgeInsetsMake(<#T##top: CGFloat##CGFloat#>, <#T##left: CGFloat##CGFloat#>, <#T##bottom: CGFloat##CGFloat#>, <#T##right: CGFloat##CGFloat#>)
btn.addTarget(self, action: "click", forControlEvents: .TouchUpInside)
}
func clickBtn(sender: UIButton){
sender.selected = !sender.selected
labelText.text = "點選了按鈕"
}
效果圖如下: