缩放整个 UICollectionView [英] zoom entire UICollectionView

问题描述

我有一个 iPad 应用程序，我在其中使用 UICollectionView，每个 UICollectionViewCell 只包含一个 UIImage.目前我每页显示每 9 个 UIImages(3 行 * 3 列)，我有几页.

I have an iPad App where I'm using a UICollectionView and each UICollectionViewCell contains just a single UIImage. Currently I'm displaying per 9 UIImages (3 rows * 3 columns) per page, I have several pages.

我想使用 Pinch Gesture 缩放整个 UICollectionView 以增加/减少每页显示的行/列数，最好是在 Pinch 手势期间有漂亮的缩放动画！

I would like to use Pinch Gesture to zoom on the entire UICollectionView to increase/decrease the number of row/columns displayed per page and the best would be to have beautiful zoom animation during the Pinch gesture!

目前，我在 UICollectionView 上添加了捏合手势.我捕获 Pinch Gesture 事件以使用比例因子计算行数/列数，如果它已更改，则我使用以下方法更新完整的 UICollectionView:

Currently, I have added a Pinch Gesture on my UICollectionView. I catch the Pinch Gesture event to compute the number of rows/columns using the scale factor, if it has changed then I update the full UICollectionView using:

[_theCollectionView performBatchUpdates:^{
     [_theCollectionView deleteSections:[NSIndexSet indexSetWithIndex:0]];
     [_theCollectionView insertSections:[NSIndexSet indexSetWithIndex:0]];
 } completion:nil];

它可以工作，但我在过渡期间没有流畅的动画.

It works but I don't have smooth animation during the transition.

有什么想法吗?UICollectionView 继承自 UIScrollView，是否有可能重新使用 UIScrollView 捏手势功能来达到我的目标?

Any idea? UICollectionView inherits from UIScrollView, is there a possibility to re-use the UIScrollView Pinch gesture feature to reach my goal?

推荐答案

我假设您使用的是默认的 UICollectionViewDelegateFlowLayout，对吧?然后确保您对委托方法做出相应的响应，并且当出现捏合手势时，只需使布局无效.

I'm assuming you're using the default UICollectionViewDelegateFlowLayout, right? Then make sure you respond accordingly to the delegate methods, and when the pinch gesture occurs, simply invalidate the layout.

例如，如果我想调整每个项目的大小，同时捏:

For example, if I want to adjust the size of every item, while pinching:

@interface ViewController () <UICollectionViewDataSource, UICollectionViewDelegate, UICollectionViewDelegateFlowLayout>

@property (nonatomic,assign) CGFloat scale;
@property (nonatomic,weak)   IBOutlet UICollectionView *collectionView;

@end

@implementation ViewController
- (void)viewDidLoad
{
    [super viewDidLoad];

    self.scale = 1.0;

    [self.collectionView registerClass:[UICollectionViewCell class] forCellWithReuseIdentifier:@"cell"];

    UIPinchGestureRecognizer *gesture = [[UIPinchGestureRecognizer alloc] initWithTarget:self action:@selector(didReceivePinchGesture:)];
    [self.collectionView addGestureRecognizer:gesture];

}

- (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath
{
    return CGSizeMake(50*self.scale, 50*self.scale);
}

- (void)didReceivePinchGesture:(UIPinchGestureRecognizer*)gesture
{
    static CGFloat scaleStart;

    if (gesture.state == UIGestureRecognizerStateBegan)
    {
        scaleStart = self.scale;
    }
    else if (gesture.state == UIGestureRecognizerStateChanged)
    {
        self.scale = scaleStart * gesture.scale;
        [self.collectionView.collectionViewLayout invalidateLayout];
    }
}

self.scale 属性只是为了展示，您可以将相同的概念应用到任何其他属性，这不需要 beginUpdates/endUpdates，因为用户自己携带的时间规模.

The property self.scale is just for show, you can apply this same concept to any other attribute, this doesn't require a beginUpdates/endUpdates because the user himself is carrying the timing of the scale.

这是一个正在运行的项目，如果您想查看它的实际效果.

Here's a running project, in case you want to see it in action.

这篇关于缩放整个 UICollectionView的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！