觸摸欄，如何添加可滾動的按鈕列表？

Question

我想在應用程序的觸摸欄中顯示可滾動的按鈕列表，類似於Safari在輸入地址時顯示收藏夾的方式。

滾動視圖似乎不是標準的TouchBar控件之一。你使用了哪些控件？

Answer 1

如您所知，您將NSTouchBarItem s添加到TouchBar實例以將項目添加到觸摸欄。

爲了添加可滾動列表，創建一個NSScrubber的實例。一旦設置完成，您需要將NSScrubber添加到NSCustomTouchBarItem的自定義實例，最有可能是view屬性。然後，您可以將該項目添加到觸摸欄。一定要閱讀鏈接的文檔。

Answer 2

NSScrollView在TouchBar上實際支持（https://developer.apple.com/reference/appkit/nstouchbar#2587738）。

NSScrubber旨在成爲項目的選取器，類似於分段控制，但具有可滾動列表的附加優點。 NSScrubber還管理它自己突出顯示的狀態，並會吃掉觸摸事件。 通過將它們彈出到滾動視圖中，您可以獲得NSButton的水平滾動列表。下面是使用約束來創建一個NSCustomTouchBarItem一個簡單的例子：

NSScrollView *scrollView = [[NSScrollView alloc] initWithFrame:CGRectMake(0, 0, 400, 30)]; 

    NSMutableDictionary *constraintViews = [NSMutableDictionary dictionary]; 
    NSView *documentView = [[NSView alloc] initWithFrame:NSZeroRect]; 

    NSString *layoutFormat = @"H:|-8-"; 
    NSSize size = NSMakeSize(8, 30); 

    for (int i = 0; i <= 8; i++) { 
    NSString *objectName = [NSString stringWithFormat:@"button%@",@(i)]; 
    NSButton *button = [NSButton buttonWithTitle:objectName 
              target:nil 
              action:nil]; 
    button.translatesAutoresizingMaskIntoConstraints = NO; 
    [documentView addSubview:button]; 

    // Constraint information 
    layoutFormat = [layoutFormat stringByAppendingString:[NSString stringWithFormat:@"[%@]-8-", objectName]]; 
    [constraintViews setObject:button forKey:objectName]; 
    size.width += 8 + button.intrinsicContentSize.width; 
    } 

    layoutFormat = [layoutFormat stringByAppendingString:[NSString stringWithFormat:@"|"]]; 

    NSArray *hConstraints = [NSLayoutConstraint constraintsWithVisualFormat:layoutFormat 
                    options:NSLayoutFormatAlignAllCenterY 
                    metrics:nil 
                    views:constraintViews]; 

    [documentView setFrame:NSMakeRect(0, 0, size.width, size.height)]; 
    [NSLayoutConstraint activateConstraints:hConstraints]; 
    scrollView.documentView = documentView; 

    NSCustomTouchBarItem *item = [[NSCustomTouchBarItem alloc] initWithIdentifier:@"com.TouchBar.scrollButtons"]; 
    item.view = scrollView; 

Answer 3

我剛翻譯的代碼從聖地亞哥吉爾斯威夫特4

let scrollView = NSScrollView(frame: CGRect(x: 0, y: 0, width: 400, height: 30)) 
     var constraintViews: Dictionary<String, Any> = [:] 
     let documentView = NSView(frame: NSZeroRect) 

     var layoutFormat: String = "H:|-8-" 
     var size = NSSize(width: 8, height: 30) 

     for i in 0...8 { 
      let objectName: String = "button\(i)" 
      let button: NSButton = NSButton(title: objectName, target: nil, action: nil) 
      button.translatesAutoresizingMaskIntoConstraints = false 

      documentView.addSubview(button) 

      // Constraint Information 

      layoutFormat += "[\(objectName)]-8-" 
      constraintViews[objectName] = button 
      size.width += 8 + button.intrinsicContentSize.width 


     } 

     layoutFormat += "|" 

     let hConstraints: Array<NSLayoutConstraint> = NSLayoutConstraint.constraints(withVisualFormat: layoutFormat, options: .alignAllCenterY, metrics: nil, views: constraintViews) 

     documentView.frame = NSRect(x: 0, y: 0, width: size.width, height: size.height) 
     NSLayoutConstraint.activate(hConstraints) 

     scrollView.documentView = documentView 

     let item = NSCustomTouchBarItem(identifier: .controlScrubber) 

     item.view = scrollView 

希望這可以幫助別人;-)