一.UIButton基本操作
1.创建按钮
|
1
2
3
|
let btn: UIButton = UIButton()//没有样式let btns:UIButton =UIButton(type: UIButtonType)//有样式let button = UIButton(frame:CGRect(x:10, y:150, width:100, height:30))//简化创建方式 |
UIButtonType有以下类型
|
1
2
3
4
5
6
7
8
9
10
11
12
|
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状态类型
/**
Normal (默认状态)
Highlighted （高亮状态）点击按钮不放
Disabled （使能状态）就是是否可用状态-->禁用的状态才会显现
Selected （选中状态）通过selected属性设置
*/
2、UIButton设置字内容和颜色
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
|
//显示文字button1.setTitle("普通状态", for: .normal)button1.setTitle("高粱状态", for: .highlighted)button1.setTitle("禁用状态", 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)//阴影文字颜色设置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设置背景颜色和背景图片
|
1
2
3
4
|
//背景颜色button2.backgroundColor = UIColor.orange//背景图片 button4.setBackgroundImage(UIImage(named:"XXX"), for: .normal) |
4.UIButton设置字体大小
|
1
|
button.titleLabel?.font = UIFont.systemFont(ofSize: 12) |
5.禁用UIButton
|
1
2
|
button.isEnabled = falsebutton.isEnabled = true |
6.设置圆角
|
1
2
|
button.layer.cornerRadius = 5button.layer.masksToBounds = true |
7.设置边框宽度/颜色
|
1
2
|
button.layer.borderWidth = 2button.layer.borderColor = UIColor.red.cgColor |
8.设置背景图片为圆角
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
|
buttonImage.setImage(UIImage(named:"1") , forState: UIControlState.Normal)//设置背景图片为圆角buttonImage.imageView?.layer.cornerRadius = 50默认情况下按钮会被渲染成单一颜色；系统蓝button.setImage(UIImage(named:"icon1"),forState:.Normal) //设置图标button.adjustsImageWhenHighlighted=false //使触摸模式下按钮也不会变暗（半透明）button.adjustsImageWhenDisabled=false //使禁用模式下按钮也不会变暗（半透明）也可以设置成保留图标原来的颜色let iconImage = UIImage(named:"icon2")?.withRenderingMode(.alwaysOriginal)button.setImage(iconImage, for:.normal) //设置图标button.adjustsImageWhenHighlighted = false //使触摸模式下按钮也不会变暗（半透明）button.adjustsImageWhenDisabled = false //使禁用模式下按钮也不会变暗（半透明） |
9.UIButton上图片和文字调整
UIButton上添加图片和文字，有时需要我们调整方向为逆时针方向，上、左、下、右依次去设置的
|
1
2
3
|
btn.imageEdgeInsets =UIEdgeInsetsMake(top: CGFloat, left: CGFloat, bottom: CGFloat, right: CGFloat)btn.titleEdgeInsets =UIEdgeInsetsMake(top: CGFloat, left: CGFloat, bottom: CGFloat, right: CGFloat) |
实例如下：
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
|
//创建一个图片一个文字的按钮 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 = falseself.view.addSubview(btn2) |
10.添加按钮的点击事件
按钮的触摸时间有以下类型
touchDown：单点触摸按下事件，点触屏幕
touchDownRepeat：多点触摸按下事件，点触计数大于1，按下第2、3或第4根手指的时候
touchDragInside：触摸在控件内拖动时
touchDragOutside：触摸在控件外拖动时
touchDragEnter：触摸从控件之外拖动到内部时
touchDragExit：触摸从控件内部拖动到外部时
touchUpInside：在控件之内触摸并抬起事件
touchUpOutside：在控件之外触摸抬起事件
touchCancel：触摸取消事件，即一次触摸因为放上太多手指而被取消，或者电话打断
|
1
2
3
4
5
6
7
8
9
10
11
|
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的图片文字布局
创建一个按钮且其同时拥有文字和图片属性，会按照系统的默认样式（左图片，右文字）显示。但是有的时候，我们会遇到其他的设计需求，比如：左文字有图片、上文字下图片、上图片下文字等。这个时候就需要我们自定义按钮的显示样式来满足复杂多变的设计需求了。 我自定义了一个按钮的extension来满足以上的功能，代码如下：
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
|
import Foundationimport UIKitenum 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("系统默认的方式") 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使用教程的详细内容，更多关于Swift UIButton的资料请关注服务器之家其它相关文章！
原文链接：https://juejin.im/post/6867394035363872781?utm_source=tuicool&utm_medium=referral
