RFQuiltLayout icon indicating copy to clipboard operation
RFQuiltLayout copied to clipboard

Each box when tapped has to be expanded from the same position

Open ambili opened this issue 11 years ago • 0 comments

I wanted 3 boxes in a single row with the same size. When user taps on any box, it must get enlarged & the other items have to get aligned accordingly.

I am using the same code given in RFQuiltLayout, but made a few changes as given below.

- (void)viewDidLoad {
    .....
    RFQuiltLayout* layout = (id)[self.collectionView collectionViewLayout];
    layout.direction = UICollectionViewScrollDirectionVertical;
    layout.blockPixels = CGSizeMake(97,97);
    [self.collectionView reloadData];
}


- (void) setNumberArrays {

    [self.numbers removeAllObjects];
    [self.numberWidths removeAllObjects];
    [self.numberHeights removeAllObjects];

    for (NSInteger i = 0; i< [[self.entries objectAtIndex:0] count]; i++) {

        [self.numbers addObject:@(i)];
        if (i == AppDelegateObj.bigBoxIndex) {
            [self.numberWidths addObject:@(2)];
            [self.numberHeights addObject:@(2)];
        }
        else {
            [self.numberWidths addObject:@(1)];
            [self.numberHeights addObject:@(1)];
        }
    }
}


- (void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath
{
    if (AppDelegateObj.bigBoxIndex == -1) {
        AppDelegateObj.bigBoxIndex = indexPath.row;
    }
    else {
        AppDelegateObj.bigBoxIndex = -1;
    }
    [self setNumberArrays];
    if(!self.numbers.count || indexPath.row > self.numbers.count) return;
    if(isAnimating) return;
    isAnimating = YES;
    [self.collectionView performBatchUpdates:^{
        [self.collectionView reloadData];
    } completion:^(BOOL done) {
        isAnimating = NO;
    }];
}

screen shot 2014-04-29 at 4 37 53 pm

When user taps on a box, I am just reassigning the arrays 'self.numbers', 'self.numberWidths', 'self.numberHeights' & reloading the UICollectionView.

Suppose user taps on 2, as per the current code the below is happening,

screen shot 2014-04-29 at 4 38 10 pm

But I want the output to look like,

screen shot 2014-04-29 at 4 54 34 pm

Please suggest what is the change to be made on code. I tried a lot to change. But failed :(

ambili avatar Apr 29 '14 11:04 ambili