nsbuttonnstouchbar

Trigger buttons in Touch Bar when sliding


I have created a Touch Bar with many colourful buttons. The user will often change the color using the buttons. When a button is pressed some graphical elements of the current window change accordingly with the color of the button. I would like that sliding the finger among the buttons the elements will change their color, without having to wait for a "touch up inside" event.

Is there a quick way to do that?

EDIT: I think that a way to do that would be use a button of type momentaryPushIn or to create a class subclassing a button and handing something like a "touch inside" event.

I would prefer the first method but I am finding a very poor documentation.


Solution

  • Since you approved Scrubber solution here it is:

    Firstly you need to screate instance of NSScrubber and insert it into your touch bar. Make sure that selection mode will be fixed.

    yourScrubber.mode = .fixed

    Then for purposes of highlighting(just to see outline be eyes, without this outline showed everything will work correctly) set Selection Overlay Style to .outlineOverlay.

    youtScrubber.mode = .selectionBackgroundStyle = .outlineOverlay
    

    Next set delegates for data source and for selection events.

    yourScrubber.delegate = self
    yourScrubber.dataSource = self
    

    Then return amount of items in scrubber

    public func numberOfItems(for scrubber: NSScrubber) -> Int {
        return 8 
    }
    

    Now you need to insert items(NSScrubberItemView). Which can be also filled with NSScrubberImageItemView or NSScrubberTextItemView or even your custom NSView.

    There are many ways how to fill content of scrubber, for easy case where you will provide images it will look like this:

    public func scrubber(_ scrubber: NSScrubber, viewForItemAt index: Int) -> NSScrubberItemView {
        let itemView = scrubber.makeItem(withIdentifier: "colorIdentifier", owner: nil) as! NSScrubberImageItemView
        itemView.image = yourImage
        return itemView
    }
    

    Now you should be able to see something like this: (I used random images for my scrubber)

    enter image description here

    Also you should be able to visible(if you enabled outline) select items: enter image description here

    Ok and now the most important part, how to get the effect you desire: (use of delegate protocol method)

    public func scrubber(_ scrubber: NSScrubber, didHighlightItemAt highlightedIndex: Int) {
        print("highlight = \(highlightedIndex)")
        //your code here
    }
    

    Which results to something like this: (notice output window) enter image description here

    You can also add spacing between cells be defining cell width:

    func scrubber(_ scrubber: NSScrubber, layout: NSScrubberFlowLayout, sizeForItemAt itemIndex: Int) -> NSSize {
        return NSSize(width: yourWidth, height: 30)
    }
    

    Also maybe you will find use for:

    optional public func scrubber(_ scrubber: NSScrubber, didSelectItemAt selectedIndex: Int)