NSSlider NSSliderCell trim user handle

Question

I am creating a custom NSSlider with a custom NSSliderCell. Everything works beautifully, except for a pen. When I drag it to the maximum value, the handle is cropped, I can only see 50% of the image of the handle.

When assigning my custom NSSliderCell, I set the knobThickness to the width of the image, which I use as a slider. I assumed (I think mistakenly) that this takes this into account and stops it from clipping?

Any ideas what I'm doing wrong? The slider gets into maxValue only when the handle is cut off by 50%, so it does not move without adding any value.

- (void)drawKnob:(NSRect)knobRect { NSImage * knob = _knobOff; knobRectVar = knobRect; [[self controlView] lockFocus]; [knob compositeToPoint: NSMakePoint(knobRect.origin.x+4,knobRect.origin.y+knobRect.size.height+20) operation:NSCompositeSourceOver]; [[self controlView] unlockFocus]; } - (void)drawBarInside:(NSRect)rect flipped:(BOOL)flipped { rect.size.height = 8; [[self controlView] lockFocus]; NSImage *leftCurve = [NSImage imageNamed:@"customSliderLeft"]; [leftCurve drawInRect:NSMakeRect(5, 25, 8, 8) fromRect:NSZeroRect operation:NSCompositeSourceOver fraction:1]; NSRect leftRect = rect; leftRect.origin.x=13; leftRect.origin.y=25; leftRect.size.width = knobRectVar.origin.x + (knobRectVar.size.width/2); [leftBarImage setSize:leftRect.size]; [leftBarImage drawInRect:leftRect fromRect: NSZeroRect operation: NSCompositeSourceOver fraction:1]; [[self controlView] unlockFocus]; } 

Answer 1

NSSLider expects special sizes from handle images for each control size:

 NSRegularControlSize: 21x21 NSSmallControlSize: 15x15 NSMiniControlSize: 12x12 

Unfortunately, the height of your pen image must not exceed one of these parameters. But the width may be greater. If so, you can read the x position for this pen as follows:

 CGFloat newOriginX = knobRect.origin.x * (_barRect.size.width - (_knobImage.size.width - knobRect.size.width)) / _barRect.size.width; 

Where _barRect is the frame cell of your bar:

 - (void)drawBarInside:(NSRect)cellFrame flipped:(BOOL)flipped; 

I created a simple solution for custom NSSlider. Follow this link https://github.com/Doshipak/LADSlider

Answer 2

You can override [NSSliderCell knobRectFlipped:] in addition to [NSSliderCell drawKnob:] . Here is my solution:

 - (void)drawKnob:(NSRect)rect { NSImage *drawImage = [self knobImage]; NSRect drawRect = [self knobRectFlipped:[self.controlView isFlipped]]; CGFloat fraction = 1.0; [drawImage drawInRect:drawRect fromRect:NSZeroRect operation:NSCompositeSourceOver fraction:fraction respectFlipped:YES hints:nil]; } - (NSRect)knobRectFlipped:(BOOL)flipped { NSImage *drawImage = [self knobImage]; NSRect drawRect = [super knobRectFlipped:flipped]; drawRect.size = drawImage.size; NSRect bounds = self.controlView.bounds; bounds = NSInsetRect(bounds, ceil(drawRect.size.width / 2), 0); CGFloat val = MIN(self.maxValue, MAX(self.minValue, self.doubleValue)); val = (val - self.minValue) / (self.maxValue - self.minValue); CGFloat x = val * NSWidth(bounds) + NSMinX(bounds); drawRect = NSOffsetRect(drawRect, x - NSMidX(drawRect) + 1, 0); return drawRect; } 

Answer 3

Know that this has been a while, but I ran into this problem myself and found a quick and dirty workaround.

I could not get around the original reason for this, but it seems that NSSlider is expecting a quadratic image. The easiest way to find the range of your slider is from 0.0f to 110.0f, for example.

Then you check the assigned valueChanged method if the value is> 100.0f, and set it back to that value, if any. I created a background image with only alpha pixels on the right side, so your background is not wider than the actual range of the fader.

Quick and dirty, but does not require a lot of code and works very well. Hope this helps other guys attack the same issue.

Answer 4

You do not need to lock and unlock focus on controlView from internal cell drawing methods. These methods are only called by your controlViews -drawRect: method, which is called with focus lock.

Why are you adding 20 points to the Y coordinate, is the image with a pen drawn in -drawKnob?