Swift UIButton使用教程

更新時間：2020年09月02日 08:58:01 作者：說過的玩笑

這篇文章主要介紹了Swift UIButton的使用方法，幫助大家更好的理解和學習swift編程，感興趣的朋友可以了解下

一.UIButton基本操作

1.創(chuàng)建按鈕

let btn: UIButton = UIButton()//沒有樣式
let btns:UIButton =UIButton(type: UIButtonType)//有樣式
let button = UIButton(frame:CGRect(x:10, y:150, width:100, height:30))//簡化創(chuàng)建方式

UIButtonType有以下類型

public enum 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 static var roundedRect: UIButtonType { get } // Deprecated, use UIButtonTypeSystem instead
}
//使用
let btn: UIButton = UIButton(type: .Custom)

UIButton狀態(tài)類型

/**
Normal (默認狀態(tài))
Highlighted （高亮狀態(tài)）點擊按鈕不放
Disabled （使能狀態(tài)）就是是否可用狀態(tài)-->禁用的狀態(tài)才會顯現(xiàn)
Selected （選中狀態(tài)）通過selected屬性設(shè)置
*/

2、UIButton設(shè)置字內(nèi)容和顏色

//顯示文字
button1.setTitle("普通狀態(tài)", for: .normal)
button1.setTitle("高粱狀態(tài)", for: .highlighted)
button1.setTitle("禁用狀態(tài)", for: .disabled)
//顯示文字顏色
button1.setTitleColor(UIColor.red, for: .normal)
button1.setTitleColor(UIColor.blue, for: .highlighted)
button1.setTitleColor(UIColor.cyan, for: .selected)
button1.setTitleColor(UIColor.cyan, for: .disabled)
//陰影文字顏色設(shè)置
button1.setTitleShadowColor(UIColor.cyan, for: .normal)
button1.setTitleShadowColor(UIColor.green, for: .highlighted)
button1.setTitleShadowColor(UIColor.brown, for: .disabled)
button1.setTitleShadowColor(UIColor.darkGray, for: .selected)

3.UIButton設(shè)置背景顏色和背景圖片

//背景顏色
button2.backgroundColor = UIColor.orange
//背景圖片 
button4.setBackgroundImage(UIImage(named:"XXX"), for: .normal)

4.UIButton設(shè)置字體大小

button.titleLabel?.font = UIFont.systemFont(ofSize: 12)

5.禁用UIButton

button.isEnabled = false
button.isEnabled = true

6.設(shè)置圓角

button.layer.cornerRadius = 5
button.layer.masksToBounds = true

7.設(shè)置邊框?qū)挾?顏色

button.layer.borderWidth = 2
button.layer.borderColor = UIColor.red.cgColor

8.設(shè)置背景圖片為圓角

buttonImage.setImage(UIImage(named:"1") , forState: UIControlState.Normal)
//設(shè)置背景圖片為圓角
buttonImage.imageView?.layer.cornerRadius = 50

默認情況下按鈕會被渲染成單一顏色；系統(tǒng)藍
button.setImage(UIImage(named:"icon1"),forState:.Normal) //設(shè)置圖標
button.adjustsImageWhenHighlighted=false //使觸摸模式下按鈕也不會變暗（半透明）
button.adjustsImageWhenDisabled=false //使禁用模式下按鈕也不會變暗（半透明）

也可以設(shè)置成保留圖標原來的顏色
let iconImage = UIImage(named:"icon2")?.withRenderingMode(.alwaysOriginal)
button.setImage(iconImage, for:.normal) //設(shè)置圖標
button.adjustsImageWhenHighlighted = false //使觸摸模式下按鈕也不會變暗（半透明）
button.adjustsImageWhenDisabled = false //使禁用模式下按鈕也不會變暗（半透明）

9.UIButton上圖片和文字調(diào)整

UIButton上添加圖片和文字，有時需要我們調(diào)整方向為逆時針方向，上、左、下、右依次去設(shè)置的

btn.imageEdgeInsets =UIEdgeInsetsMake(top: CGFloat, left: CGFloat, bottom: CGFloat, right: CGFloat)

btn.titleEdgeInsets =UIEdgeInsetsMake(top: CGFloat, left: CGFloat, bottom: CGFloat, right: CGFloat)

實例如下：

//創(chuàng)建一個圖片一個文字的按鈕 
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)

10.添加按鈕的點擊事件

按鈕的觸摸時間有以下類型

touchDown：單點觸摸按下事件，點觸屏幕
touchDownRepeat：多點觸摸按下事件，點觸計數(shù)大于1，按下第2、3或第4根手指的時候
touchDragInside：觸摸在控件內(nèi)拖動時
touchDragOutside：觸摸在控件外拖動時
touchDragEnter：觸摸從控件之外拖動到內(nèi)部時
touchDragExit：觸摸從控件內(nèi)部拖動到外部時
touchUpInside：在控件之內(nèi)觸摸并抬起事件
touchUpOutside：在控件之外觸摸抬起事件
touchCancel：觸摸取消事件，即一次觸摸因為放上太多手指而被取消，或者電話打斷

button1.addTarget(self,action:#selector(methodName), for: .touchUpInside)
button1.addTarget(self, action:#selector(someMethod(button:)), for:.touchUpInside)
//上
 func methodName() {
  print("tapped")
 }

//下
 func someMethod(button:UIButton) {
  print("你是誰啊，其實就是一個按鈕")
 }

二.自定義操作

1.UIButton的圖片文字布局

創(chuàng)建一個按鈕且其同時擁有文字和圖片屬性，會按照系統(tǒng)的默認樣式（左圖片，右文字）顯示。但是有的時候，我們會遇到其他的設(shè)計需求，比如：左文字有圖片、上文字下圖片、上圖片下文字等。這個時候就需要我們自定義按鈕的顯示樣式來滿足復雜多變的設(shè)計需求了。我自定義了一個按鈕的extension來滿足以上的功能，代碼如下：

import Foundation
import UIKit

enum ButtonLayout {
 case leftImage
 case rightImage
 case topImage
 case bottomImage
}

extension UIButton {
 
 func setLayoutType(type: ButtonLayout){
  let image: UIImage? = self.imageView?.image
  switch type {
  case .leftImage:
   print("系統(tǒng)默認的方式")
  case .rightImage:
   self.imageEdgeInsets = UIEdgeInsets(top:0, left: (self.titleLabel?.frame.size.width)!, bottom: 0, right:-(self.titleLabel?.frame.size.width)!)
   self.titleEdgeInsets = UIEdgeInsets(top: 0, left: -(image?.size.width)!, bottom: 0, right: (image?.size.width)!)
  case .topImage:
   self.imageEdgeInsets = UIEdgeInsets(top:-(self.titleLabel?.frame.size.height)!, left: 0, bottom: 0, right:-((self.titleLabel?.frame.size.width)!))
   //圖片距離右邊框距離減少圖片的寬度，距離上m邊距的距離減少文字的高度
   self.titleEdgeInsets = UIEdgeInsets(top: ((image?.size.height)!), left: -((image?.size.width)!), bottom: 0, right:0)
  //文字距離上邊框的距離增加imageView的高度，距離左邊框減少imageView的寬度，距離下邊框和右邊框距離不變
  default:
   self.imageEdgeInsets = UIEdgeInsets(top: (self.titleLabel?.frame.size.height)!, left:0, bottom: 0, right:-((self.titleLabel?.frame.size.width)!))
   //圖片距離上邊距增加文字的高度 距離右邊距減少文字的寬度
   self.titleEdgeInsets = UIEdgeInsets(top: -(image?.size.height)!, left: -(image?.size.width)!, bottom: 0, right: 0)
  }
 }
}

以上就是Swift UIButton使用教程的詳細內(nèi)容，更多關(guān)于Swift UIButton的資料請關(guān)注腳本之家其它相關(guān)文章！

您可能感興趣的文章: