Merge pull request #9315 from electron/segmented-control-mode
Add mode prop to segmented touch bar control
This commit is contained in:
		
				commit
				
					
						eebae82bc1
					
				
			
		
					 3 changed files with 21 additions and 5 deletions
				
			
		| 
						 | 
				
			
			@ -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<mate::Dictionary> segments;
 | 
			
		||||
  settings.Get("segments", &segments);
 | 
			
		||||
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -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
 | 
			
		||||
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -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)
 | 
			
		||||
      }
 | 
			
		||||
    }
 | 
			
		||||
  }
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
		Loading…
	
	Add table
		Add a link
		
	
		Reference in a new issue