CODEWITHSUNDEEP
iosobjective-cscrolluiscrollviewposition
Fahim Parkar
Fahim Parkar

Reputation: 31633

Bringing UiScrollView element to center when clicked

What I have is UIScrollView and inside it I have buttons of different different sizes.

- (void)viewDidLoad {
    [super viewDidLoad];

    myScrollView.frame = CGRectMake(0, 100, 375, 50.0);

    int totalButtonsToAdd = 20;

    startX = 0;
    int buttonWidth =  60;
    for (int i=0;i<totalButtonsToAdd;i++) {
        UIButton *button = [UIButton buttonWithType:UIButtonTypeCustom];
        [button addTarget:self
                   action:@selector(aMethod:)
         forControlEvents:UIControlEventTouchUpInside];
        [button setTitle:[NSString stringWithFormat:@"Btn-%d", i] forState:UIControlStateNormal];
        [button setTitleColor:[UIColor greenColor] forState:UIControlStateNormal];
        button.accessibilityValue = [NSString stringWithFormat:@"%d", i+1];
        button.frame = CGRectMake(startX, 0, buttonWidth, 50.0);
        [[button layer] setBorderWidth:2.0f];
        [[button layer] setBorderColor:[UIColor greenColor].CGColor];
        button.layer.cornerRadius = 5;
        startX = startX + buttonWidth + 5;
        buttonWidth = buttonWidth + 5;
        [myScrollView addSubview:button];
    }

    NSLog(@"startX===%d", startX);

    myScrollView.contentSize = CGSizeMake(startX, 50.0);
}

-(IBAction)aMethod:(id)sender {
    UIButton *mButton = (UIButton *)sender;
    NSLog(@"clicked button index is %@", mButton.accessibilityValue);
}

What I want to do is when I click any button, I want to bring that button in center. For this I believe I will need to scroll the scrollview to specific position.

For this what I did is as below.

- (void)viewDidLoad {
    [super viewDidLoad];

    myScrollView.frame = CGRectMake(0, 100, 375, 50.0);

    int totalButtonsToAdd = 20;

    startX = 0;
    int buttonWidth =  60;
    for (int i=0;i<totalButtonsToAdd;i++) {
        UIButton *button = [UIButton buttonWithType:UIButtonTypeCustom];
        [button addTarget:self
                   action:@selector(aMethod:)
         forControlEvents:UIControlEventTouchUpInside];
        [button setTitle:[NSString stringWithFormat:@"Btn-%d", i] forState:UIControlStateNormal];
        [button setTitleColor:[UIColor greenColor] forState:UIControlStateNormal];
        button.accessibilityValue = [NSString stringWithFormat:@"%d", i+1];
        button.frame = CGRectMake(startX, 0, buttonWidth, 50.0);
        [[button layer] setBorderWidth:2.0f];
        [[button layer] setBorderColor:[UIColor greenColor].CGColor];
        button.layer.cornerRadius = 5;
        startX = startX + buttonWidth + 5;
        NSLog(@"startX===%d==%d", i, startX);
        buttonWidth = buttonWidth + 5;
        [myScrollView addSubview:button];
    }

    NSLog(@"startX final===%d", startX);

    myScrollView.contentSize = CGSizeMake(startX, 50.0);
}

-(IBAction)aMethod:(id)sender {
    UIButton *mButton = (UIButton *)sender;
    NSLog(@"clicked button index is %@", mButton.accessibilityValue);
    focusPosition = 0;
    int totalButtonsToAdd = 20;
    int buttonWidth = 60;
    startX = 0;
    for (int i=0;i<totalButtonsToAdd;i++) {
        startX = startX + buttonWidth + 5;
        buttonWidth = buttonWidth + 5;

        if (i==[mButton.accessibilityValue intValue]) {
            focusPosition = startX;
        }
    }

    NSLog(@"focusPosition===%d", focusPosition);

    CGRect frame = CGRectMake(focusPosition, 0, buttonWidth, 50); //wherever you want to scroll
    [myScrollView scrollRectToVisible:frame animated:NO];


}

However this don't give me exact what I want. Is there any property for scrollview that will bring that button in center?

Project with above code

Note: This is sample for iPhone 6 only. So please run project on iPhone 6 simulator only

Upvotes: 0

Views: 501

Answers (3)

johnpatrickmorgan
johnpatrickmorgan

Reputation: 2372

UICollectionView would probably have been a better choice than a UIScrollView, since it adds a method to achieve just what you want (scrollToItemAtIndexPath:atScrollPosition:animated:).

If you're sticking with UIScrollView, you'll need to use setContentOffset:animated: instead, and compute the desired offset, e.g.:

-(IBAction)aMethod:(UIButton *)button {
    CGPoint contentOffset = CGPointMake(CGRectGetMidX(button.frame) - (CGRectGetWidth(self.scrollView.frame) / 2.0),0.0);

    [myScrollView setContentOffset:contentOffset animated:YES];
}

Upvotes: 1

Ankit Saini
Ankit Saini

Reputation: 294

Here is the link of a sample project which is doing the same as you want. This include one class named PagedFlowView. sample project to center a view in scrollview

Upvotes: 0

Thorory
Thorory

Reputation: 1

The UIScrollView function - (void)scrollRectToVisible:(CGRect)rect animated:(BOOL)animated does almost that.

Reference says: "This method scrolls the content view so that the area defined by rect is just visible inside the scroll view. If the area is already visible, the method does nothing."

Sorry, just saw you've already found that function.

Upvotes: 0

Related Questions