Button是一个用户界面对象,单击该按钮即可将操作消息发送到目标。它的大部分工作都由NSButtonCell
处理,当NSButtonCell
实例被单击时,捕获到鼠标按下事件,实例会将动作消息发送到其目标。
按钮类型
cocoa为NSButton
实现很多不同类型,按钮类型决定按钮的行为,按钮类型分为三类:
- 按下按钮
- 粘性按钮
- 单选按钮和复选框
我们可以通过setButtonType:
方法来设置按钮类型:
lazy var button: NSButton = {
let button = NSButton()
button.setButtonType(.pushOnPushOff)
return button
}()
按下按钮
按下按钮对于触发操作最有用,因为它们不显示其状态。点击时,它们会更改其外观;取消点击时,则会恢复原始外观。
我们可以通过设置Button的Type为NSButtonTypeMomentaryPushIn
来设置成按下按钮:
lazy var button: NSButton = {
let button = NSButton(title: "button", target: self, action: #selector(click))
button.setButtonType(.momentaryPushIn)
button.frame = NSRect(x: 18, y: 100, width: 70, height: 25)
return button
}()
要控制自己按下按钮的外观,可使用NSMomentaryChangeButton
。按下鼠标按钮时,它将显示替代图像和标题。释放鼠标按钮时,它将显示正常图像和标题。如未设置,则其外观不会改变:
lazy var button1: NSButton = {
let button = NSButton()
button.setButtonType(.momentaryChange)
button.title = "button"
button.alternateTitle = "Change"
button.bezelStyle = .regularSquare
button.frame = NSRect(x: 18, y: 100, width: 70, height: 25)
return button
}()
粘性按钮
粘性按钮在按下时保留状态。点击一个后,它会保存按下状态,直到下次点击恢复。我们可以通过设置Button的Type为NSPushOnPushOffButton
来设置成按下按钮:
lazy var onOrOffButton: NSButton = {
let button = NSButton()
button.setButtonType(.pushOnPushOff)
button.title = "button"
button.frame = NSRect(x: 210, y: 70, width: 70, height: 25)
button.bezelStyle = .rounded
return button
}()
我们可以通过state
属性获取按钮的状态,判断按钮是否已经被选中。对于这个粘性按钮,对于显示应用程序中某些内容的状态(例如:Office Word 中是否为粗体的按钮)很有用。
要控制自己粘性按钮的外观,可使用NSToggleButton
。点击一个后,它将显示替代图像和标题。直到下次点击恢复时,它将显示正常图像和标题。如未设置,则其外观不会改变。用于两个状态(例如,“停止”和“开始”)之间切换有效:
lazy var toggleButton: NSButton = {
let button = NSButton()
button.action = #selector(click)
button.setButtonType(.toggle)
button.title = "start"
button.alternateTitle = "stop"
button.frame = NSRect(x: 290, y: 70, width: 70, height: 25)
button.bezelStyle = .regularSquare
return button
}()
单选按钮和复选框
单选按钮和复选框主要是区分某些内容的状态,它们是NSToggleButton
系统定义图标的专用版本。
复选框是可以在多个选项中选择多项,Button通过设置类型为NSButtonTypeSwitch
,让它看起来像一个复选框:
实现代码如下:
lazy var switchBtnView: NSView = {
let v = NSView(frame: NSRect(x: 70, y: 90, width: 80, height: 200))
let b1 = NSButton(title: "红色", target: self, action: #selector(click))
b1.setButtonType(.switch)
b1.frame = NSRect(x: 5, y: 100, width: 70, height: 25)
v.addSubview(b1)
let b2 = NSButton(title: "绿色", target: self, action: #selector(click))
b2.setButtonType(.switch)
b2.frame = NSRect(x: 5, y: 130, width: 70, height: 25)
v.addSubview(b2)
let b3 = NSButton(title: "蓝色", target: self, action: #selector(click))
b3.setButtonType(.switch)
b3.frame = NSRect(x: 5, y: 160, width: 70, height: 25)
v.addSubview(b3)
return v
}()
单选按钮是可以在多个选项中选择一项,我们可能通过将多个Button类型设置为NSButtonTypeSwitch
,并将它们加在同一个superview,达到多苦单选的效果:
实现代码如下:
lazy var radioBtnView: NSView = {
let v = NSView(frame: NSRect(x: 70, y: 90, width: 80, height: 200))
let b1 = NSButton(title: "红色", target: self, action: #selector(click))
b1.setButtonType(.radio)
b1.frame = NSRect(x: 5, y: 100, width: 70, height: 25)
v.addSubview(b1)
let b2 = NSButton(title: "绿色", target: self, action: #selector(click))
b2.setButtonType(.radio)
b2.frame = NSRect(x: 5, y: 130, width: 70, height: 25)
v.addSubview(b2)
let b3 = NSButton(title: "蓝色", target: self, action: #selector(click))
b3.setButtonType(.radio)
b3.frame = NSRect(x: 5, y: 160, width: 70, height: 25)
v.addSubview(b3)
return v
}()
按钮的使用
处理点击事件
我们可以通过action
属性给按钮设置处理点击事件,同时也可以设置target
来指定处理对象:
lazy var toggleButton: NSButton = {
let button = NSButton()
button.action = #selector(click)
button.title = "start"
}()
@objc private func click(_ sender: NSButton) {
print("click button")
}
设置边框的外观
我们可以通过更改按钮的形状和阴影来控制按钮的边框。通过设置isBordered
来控制是否显示 边框。如若要改边框的形状,请使用更改按钮的边框类型bezelStyle:
。边框类型有两个主要类型:
- 如果您的按钮主要由文本标识,请使用
NSRoundedBezelStyle
。它为文本按钮使用适当的边框样式,这是一个圆角矩形; - 如果您的按钮主要是鉴定一个图标,使用
NSRegularSquareBezelStyle
,NSThickSquareBezelStyle
或NSThickerSquareBezelStyle
。
设置按钮的标题
按钮可以具有两个与之关联的标题:正常和交替。如果按钮类型NSMomentaryPushInButton
,NSPushOnPushOffButton
,NSMomentaryLightButton
,或者NSOnOffButton
,是不断显示只有正常称号。如果按钮类型为NSMomentaryChangeButton
或NSToggleButton
,则在按钮状态为关闭(NSOffState
)时显示普通标题,
如果标题只包含纯文本,使用setTitle:或setAlternateTitle:
设置标题。如果希望标题包含样式文本,则使用setAttributedTitle:
或setAttributedAlternateTitle:
设置标题。
如果要设置标题的字体,可使用setFont:
按钮标题的字体。
设置按钮的图像
一个按钮可以具有两个与之关联的图像:正常和交替。如果按钮类是NSMomentaryPushInButton
,NSPushOnPushOffButton
,NSMomentaryLightButton
,或NSOnOffButton
,只会显示正常图像。如果按钮类型为NSMomentaryChangeButton
或NSToggleButton
,则在按钮状态为关闭(NSOffState
)时显示正常图像。
注意: 如果按钮是复选框或单选按钮,请勿更改其图像。这些按钮的图像是系统定义的,更改它们可能会导致不可预测的结果。
如果要设置按钮图像的位置,请使用imagePosition
,并使用以下值之一。默认是noImage
,具体作用如下:
public enum ImagePosition : UInt {
case noImage // 没有图片
case imageOnly // 只有图片
case imageLeft // 左图右文
case imageRight // 左文右图
case imageBelow // 上文下图
case imageAbove // 上图下文
case imageOverlaps // 底层图,上层文,重叠
@available(OSX 10.12, *)
case imageLeading
@available(OSX 10.12, *)
case imageTrailing
}
隐藏按钮
按键钮有两种隐藏视图的方法:使它完全透明的,或者仅当鼠标悬停在其上方时才可以显示其边框。
若要使按钮透明,请使用
isTransparent
。透明按钮可跟踪鼠标并发送其动作,但不会自行绘制。若要在按钮处于活动状态或鼠标悬停在其上方时才显示其边框,请使用
showsBorderOnlyWhileMouseInside
。
默认按钮
当按钮设置为默认按钮。当用户按下Return键时,默认按钮会跳动,并调用其操作消息。若要将按钮标记为默认按钮,请将其keyEquivalent
设置为Return ,如下所示:
button.keyEquivalent = "\r"
默认按钮周围有一个粗略的轮廓,位于按钮的边框之外。界面设计时应考虑到额外的空间。
等效键
按钮可以设置一个等效的键,当用户按下该键时,该按钮的响应与被点击一样。需要注意,如果将键设置为等效于Return,则该按钮将成为默认按钮。
我们可以通过keyEquivalent
来设置等效键。例如,要将其设置为Return,则可使用:
button.keyEquivalent = "\r"
若要将按钮的键设置为等效于非打印字符,可以使用由定义的键常数,如以下示例所示,该常数将按钮的键设置为等效于左箭头键:
var array = [unichar(NSLeftArrowFunctionKey)]
button.keyEquivalent = NSString(characters: array, length: 1) as String
小结
NSButton
相对iOS中的UIButton
会更强大,功能也更复杂,在macOS开发中用得最多的组件之一。在接下来的一节我们来聊聊NSImageView
。完整的源码请访问这里:https://github.com/dengyhgit/macOS-Dev-Demo/tree/master/NSButton, 如对你有帮忙,别忘点亮小⭐⭐。