2012-05-02 6 views
8

का उपयोग करके उभरा चाप खींचें मैं नीचे दिए गए चित्र में दिखाए गए कस्टम स्लाइडर को लागू करने की कोशिश कर रहा हूं।कोर ग्राफिक्स

enter image description here

मैं अब तक क्या किया है इस

enter image description here

तरह दिखता है तो कृपया मुझे इस तरह के प्रभाव के साथ चाप ड्राइंग के लिए बाहर मदद करते हैं। मेरा कोड नीचे जैसा है, मैं जो कर रहा हूं वह लाइन चौड़ाई kLineWidth के साथ CGContextAddArc का उपयोग कर चाप खींच रहा है।

- (void)drawThumbAtPoint:(CGPoint)sliderButtonCenterPoint inContext: (CGContextRef)context { 
UIGraphicsPushContext(context); 
CGContextBeginPath(context); 

CGContextMoveToPoint(context, sliderButtonCenterPoint.x, sliderButtonCenterPoint.y); 

CGImageRef imageRef = [UIImage imageNamed:@"circle25.png"].CGImage; 
CGRect rect = CGRectMake(sliderButtonCenterPoint.x - kThumbRadius, sliderButtonCenterPoint.y - kThumbRadius, kThumbRadius*2, kThumbRadius*2); 
CGContextDrawImage(context, rect, imageRef); 

//CGContextAddArc(context, sliderButtonCenterPoint.x, sliderButtonCenterPoint.y, kThumbRadius, 0.0, 2*M_PI, NO); 

CGContextFillPath(context); 
UIGraphicsPopContext(); 
} 

- (CGPoint)drawArcTrack:(float)track atPoint:(CGPoint)center withRadius:(CGFloat)radius inContext:(CGContextRef)context { 
UIGraphicsPushContext(context); 
CGContextBeginPath(context); 

float angleFromTrack = translateValueFromSourceIntervalToDestinationInterval(track, self.minimumValue, self.maximumValue, 0, M_PI/3);// 2*M_PI 

CGFloat startAngle = (4*M_PI)/3; 
CGFloat endAngle = startAngle + angleFromTrack; 

CGContextAddArc(context, center.x, center.y, radius, startAngle, endAngle, NO); 

CGPoint arcEndPoint = CGContextGetPathCurrentPoint(context); 

CGContextStrokePath(context); 

UIGraphicsPopContext(); 

return arcEndPoint; 
} 

- (void)drawRect:(CGRect)rect { 
    CGContextRef context = UIGraphicsGetCurrentContext(); 

    CGPoint middlePoint; 
    middlePoint.x = self.bounds.origin.x + self.bounds.size.width/2; 
middlePoint.y = self.bounds.origin.y + self.bounds.size.width; 

CGContextSetLineWidth(context, kLineWidth); 

CGFloat radius = [self sliderRadius]; 


[self.maximumTrackTintColor setStroke];   
[self drawArcTrack:self.maximumValue atPoint:middlePoint withRadius:radius inContext:context];   
[self.minimumTrackTintColor setStroke];   
self.thumbCenterPoint = [self drawArcTrack:self.value atPoint:middlePoint withRadius:radius inContext:context];  

[self.thumbTintColor setFill]; 
[self drawThumbAtPoint:self.thumbCenterPoint inContext:context]; 
} 

उत्तर

23

जब तक आप आकार को गतिशील रूप से बदलने जा रहे हैं, तो आप शायद छवि संपादक में छवि बनाने से बेहतर होंगे। मुझे पता है कि फ़ोटोशॉप, इलस्ट्रेटर, या आतिशबाजी में उस प्रभाव को बनाना आसान है।

जिसके अनुसार, कि कोर ग्राफिक्स के साथ की तरह एक आंतरिक छाया ड्राइंग कई कदम की आवश्यकता है: आकार के

  1. क्लिप (जैसे CGContextClip या CGContextClipToMask का उपयोग)।
  2. सब कुछ का पथ या मुखौटा बनाएं लेकिन आकार।
  3. अपने छाया पैरामीटर सेट करें (CGContextSetShadowWithColor का उपयोग करके)।
  4. कदम 2. से पथ या मुखौटा भरें इस आकृति के अंदर एक छाया डाले, और केवल छाया क्योंकि आप 1.

यदि आपने यह सब करते हैं सही ढंग से कदम में आकार को काटा तैयार की है, आप इस तरह से एक अच्छा परिणाम प्राप्त कर सकते हैं:

screen shot of arc with inner shadow

यहाँ कोड मुझे लगता है कि आकर्षित करने के लिए लिखा था है। मैंने इसे कस्टम व्यू उपclass के drawRect: में लिखा है, लेकिन आप किसी भी ग्राफिक्स संदर्भ में आकर्षित करने के लिए आसानी से इस कोड का उपयोग कर सकते हैं।

- (void)drawRect:(CGRect)rect { 
    CGContextRef gc = UIGraphicsGetCurrentContext(); 

पहले, मैं एक रास्ता सिर्फ एक चाप है कि बनाने के लिए:

static CGFloat const kArcThickness = 20.0f; 
    CGRect arcBounds = CGRectInset(self.bounds, 10.0f, 10.0f); 
    CGPoint arcCenter = CGPointMake(CGRectGetMidX(arcBounds), CGRectGetMidY(arcBounds)); 
    CGFloat arcRadius = 0.5f * (MIN(arcBounds.size.width, arcBounds.size.height) - kArcThickness); 
    UIBezierPath *arc = [UIBezierPath bezierPathWithArcCenter:arcCenter radius:arcRadius startAngle:-M_PI/3.0 endAngle:-2.0 * M_PI/3.0 clockwise:NO]; 

इसके बाद, मैं कोर ग्राफिक्स कोई नया पथ arc पथ की रूपरेखा है कि बनाने के लिए। ध्यान दें कि कैसे मैं इसे kArcThickness और गोल लाइन टोपियां के एक स्ट्रोक की चौड़ाई के लिए पूछना: एक रास्ता है किshape में अंक को छोड़कर हर बिंदु में शामिल हैं:

CGPathRef shape = CGPathCreateCopyByStrokingPath(arc.CGPath, NULL, kArcThickness, kCGLineCapRound, kCGLineJoinRound, 10.0f); 

मैं भी उस पथ का प्रतिलोम की जरूरत है। ऐसा होता है (हालांकि मुझे नहीं लगता कि यह दस्तावेज है) कि CGContextCreateCopyByStrokingPath और CGPathAddRect विपरीत दिशाओं में आकर्षित करें। तो अगर मैं shape को कॉपी करें और चारों ओर एक बहुत बड़ा आयत, गैर शून्य नियम घुमावदार मतलब यह है कि नया पथ shape का उल्टा हो जाएगा:

CGMutablePathRef shapeInverse = CGPathCreateMutableCopy(shape); 
    CGPathAddRect(shapeInverse, NULL, CGRectInfinite); 

अब मैं वास्तव में बनाना शुरू कर सकते हैं।सबसे पहले, मैं एक हल्के भूरे रंग के रंग के साथ आकार भर दूंगा:

CGContextBeginPath(gc); 
    CGContextAddPath(gc, shape); 
    CGContextSetFillColorWithColor(gc, [UIColor colorWithWhite:.9 alpha:1].CGColor); 
    CGContextFillPath(gc); 

अगला मैं वास्तव में ऊपर सूचीबद्ध चार चरणों का पालन करता हूं। मुझे ग्राफिक्स स्थिति को सहेजना है ताकि जब मैं कर रहा हूं तो मैं क्लिपिंग और छाया पैरामीटर पूर्ववत कर सकता हूं।

CGContextSaveGState(gc); { 

चरण 1: क्लिप आकार करने के लिए:

 CGContextBeginPath(gc); 
     CGContextAddPath(gc, shape); 
     CGContextClip(gc); 

चरण 2: ठीक है, मैं इस कदम पहले से ही है जब मैं shapeInverse बनाया था।

चरण 3:

 CGContextSetShadowWithColor(gc, CGSizeZero, 7, [UIColor colorWithWhite:0 alpha:.25].CGColor); 

चरण 4:: मैं छाया पैरामीटर सेट मैं चरण 2 से उलटा आकार को भरने:

 CGContextBeginPath(gc); 
     CGContextAddPath(gc, shapeInverse); 
     CGContextFillPath(gc); 

अब मैं ग्राफिक्स राज्य है, जो विशेष रूप से पुनर्स्थापित करता बहाल क्लिपिंग पथ और छाया पैरामीटर unsets।

CGContextSetStrokeColorWithColor(gc, [UIColor colorWithWhite:.75 alpha:1].CGColor); 
    CGContextSetLineWidth(gc, 1); 
    CGContextSetLineJoin(gc, kCGLineCapRound); 
    CGContextBeginPath(gc); 
    CGContextAddPath(gc, shape); 
    CGContextStrokePath(gc); 
पाठ्यक्रम मैं साफ के

जब मेरा कार्य पूर्ण हो:

CGPathRelease(shape); 
    CGPathRelease(shapeInverse); 
} 

लिए

} CGContextRestoreGState(gc); 

अंत में, मैं एक हल्के भूरे रंग के साथ स्ट्रोक shape बढ़त crisper बनाने के लिए करेंगे अधिक जटिल आकार, आप my answer here और my answer here देख सकते हैं।

यहाँ आसान नकल के लिए एक साथ सभी कोड है:

- (void)drawRect:(CGRect)rect { 
    CGContextRef gc = UIGraphicsGetCurrentContext(); 

    static CGFloat const kArcThickness = 20.0f; 
    CGRect arcBounds = CGRectInset(self.bounds, 10.0f, 10.0f); 
    CGPoint arcCenter = CGPointMake(CGRectGetMidX(arcBounds), CGRectGetMidY(arcBounds)); 
    CGFloat arcRadius = 0.5f * (MIN(arcBounds.size.width, arcBounds.size.height) - kArcThickness); 
    UIBezierPath *arc = [UIBezierPath bezierPathWithArcCenter:arcCenter radius:arcRadius startAngle:-M_PI/3.0 endAngle:-2.0 * M_PI/3.0 clockwise:NO]; 
    CGPathRef shape = CGPathCreateCopyByStrokingPath(arc.CGPath, NULL, kArcThickness, kCGLineCapRound, kCGLineJoinRound, 10.0f); 
    CGMutablePathRef shapeInverse = CGPathCreateMutableCopy(shape); 
    CGPathAddRect(shapeInverse, NULL, CGRectInfinite); 

    CGContextBeginPath(gc); 
    CGContextAddPath(gc, shape); 
    CGContextSetFillColorWithColor(gc, [UIColor colorWithWhite:.9 alpha:1].CGColor); 
    CGContextFillPath(gc); 

    CGContextSaveGState(gc); { 
     CGContextBeginPath(gc); 
     CGContextAddPath(gc, shape); 
     CGContextClip(gc); 
     CGContextSetShadowWithColor(gc, CGSizeZero, 7, [UIColor colorWithWhite:0 alpha:.25].CGColor); 
     CGContextBeginPath(gc); 
     CGContextAddPath(gc, shapeInverse); 
     CGContextFillPath(gc); 
    } CGContextRestoreGState(gc); 

    CGContextSetStrokeColorWithColor(gc, [UIColor colorWithWhite:.75 alpha:1].CGColor); 
    CGContextSetLineWidth(gc, 1); 
    CGContextSetLineJoin(gc, kCGLineCapRound); 
    CGContextBeginPath(gc); 
    CGContextAddPath(gc, shape); 
    CGContextStrokePath(gc); 

    CGPathRelease(shape); 
    CGPathRelease(shapeInverse); 
} 
+0

धन्यवाद रोब कोड के लिए, यह वास्तव में मददगार था अंगूठे छवि की आवश्यकता करेंगे .. – Shashank

+0

शानदार काम करता है! बहुत बहुत धन्यवाद। एक चीज जो मुझे करने की ज़रूरत थी वह स्वयं को सेट करना था। बैकग्राउंड कस्टम कस्टम यूवीव सबक्लास में साफ़ करने के लिए जिसने ड्रॉरेक्ट जादू किया था। – Chris

+0

@Shashank क्या आप उस पथ पर उस स्लाइडर को स्थानांतरित करने में सक्षम हैं? क्या आप अपना कोड साझा कर सकते हैं? – NSCry

2

जांच से ऊपर घटक के पूरी तरह कार्यात्मक संस्करण के लिए नीचे दिए गए कोड, अपने काम के (अपने बिट गंदा हो सकता है)।

#import "UIArcSlider.h" 

@interface UIArcSlider() 

@property (nonatomic) CGPoint thumbCenterPoint; 

#pragma mark - Init and Setup methods 
- (void)setup; 

#pragma mark - Thumb management methods 
- (BOOL)isPointInThumb:(CGPoint)point; 

#pragma mark - Drawing methods 
- (CGFloat)sliderRadius; 
- (void)drawThumbAtPoint:(CGPoint)sliderButtonCenterPoint inContext:(CGContextRef)context; 
- (CGPoint)drawTheArcTrack:(float)track atPoint:(CGPoint)center withRadius:(CGFloat)radius AndColor:(Boolean) isWhite inContext:(CGContextRef)context; 
- (CGPoint)drawTheLineTrack:(float)track withColor:(Boolean) isWhite inContext:(CGContextRef)context; 

@end 

#pragma mark - 
@implementation UIArcSlider 

@synthesize sliderStyle = _sliderStyle; 
- (void)setSliderStyle:(UISliderStyle)sliderStyle { 
    if (sliderStyle != _sliderStyle) { 
     _sliderStyle = sliderStyle; 
     [self setNeedsDisplay]; 
    } 
} 

@synthesize value = _value; 
- (void)setValue:(float)value { 
    if (value != _value) { 
     if (value > self.maximumValue) { value = self.maximumValue; } 
     if (value < self.minimumValue) { value = self.minimumValue; } 
     _value = value; 
     [self setNeedsDisplay]; 
     [self sendActionsForControlEvents:UIControlEventValueChanged]; 
    } 
} 
@synthesize minimumValue = _minimumValue; 
- (void)setMinimumValue:(float)minimumValue { 
    if (minimumValue != _minimumValue) { 
     _minimumValue = minimumValue; 
     if (self.maximumValue < self.minimumValue) { self.maximumValue = self.minimumValue; } 
     if (self.value < self.minimumValue)   { self.value = self.minimumValue; } 
    } 
} 
@synthesize maximumValue = _maximumValue; 
- (void)setMaximumValue:(float)maximumValue { 
    if (maximumValue != _maximumValue) { 
     _maximumValue = maximumValue; 
     if (self.minimumValue > self.maximumValue) { self.minimumValue = self.maximumValue; } 
     if (self.value > self.maximumValue)   { self.value = self.maximumValue; } 
    } 
} 

@synthesize thumbCenterPoint = _thumbCenterPoint; 

/** @name Init and Setup methods */ 
#pragma mark - Init and Setup methods 
- (id)initWithFrame:(CGRect)frame { 
    self = [super initWithFrame:frame]; 
    if (self) { 
     [self setup]; 
    } 
    return self; 
} 
- (void)awakeFromNib { 
    [self setup]; 
} 

- (void)setup { 
    self.value = 0.0; 
    self.minimumValue = 0.0; 
    self.maximumValue = 100.0; 
    self.thumbCenterPoint = CGPointZero; 

    UITapGestureRecognizer *tapGestureRecognizer = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(tapGestureHappened:)]; 
    [self addGestureRecognizer:tapGestureRecognizer]; 

    UIPanGestureRecognizer *panGestureRecognizer = [[UIPanGestureRecognizer alloc] initWithTarget:self action:@selector(panGestureHappened:)]; 
    panGestureRecognizer.maximumNumberOfTouches = panGestureRecognizer.minimumNumberOfTouches; 
    [self addGestureRecognizer:panGestureRecognizer]; 
} 

/** @name Drawing methods */ 
#pragma mark - Drawing methods 
#define kLineWidth 22.0 
#define kThumbRadius 20.0 
#define kPadding 20.0 

- (CGFloat)sliderRadius { 
    CGFloat radius = self.bounds.size.width; 
    radius -= MAX(kLineWidth + kPadding, kThumbRadius + kPadding); 
    return radius; 
} 

-(CGFloat)sliderWidth {  
    return self.bounds.size.width - kThumbRadius*2; 
} 

- (void)drawThumbAtPoint:(CGPoint)sliderButtonCenterPoint inContext:(CGContextRef)context { 
    UIGraphicsPushContext(context); 
    CGContextBeginPath(context);  

    CGContextMoveToPoint(context, sliderButtonCenterPoint.x, sliderButtonCenterPoint.y); 

    CGRect rect = CGRectMake(sliderButtonCenterPoint.x - kThumbRadius, sliderButtonCenterPoint.y - kThumbRadius, kThumbRadius*2, kThumbRadius*2); 
    CGImageRef imageRef = [UIImage imageNamed:@"circle25.png"].CGImage; 

    CGContextDrawImage(context, rect, imageRef); 

    UIGraphicsPopContext();   
} 

- (CGPoint)drawTheArcTrack:(float)track atPoint:(CGPoint)center withRadius:(CGFloat)radius AndColor:(Boolean) isWhite inContext:(CGContextRef)context 
{ 
    static CGFloat const kArcThickness = kLineWidth; 
    CGPoint arcCenter = center; 
    CGFloat arcRadius = radius; 

    float angleFromTrack = translateValueFromSourceIntervalToDestinationInterval(track, self.minimumValue, self.maximumValue, 0, M_PI/3);// 2*M_PI 

    CGFloat startAngle = (4*M_PI)/3; 
    CGFloat endAngle = startAngle + angleFromTrack; 

    UIBezierPath *arc = [UIBezierPath bezierPathWithArcCenter:arcCenter radius:arcRadius startAngle:startAngle endAngle:endAngle clockwise:YES]; 

    CGPathRef shape = CGPathCreateCopyByStrokingPath(arc.CGPath, NULL, kArcThickness, kCGLineCapRound, kCGLineJoinRound, 10.0f); 
    CGMutablePathRef shapeInverse = CGPathCreateMutableCopy(shape); 
    CGPathAddRect(shapeInverse, NULL, CGRectInfinite); 

    CGPoint arcEndPoint = [arc currentPoint]; 

    CGContextBeginPath(context); 
    CGContextAddPath(context, shape); 

    if (isWhite) { 
     CGContextSetFillColorWithColor(context, [UIColor colorWithWhite:.9 alpha:1].CGColor); 
    } else {//70,172, 220 
     CGContextSetFillColorWithColor(context, [UIColor colorWithRed:70/255.0 green:172/255.0 blue:220/255.0 alpha:1].CGColor); 
    }  

    CGContextFillPath(context); 

    CGContextSaveGState(context); { 
     CGContextBeginPath(context); 
     CGContextAddPath(context, shape); 
     CGContextClip(context); 
     if (isWhite) { 
      CGContextSetShadowWithColor(context, CGSizeZero, 7, [UIColor colorWithWhite:0 alpha:.25].CGColor); 
     } else { 
      CGContextSetShadowWithColor(context, CGSizeZero, 7, [UIColor colorWithRed:85/255.0 green:183/255.0 blue:230/255.0 alpha:.25].CGColor); 
     }  
     CGContextBeginPath(context); 
     CGContextAddPath(context, shapeInverse); 
     CGContextFillPath(context); 
    } CGContextRestoreGState(context); 

    if (isWhite) { 
     CGContextSetStrokeColorWithColor(context, [UIColor colorWithWhite:.75 alpha:1].CGColor); 
    } else { 
     CGContextSetStrokeColorWithColor(context, [UIColor colorWithRed:62/255.0 green:135/255.0 blue:169/255.0 alpha:1].CGColor); 
    } 

    CGContextSetLineWidth(context, 1); 
    CGContextSetLineJoin(context, kCGLineCapRound); 
    CGContextBeginPath(context); 
    CGContextAddPath(context, shape); 
    CGContextStrokePath(context); 

    CGPathRelease(shape); 
    CGPathRelease(shapeInverse);   

    return arcEndPoint;  
} 


- (CGPoint)drawTheLineTrack:(float)track withColor:(Boolean) isWhite inContext:(CGContextRef)context 
{   
    CGFloat sliderWidth = [self sliderWidth]; 
    CGFloat xStart = self.bounds.origin.x + (self.bounds.size.width - sliderWidth)/2; 
    CGFloat lineRectX = (self.bounds.size.width - sliderWidth)/2; 
    CGFloat lineThickness = kLineWidth/2; 
    CGFloat lineRectY = (self.bounds.size.height - lineThickness)/2; 

    CGFloat xPoint = translateValueToPoint(track, xStart, self.maximumValue, sliderWidth); 
    sliderWidth = xPoint; 

    CGRect lineRect = CGRectMake(lineRectX, lineRectY, sliderWidth, lineThickness); 
    UIBezierPath *line = [UIBezierPath bezierPathWithRoundedRect:lineRect cornerRadius:lineThickness/2]; 

    CGPathRef shape = CGPathCreateCopyByStrokingPath(line.CGPath, NULL, lineThickness, kCGLineCapRound, kCGLineJoinRound, 10.0f); 
    CGMutablePathRef shapeInverse = CGPathCreateMutableCopy(shape); 
    CGPathAddRect(shapeInverse, NULL, CGRectInfinite); 

    CGPoint arcEndPoint = CGPointMake(lineRectX + xPoint, lineRectY + (lineThickness/2)); 

    CGContextBeginPath(context); 
    CGContextAddPath(context, shape); 

    if (isWhite) { 
     CGContextSetFillColorWithColor(context, [UIColor colorWithWhite:.9 alpha:1].CGColor); 
    } else {//70,172, 220 
     CGContextSetFillColorWithColor(context, [UIColor colorWithRed:70/255.0 green:172/255.0 blue:220/255.0 alpha:1].CGColor); 
    }  

    CGContextFillPath(context); 

    CGContextSaveGState(context); { 
     CGContextBeginPath(context); 
     CGContextAddPath(context, shape); 
     CGContextClip(context); 
     if (isWhite) { 
      CGContextSetShadowWithColor(context, CGSizeZero, 7, [UIColor colorWithWhite:0 alpha:.25].CGColor); 
     } else { 
      CGContextSetShadowWithColor(context, CGSizeZero, 7, [UIColor colorWithRed:85/255.0 green:183/255.0 blue:230/255.0 alpha:.25].CGColor); 
     }  
     CGContextBeginPath(context); 
     CGContextAddPath(context, shapeInverse); 
     CGContextFillPath(context); 
    } CGContextRestoreGState(context); 

    if (isWhite) { 
     CGContextSetStrokeColorWithColor(context, [UIColor colorWithWhite:.75 alpha:1].CGColor); 
    } else { 
     CGContextSetStrokeColorWithColor(context, [UIColor colorWithRed:62/255.0 green:135/255.0 blue:169/255.0 alpha:1].CGColor); 
    } 

    CGRect outlineRect = CGRectMake(lineRectX - (lineThickness/2), lineRectY - (lineThickness/2), sliderWidth + lineThickness, lineThickness * 2); 
    UIBezierPath *outline = [UIBezierPath bezierPathWithRoundedRect:outlineRect cornerRadius:lineThickness]; 
    CGContextSetLineWidth(context, 1); 
    CGContextSetLineJoin(context, kCGLineCapSquare); 
    CGContextBeginPath(context); 
    CGContextAddPath(context, outline.CGPath); 
    CGContextStrokePath(context); 

    CGPathRelease(shape); 
    CGPathRelease(shapeInverse);   

    return arcEndPoint;  
} 

- (void)drawRect:(CGRect)rect { 
    CGContextRef context = UIGraphicsGetCurrentContext(); 
    CGPoint middlePoint; 

    switch (self.sliderStyle) { 
     case UISliderStyleLine: 

      [self drawTheLineTrack:self.maximumValue withColor:YES inContext:context]; 
      self.thumbCenterPoint = [self drawTheLineTrack:self.value withColor:NO inContext:context]; 

      [self drawThumbAtPoint:self.thumbCenterPoint inContext:context]; 
      break; 

     case UISliderStyleArc: 
     default: 
      middlePoint.x = self.bounds.origin.x + self.bounds.size.width/2; 
      middlePoint.y = self.bounds.origin.y + self.bounds.size.width; 

      CGFloat radius = [self sliderRadius];     
      [self drawTheArcTrack:self.maximumValue atPoint:middlePoint withRadius:radius AndColor:YES inContext:context]; 

      self.thumbCenterPoint = [self drawTheArcTrack:self.value atPoint:middlePoint withRadius:radius AndColor:NO inContext:context]; 

      [self drawThumbAtPoint:self.thumbCenterPoint inContext:context]; 
      break; 
    } 
} 

/** @name Thumb management methods */ 
#pragma mark - Thumb management methods 
- (BOOL)isPointInThumb:(CGPoint)point { 
    CGRect thumbTouchRect = CGRectMake(self.thumbCenterPoint.x - kThumbRadius, self.thumbCenterPoint.y - kThumbRadius, kThumbRadius*2, kThumbRadius*2); 
    return CGRectContainsPoint(thumbTouchRect, point); 
} 

/** @name UIGestureRecognizer management methods */ 
#pragma mark - UIGestureRecognizer management methods 
- (void)panGestureHappened:(UIPanGestureRecognizer *)panGestureRecognizer { 
    CGPoint tapLocation = [panGestureRecognizer locationInView:self]; 
    switch (panGestureRecognizer.state) { 
     case UIGestureRecognizerStateChanged: { 

      CGFloat radius; 
      CGPoint sliderCenter; 
      CGPoint sliderStartPoint; 
      CGFloat angle; 


      CGFloat xStart; 
      CGFloat maximumValue; 
      CGFloat sliderWidth; 
      CGFloat point; 

      switch (self.sliderStyle) { 
       case UISliderStyleLine: 

        sliderWidth = [self sliderWidth]; 
        xStart = self.bounds.origin.x + (self.bounds.size.width - sliderWidth)/2; 
        maximumValue = self.maximumValue; 
        point = tapLocation.x; 

        self.value = translatePointToValue(point, xStart, maximumValue, sliderWidth); 

        break; 

       case UISliderStyleArc: 
       default: 

        radius = [self sliderRadius]; 
        sliderCenter = CGPointMake(self.bounds.size.width/2, self.bounds.size.width); 
        sliderStartPoint = CGPointMake(sliderCenter.x - (radius * 1.15), sliderCenter.y - (radius * 2.1)); 
        angle = angleBetweenThreePoints(sliderCenter, sliderStartPoint, tapLocation); 

        if (angle < 0) { 
         angle = -angle; 
        } 
        else { 
         angle = 0.0; 
         //angle = M_PI/3 - angle; 
        } 

        self.value = translateValueFromSourceIntervalToDestinationInterval(angle, 0, M_PI/3, self.minimumValue, self.maximumValue); 
        break; 
      } 
     } 
     default: 
      break; 
    } 
} 
- (void)tapGestureHappened:(UITapGestureRecognizer *)tapGestureRecognizer { 
    if (tapGestureRecognizer.state == UIGestureRecognizerStateEnded) { 
     CGPoint tapLocation = [tapGestureRecognizer locationInView:self]; 
     if ([self isPointInThumb:tapLocation]) { 
      // do something on tap 
     } 
     else { 
     } 
    } 
} 

@end 

/** @name Utility Functions */ 
#pragma mark - Utility Functions 
float translateValueFromSourceIntervalToDestinationInterval(float sourceValue, float sourceIntervalMinimum, float sourceIntervalMaximum, float destinationIntervalMinimum, float destinationIntervalMaximum) { 
    float a, b, destinationValue; 

    a = (destinationIntervalMaximum - destinationIntervalMinimum)/(sourceIntervalMaximum - sourceIntervalMinimum); 
    b = destinationIntervalMaximum - a*sourceIntervalMaximum; 

    destinationValue = a*sourceValue + b; 

    return destinationValue; 
} 

float translateValueToPoint(float value, float xStart, float maximum, float width) 
{ 
    float point = (width * value)/maximum; 
//  
// point = xStart + point; 
//  
    return point; 
} 

float translatePointToValue(float point, float xStart, float maximum, float width) 
{ 
    float value = (point) * maximum; 
    value = value/width; 

    return value; 
} 


CGFloat angleBetweenThreePoints(CGPoint centerPoint, CGPoint p1, CGPoint p2) { 
    CGPoint v1 = CGPointMake(p1.x - centerPoint.x, p1.y - centerPoint.y); 
    CGPoint v2 = CGPointMake(p2.x - centerPoint.x, p2.y - centerPoint.y); 

    CGFloat angle = atan2f(v2.x*v1.y - v1.x*v2.y, v1.x*v2.x + v1.y*v2.y); 

    return angle; 
} 

साथ ही आप enter image description here