diff --git a/atom/browser/ui/cocoa/atom_touch_bar.mm b/atom/browser/ui/cocoa/atom_touch_bar.mm index a21fbc5497a3..30a3e6643fb8 100644 --- a/atom/browser/ui/cocoa/atom_touch_bar.mm +++ b/atom/browser/ui/cocoa/atom_touch_bar.mm @@ -224,6 +224,7 @@ static NSString* const ImageScrubberItemIdentifier = @"scrubber.image.item"; NSString* item_id = [NSString stringWithFormat:@"%ld", ((NSSegmentedControl*)sender).tag]; base::DictionaryValue details; details.SetInteger("selectedIndex", ((NSSegmentedControl*)sender).selectedSegment); + details.SetBoolean("isSelected", [((NSSegmentedControl*)sender) isSelectedForSegment:((NSSegmentedControl*)sender).selectedSegment]); window_->NotifyTouchBarItemInteraction([item_id UTF8String], details); } @@ -520,6 +521,15 @@ static NSString* const ImageScrubberItemIdentifier = @"scrubber.image.item"; else control.segmentStyle = NSSegmentStyleAutomatic; + std::string segmentMode; + settings.Get("mode", &segmentMode); + if (segmentMode == "multiple") + control.trackingMode = NSSegmentSwitchTrackingSelectAny; + else if (segmentMode == "buttons") + control.trackingMode = NSSegmentSwitchTrackingMomentary; + else + control.trackingMode = NSSegmentSwitchTrackingSelectOne; + std::vector segments; settings.Get("segments", &segments); diff --git a/docs/api/touch-bar-segmented-control.md b/docs/api/touch-bar-segmented-control.md index 42be09079082..986fee4929f8 100644 --- a/docs/api/touch-bar-segmented-control.md +++ b/docs/api/touch-bar-segmented-control.md @@ -21,10 +21,15 @@ Process: [Main](../tutorial/quick-start.md#main-process) * `small-square` - The control is displayed using the small square style. * `separated` - The segments in the control are displayed very close to each other but not touching. - * `segments` [SegmentedControlSegment[]](structures/segmented-control-segment.md) - An array of segments to place in this control - * `selectedIndex` Integer (Optional) - The index of the currently selected segment, will update automatically with user interaction + * `mode` String - (Optional) The selection mode of the control: + * `single` - Default. One item selected at a time, selecting one deselects the previously selected item. + * `multiple` - Multiple items can be selected at a time. + * `buttons` - Make the segments act as buttons, each segment can be pressed and released but never marked as active. + * `segments` [SegmentedControlSegment[]](structures/segmented-control-segment.md) - An array of segments to place in this control. + * `selectedIndex` Integer (Optional) - The index of the currently selected segment, will update automatically with user interaction. When the mode is multiple it will be the last selected item. * `change` Function - Called when the user selects a new segment - * `selectedIndex` Integer - The index of the segment the user selected + * `selectedIndex` Integer - The index of the segment the user selected. + * `isSelected` Boolean - Whether as a result of user selection the segment is selected or not. ### Instance Properties diff --git a/lib/browser/api/touch-bar.js b/lib/browser/api/touch-bar.js index 4bb129449eb9..ae0c1f1428b4 100644 --- a/lib/browser/api/touch-bar.js +++ b/lib/browser/api/touch-bar.js @@ -264,16 +264,17 @@ TouchBar.TouchBarSegmentedControl = class TouchBarSegmentedControl extends Touch constructor (config) { super() if (config == null) config = {} - const {segmentStyle, segments, selectedIndex, change} = config + const {segmentStyle, segments, selectedIndex, change, mode} = config this.type = 'segmented_control' this._addLiveProperty('segmentStyle', segmentStyle) this._addLiveProperty('segments', segments || []) this._addLiveProperty('selectedIndex', selectedIndex) + this._addLiveProperty('mode', mode) if (typeof change === 'function') { this.onInteraction = (details) => { this._selectedIndex = details.selectedIndex - change(details.selectedIndex) + change(details.selectedIndex, details.isSelected) } } }