1. Basic operations of UIButton
1. Create button
let btn: UIButton = UIButton()//No stylelet btns:UIButton =UIButton(type: UIButtonType)//Stylelet button = UIButton(frame:CGRect(x:10, y:150, width:100, height:30))//Simplify creation
UIButtonType has the following types
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
}
//uselet btn: UIButton = UIButton(type: .Custom)
UIButton status type
/**
Normal (default status)
Highlighted (highlighted) Click the button to stop
Disabled (enabled state) means whether the state is available-->Disabled state will appear
Selected (selected) Set through the selected property
*/
2. UIButton sets word content and color
//Show text("Normal State", for: .normal)
("Sorghum status", for: .highlighted)
("Disabled", for: .disabled)
//Show text color(, for: .normal)
(, for: .highlighted)
(, for: .selected)
(, for: .disabled)
//Shadow text color settings(, for: .normal)
(, for: .highlighted)
(, for: .disabled)
(, for: .selected)
Set background colors and background pictures
//Background color = //Background picture(UIImage(named:"XXX"), for: .normal)
Set the font size
?.font = (ofSize: 12)
5. Disable UIButton
= false = true
6. Set rounded corners
= 5 = true
7. Set border width/color
= 2 =
8. Set the background picture to rounded corners
(UIImage(named:"1") , forState: ) //Set the background image as rounded corner?. = 50 By default, the button will be rendered to a single color；System blue (UIImage(named:"icon1"),forState:.Normal) //Set icon=false //Make the button not dimmed in touch mode (semi-transparent)=false //The button will not become dimmed in disable mode (transparent) It can also be set to retain the original color of the icon let iconImage = UIImage(named:"icon2")?.withRenderingMode(.alwaysOriginal) (iconImage, for:.normal) //Set icon = false //Make the button not dimmed in touch mode (semi-transparent) = false //Make the button not dimming in disabled mode（translucent）
Adjustments to the above pictures and text
Add pictures and text on UIButton. Sometimes we need to adjust the direction to counterclockwise, and set it up, left, bottom and right in turn.
=UIEdgeInsetsMake(top: CGFloat, left: CGFloat, bottom: CGFloat, right: CGFloat) =UIEdgeInsetsMake(top: CGFloat, left: CGFloat, bottom: CGFloat, right: CGFloat)
Examples are as follows:
// Create a button for a picture and a textlet btn2: UIButton = UIButton(type: .Custom)
= CGRectMake(50, 100, 120, 35)
(UIImage(named: "1"), forState: .Normal)
= ()
?.font = (20)
?.contentMode =
("Picture Button", forState: .Normal)
//Offsets are up, down, left and right respectively = UIEdgeInsetsMake(0, -50, 0, 0)
= UIEdgeInsetsMake(0, -80, 0, 5)
((), forState: .Normal)
= false
(btn2)
10. Add button click event
There are the following types of touch time for buttons
touchDown: Single touch press event, touch the screen
touchDownRepeat: Multi-touch press event, touch count is greater than 1, when pressing the 2nd, 3rd or 4th finger
touchDragInside: When touching drags inside the control
touchDragOutside: When touching drags outside the control
touchDragEnter: When touching drags from outside the control to inside
touchDragExit: When touching drags from inside the control to outside
touchUpInside: Touch and lift the event inside the control
touchUpOutside: Touch lift event outside the control
touchCancel: Touch Cancel event, i.e., one touch is cancelled because of too many fingers, or the phone is interrupted
(self,action:#selector(methodName), for: .touchUpInside)
(self, action:#selector(someMethod(button:)), for:.touchUpInside)
//superior func methodName() {
print("tapped")
}
//Down func someMethod(button:UIButton) {
print("Who are you? It's actually just a button")
}
2. Custom operations
Picture text layout
Create a button that has both text and picture properties, which will be displayed in the default style of the system (left picture, right text). But sometimes, we will encounter other design needs, such as: the left text includes pictures, the upper text and the upper text and the lower text, etc. At this time, we need to customize the display style of the button to meet the complex and changeable design needs. I have customized a button extension to meet the above functions, the code is as follows:
import Foundation
import UIKit
enum ButtonLayout {
case leftImage
case rightImage
case topImage
case bottomImage
}
extension UIButton {
func setLayoutType(type: ButtonLayout){
let image: UIImage? = ?.image
switch type {
case .leftImage:
print("System default method")
case .rightImage:
= UIEdgeInsets(top:0, left: (?.)!, bottom: 0, right:-(?.)!)
= UIEdgeInsets(top: 0, left: -(image?.)!, bottom: 0, right: (image?.)!)
case .topImage:
= UIEdgeInsets(top:-(?.)!, left: 0, bottom: 0, right:-((?.)!))
//The distance from the image to the right border reduces the width of the image, and the distance from the m margin reduces the height of the text = UIEdgeInsets(top: ((image?.)!), left: -((image?.)!), bottom: 0, right:0)
//The distance from the text to the upper border increases the height of the imageView, the width of the imageView is reduced from the left border, and the distance from the lower border and the right border remains unchanged default:
= UIEdgeInsets(top: (?.)!, left:0, bottom: 0, right:-((?.)!))
//The image distance from the upper margin increases the height of the text. The distance from the right margin reduces the width of the text. = UIEdgeInsets(top: -(image?.)!, left: -(image?.)!, bottom: 0, right: 0)
}
}
}
The above is the detailed content of the Swift UIButton usage tutorial. For more information about Swift UIButton, please follow my other related articles!