macOS 開發(fā)-NSButton

Button是一個用戶界面對象，單擊該按鈕即可將操作消息發(fā)送到目標(biāo)。它的大部分工作都由NSButtonCell處理，當(dāng)NSButtonCell實例被單擊時，捕獲到鼠標(biāo)按下事件，實例會將動作消息發(fā)送到其目標(biāo)。

按鈕類型

cocoa為NSButton實現(xiàn)很多不同類型，按鈕類型決定按鈕的行為，按鈕類型分為三類：

  • 按下按鈕
  • 粘性按鈕
  • 單選按鈕和復(fù)選框

我們可以通過setButtonType:方法來設(shè)置按鈕類型:

lazy var button: NSButton = {
    let button = NSButton()
    button.setButtonType(.pushOnPushOff)
    return button
}()

按下按鈕

按下按鈕對于觸發(fā)操作最有用，因為它們不顯示其狀態(tài)。點(diǎn)擊時，它們會更改其外觀；取消點(diǎn)擊時，則會恢復(fù)原始外觀。

01.jpg

我們可以通過設(shè)置Button的Type為NSButtonTypeMomentaryPushIn來設(shè)置成按下按鈕：

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。按下鼠標(biāo)按鈕時，它將顯示替代圖像和標(biāo)題。釋放鼠標(biāo)按鈕時，它將顯示正常圖像和標(biāo)題。如未設(shè)置，則其外觀不會改變：

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
}()

粘性按鈕

粘性按鈕在按下時保留狀態(tài)。點(diǎn)擊一個后，它會保存按下狀態(tài)，直到下次點(diǎn)擊恢復(fù)。我們可以通過設(shè)置Button的Type為NSPushOnPushOffButton來設(shè)置成按下按鈕：

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屬性獲取按鈕的狀態(tài)，判斷按鈕是否已經(jīng)被選中。對于這個粘性按鈕，對于顯示應(yīng)用程序中某些內(nèi)容的狀態(tài)（例如：Office Word 中是否為粗體的按鈕）很有用。

要控制自己粘性按鈕的外觀，可使用NSToggleButton。點(diǎn)擊一個后，它將顯示替代圖像和標(biāo)題。直到下次點(diǎn)擊恢復(fù)時，它將顯示正常圖像和標(biāo)題。如未設(shè)置，則其外觀不會改變。用于兩個狀態(tài)（例如，“停止”和“開始”）之間切換有效：

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
}()

單選按鈕和復(fù)選框

單選按鈕和復(fù)選框主要是區(qū)分某些內(nèi)容的狀態(tài)，它們是NSToggleButton系統(tǒng)定義圖標(biāo)的專用版本。

復(fù)選框是可以在多個選項中選擇多項，Button通過設(shè)置類型為NSButtonTypeSwitch，讓它看起來像一個復(fù)選框：

02.jpg

實現(xiàn)代碼如下：

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: "藍(lán)色", 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類型設(shè)置為NSButtonTypeSwitch，并將它們加在同一個superview，達(dá)到多苦單選的效果：

03.jpg

實現(xiàn)代碼如下：

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: "藍(lán)色", target: self, action: #selector(click))
    b3.setButtonType(.radio)
    b3.frame = NSRect(x: 5, y: 160, width: 70, height: 25)
    v.addSubview(b3)
    return v
}()

按鈕的使用

處理點(diǎn)擊事件

我們可以通過action屬性給按鈕設(shè)置處理點(diǎn)擊事件，同時也可以設(shè)置target來指定處理對象：

lazy var toggleButton: NSButton = {
    let button = NSButton()
    button.action = #selector(click)
    button.title = "start"
}()

@objc private func click(_ sender: NSButton) {
    print("click button")
}

設(shè)置邊框的外觀

我們可以通過更改按鈕的形狀和陰影來控制按鈕的邊框。通過設(shè)置isBordered來控制是否顯示 邊框。如若要改邊框的形狀，請使用更改按鈕的邊框類型bezelStyle:。邊框類型有兩個主要類型：

  1. 如果您的按鈕主要由文本標(biāo)識，請使用NSRoundedBezelStyle。它為文本按鈕使用適當(dāng)?shù)倪吙驑邮剑@是一個圓角矩形；
  2. 如果您的按鈕主要是鑒定一個圖標(biāo)，使用NSRegularSquareBezelStyle，NSThickSquareBezelStyle或NSThickerSquareBezelStyle。

設(shè)置按鈕的標(biāo)題

按鈕可以具有兩個與之關(guān)聯(lián)的標(biāo)題：正常和交替。如果按鈕類型NSMomentaryPushInButton，NSPushOnPushOffButton，NSMomentaryLightButton，或者NSOnOffButton，是不斷顯示只有正常稱號。如果按鈕類型為NSMomentaryChangeButton或NSToggleButton，則在按鈕狀態(tài)為關(guān)閉（NSOffState）時顯示普通標(biāo)題，

如果標(biāo)題只包含純文本，使用setTitle:或setAlternateTitle:設(shè)置標(biāo)題。如果希望標(biāo)題包含樣式文本，則使用setAttributedTitle:或setAttributedAlternateTitle:設(shè)置標(biāo)題。

如果要設(shè)置標(biāo)題的字體，可使用setFont:按鈕標(biāo)題的字體。

設(shè)置按鈕的圖像

一個按鈕可以具有兩個與之關(guān)聯(lián)的圖像：正常和交替。如果按鈕類是NSMomentaryPushInButton，NSPushOnPushOffButton，NSMomentaryLightButton，或NSOnOffButton，只會顯示正常圖像。如果按鈕類型為NSMomentaryChangeButton或NSToggleButton，則在按鈕狀態(tài)為關(guān)閉（NSOffState）時顯示正常圖像。

注意： 如果按鈕是復(fù)選框或單選按鈕，請勿更改其圖像。這些按鈕的圖像是系統(tǒng)定義的，更改它們可能會導(dǎo)致不可預(yù)測的結(jié)果。

如果要設(shè)置按鈕圖像的位置，請使用imagePosition，并使用以下值之一。默認(rèn)是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
}

隱藏按鈕

按鍵鈕有兩種隱藏視圖的方法：使它完全透明的，或者僅當(dāng)鼠標(biāo)懸停在其上方時才可以顯示其邊框。

  • 若要使按鈕透明，請使用isTransparent。透明按鈕可跟蹤鼠標(biāo)并發(fā)送其動作，但不會自行繪制。

  • 若要在按鈕處于活動狀態(tài)或鼠標(biāo)懸停在其上方時才顯示其邊框，請使用showsBorderOnlyWhileMouseInside。

默認(rèn)按鈕

當(dāng)按鈕設(shè)置為默認(rèn)按鈕。當(dāng)用戶按下Return鍵時，默認(rèn)按鈕會跳動，并調(diào)用其操作消息。若要將按鈕標(biāo)記為默認(rèn)按鈕，請將其keyEquivalent設(shè)置為Return ，如下所示：

button.keyEquivalent = "\r"

默認(rèn)按鈕周圍有一個粗略的輪廓，位于按鈕的邊框之外。界面設(shè)計時應(yīng)考慮到額外的空間。

等效鍵

按鈕可以設(shè)置一個等效的鍵，當(dāng)用戶按下該鍵時，該按鈕的響應(yīng)與被點(diǎn)擊一樣。需要注意，如果將鍵設(shè)置為等效于Return，則該按鈕將成為默認(rèn)按鈕。

我們可以通過keyEquivalent來設(shè)置等效鍵。例如，要將其設(shè)置為Return，則可使用：

button.keyEquivalent = "\r"

若要將按鈕的鍵設(shè)置為等效于非打印字符，可以使用由定義的鍵常數(shù)，如以下示例所示，該常數(shù)將按鈕的鍵設(shè)置為等效于左箭頭鍵：

var array = [unichar(NSLeftArrowFunctionKey)]
button.keyEquivalent = NSString(characters: array, length: 1) as String

小結(jié)

NSButton相對iOS中的UIButton會更強(qiáng)大，功能也更復(fù)雜，在macOS開發(fā)中用得最多的組件之一。在接下來的一節(jié)我們來聊聊NSImageView。完整的源碼請訪問這里：https://github.com/dengyhgit/macOS-Dev-Demo/tree/master/NSButton， 如對你有幫忙，別忘點(diǎn)亮小??。

最后編輯于 ：
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成，瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明：文章內(nèi)容（如有圖片或視頻亦包括在內(nèi)）由作者上傳并發(fā)布，文章內(nèi)容僅代表作者本人觀點(diǎn)，簡書系信息發(fā)布平臺，僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容