How can i set Frame properly After dragging?

Question

I am Building iOS App Using StoryBoards.

In My App, I want to create a custom slider. For that I created two views and image programmatically. Big View is considered as slider. And small one means the thumb.I applied panGesture for the thumb so that it can be moveable. It must reside with in the slider.

I have 2 button actions, Add button is used to add the width of the thumb[small view] only by right side. For that I use a unit value.Let it be 6. Minus button is used to decrease width of the thumb only by right side by the same unit value.

These all are working fine. Problem occurs after dragging the thumb[small view] .After that if I click add button, x-coordinate position is shifted.I want it to remain same.while NSLog x value, I got the same x value After dragging and clicking Add Button.I am not able to understand why the Frame is shifting.This is Current result.

And my expected result is,when i drag view using PanGesture of x-coordinate will remain same.And I want to increase width of the Frame by that position

#import "ViewController.h"

@interface ViewController ()
{
   UIView *bookingSlotView;
   UIView *thumb;
   UIImageView *knob;
   UIPanGestureRecognizer *move;
   CGRect thumbRect;
   int delta,thumbWidth,thumbXCord,flag;

}
@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];

    delta=6;
    thumbWidth=40;
    thumbXCord=160;
    flag=0;

    thumbRect = CGRectMake(thumbXCord, 0.0f, thumbWidth, 10);

    bookingSlotView = [[UIView alloc]initWithFrame:CGRectMake(20, 150, 280, 10)];
    bookingSlotView.backgroundColor=[UIColor grayColor];
    [self.view addSubview:bookingSlotView];

    thumb=[[UIView alloc]initWithFrame:thumbRect];
    thumb.backgroundColor=[UIColor greenColor];
    [bookingSlotView addSubview:thumb];

    knob=[[UIImageView alloc]initWithFrame:CGRectMake(thumb.frame.origin.x,thumb.frame.origin.y+30,thumb.frame.size.width/2,thumb.frame.size.height+20)];
    knob.image=[UIImage imageNamed:@"games@2x.png"];
    knob.center = CGPointMake( thumb.bounds.size.width / 2, thumb.bounds.size.height);
    [thumb addSubview:knob];

    move=[[UIPanGestureRecognizer alloc]initWithTarget:self action:@selector(handleDragDescriptionView:)];
    thumb.userInteractionEnabled=YES;
    [move setMaximumNumberOfTouches:1];
    [thumb addGestureRecognizer:move];


}
- (void)handleDragDescriptionView:(UIPanGestureRecognizer *)gestureRecognizer {

    flag=1;
     CGPoint translation = [gestureRecognizer translationInView:bookingSlotView];
    if ((gestureRecognizer.state == UIGestureRecognizerStateChanged) ||
        (gestureRecognizer.state == UIGestureRecognizerStateEnded))
        {
            thumb.center = CGPointMake(thumb.center.x + translation.x, thumb.center.y);
            thumbXCord=(int)thumb.center.x;
            NSLog(@"%d",thumbXCord);
            [gestureRecognizer setTranslation:CGPointZero inView:thumb];
       }
}
- (IBAction)increase:(UIButton *)sender {
    const int newthumbXCord = thumbXCord;
    if(thumb.frame.size.width<120 && flag==0)
        {
            thumbWidth += delta;
            CGRect newFrame1=CGRectMake(thumbXCord, 0.0f, thumbWidth,10 );
            [thumb setFrame:newFrame1];
            knob.center = CGPointMake( thumb.bounds.size.width / 2, thumb.bounds.size.height);
        }
    //After Dragging this condition Will execute
    if (flag==1 && thumb.frame.size.width<bookingSlotView.frame.size.width)
        {
            thumbWidth += delta;

            CGRect newFrame1=CGRectMake(newthumbXCord, 0.0f, thumbWidth,10 );
            [thumb setFrame:newFrame1];
            NSLog(@"%d---------ThumbXCoordinate",thumbXCord);
            knob.center = CGPointMake( thumb.bounds.size.width / 2, thumb.bounds.size.height);

        }
}
- (IBAction)decrease:(UIButton *)sender {
    if (flag==1 && thumbWidth>20)
    {
        thumbWidth -= delta;
        CGRect newFrame1=CGRectMake(thumbXCord, 0.0f, thumbWidth,10 );
        [thumb setFrame:newFrame1];
        knob.center = CGPointMake( thumb.bounds.size.width / 2, thumb.bounds.size.height);

    }

    if (thumbWidth>20 && flag==0)
    {
        thumbWidth -= delta;
        [thumb setFrame:CGRectMake(thumbXCord, 0.0f, thumbWidth, 10)];
        knob.center = CGPointMake( thumb.bounds.size.width / 2, thumb.bounds.size.height);
    }

}

Answer 1

You are mixing between setting the frame origin and the frame centre. As you pan with the gesture you're setting

thumbXCord = (int)thumb.center.x;

so you're creating an offset of half the width of the thumb.

Either be consistent about what you're setting or update the thumbXCord to account for the width.