UICollection Wyświetl powiększenie na pełnym ekranie UICollectionViewCell

Question

Jak można powiększyć UICollectionViewCell, aby był wyświetlany na pełnym ekranie? Mam rozszerzone UICollectionViewFlowLayout i moim zdaniem regulatora, gdy komórka jest na podsłuchu Robię to:

CGPoint pointInCollectionView = [gesture locationInView:self.collectionView]; 
NSIndexPath *selectedIndexPath = [self.collectionView indexPathForItemAtPoint:pointInCollectionView]; 
UICollectionViewCell *selectedCell = [self.collectionView cellForItemAtIndexPath:selectedIndexPath]; 

NSLog(@"Selected cell %@", selectedIndexPath); 

Nie bardzo wiesz, gdzie iść stąd. Czy urządzenie UICollectionView powinno wyświetlać powiększoną komórkę? A może powinienem stworzyć nowy kontroler widoku, który wyświetla zawartość komórki (obraz) na pełnym ekranie?

Answer 1

Podjęłam rozwiązanie here i zmodyfikowałem je nieznacznie, aby pracować z widokiem kolekcji. Dodałem również przezroczyste szare tło, aby nieco ukryć oryginalny widok (zakładając, że obraz nie zajmuje całej klatki).

@implementation CollectionViewController 
{ 
    UIImageView *fullScreenImageView; 
    UIImageView *originalImageView; 
} 

... 

// in whatever method you're using to detect the cell selection 

CGPoint pointInCollectionView = [gesture locationInView:self.collectionView]; 
NSIndexPath *selectedIndexPath = [self.collectionView indexPathForItemAtPoint:pointInCollectionView]; 
UICollectionViewCell *selectedCell = [self.collectionView cellForItemAtIndexPath:selectedIndexPath]; 

originalImageView = [selectedCell imageView]; // or whatever cell element holds your image that you want to zoom 

fullScreenImageView = [[UIImageView alloc] init]; 
[fullScreenImageView setContentMode:UIViewContentModeScaleAspectFit]; 

fullScreenImageView.image = [originalImageView image]; 
// *********************************************************************************** 
// You can either use this to zoom in from the center of your cell 
CGRect tempPoint = CGRectMake(originalImageView.center.x, originalImageView.center.y, 0, 0); 
// OR, if you want to zoom from the tapped point... 
CGRect tempPoint = CGRectMake(pointInCollectionView.x, pointInCollectionView.y, 0, 0); 
// *********************************************************************************** 
CGRect startingPoint = [self.view convertRect:tempPoint fromView:[self.collectionView cellForItemAtIndexPath:selectedIndexPath]]; 
[fullScreenImageView setFrame:startingPoint]; 
[fullScreenImageView setBackgroundColor:[[UIColor lightGrayColor] colorWithAlphaComponent:0.9f]]; 

[self.view addSubview:fullScreenImageView]; 

[UIView animateWithDuration:0.4 
       animations:^{ 
        [fullScreenImageView setFrame:CGRectMake(0, 
                0, 
                self.view.bounds.size.width, 
                self.view.bounds.size.height)]; 
       }]; 

UITapGestureRecognizer *singleTap = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(fullScreenImageViewTapped:)]; 
singleTap.numberOfTapsRequired = 1; 
singleTap.numberOfTouchesRequired = 1; 
[fullScreenImageView addGestureRecognizer:singleTap]; 
[fullScreenImageView setUserInteractionEnabled:YES]; 

... 

- (void)fullScreenImageViewTapped:(UIGestureRecognizer *)gestureRecognizer { 

    CGRect point=[self.view convertRect:originalImageView.bounds fromView:originalImageView]; 

    gestureRecognizer.view.backgroundColor=[UIColor clearColor]; 
    [UIView animateWithDuration:0.5 
        animations:^{ 
         [(UIImageView *)gestureRecognizer.view setFrame:point]; 
        }]; 
    [self performSelector:@selector(animationDone:) withObject:[gestureRecognizer view] afterDelay:0.4]; 

} 

-(void)animationDone:(UIView *)view 
{ 
    [fullScreenImageView removeFromSuperview]; 
    fullScreenImageView = nil; 
} 

Answer 2

można po prostu użyć innego układu (podobną do tej, którą już nie ma), w którym pozycja jest większy rozmiar, a następnie wykonaj setCollectionViewLayout:animated:completion: na CollectionView.

Nie potrzebujesz nowego kontrolera widoku. Twoje źródło danych pozostaje takie samo. Możesz nawet używać tej samej klasy komórek, tylko upewnij się, że wie, kiedy układać elementy dla większych rozmiarów komórek, a kiedy nie.

Jestem całkiem pewien, że tak robi Facebook w Papierze, ponieważ nie ma ponownego załadowania zawartości, tj. [collectionView reloadData] nigdy nie wydaje się być wywołany (spowodowałoby migotanie i resetowanie przesunięcia przewijania, itp.). Wydaje się to być najprostszym możliwym rozwiązaniem.

CGPoint pointInCollectionView = [gesture locationInView:self.collectionView]; 
NSIndexPath *selectedIndexPath = [self.collectionView indexPathForItemAtPoint:pointInCollectionView]; 
UICollectionViewCell *selectedCell = [self.collectionView cellForItemAtIndexPath:selectedIndexPath]; 

NSLog(@"Selected cell %@", selectedIndexPath); 

__weak typeof(self) weakSelf = self; 

[self.collectionView setCollectionViewLayout:newLayout animated:YES completion:^{ 

    [weakSelf.collectionView scrollToItemAtIndexPath:selectedIndexPath atScrollPosition:UICollectionViewScrollPositionCenteredHorizontally animated:NO]; 

}]; 

Answer 3

Można użyć MWPhotoBrowser, który jest odpowiedni dla Twojego problemu. Obsługuje funkcję Grid z funkcją "Dotknij, aby powiększyć". można je dostać od here

siatki

Aby poprawnie wyświetlić siatkę miniatur, należy upewnić się właściwość enableGrid jest ustawiona na TAK, i wdrożyć następujące metody Delegat:

(id <MWPhoto>)photoBrowser:(MWPhotoBrowser *)photoBrowser thumbPhotoAtIndex:(NSUInteger)index; 

Przeglądarkę zdjęć można również uruchomić na siatce, włączając właściwość startOnGrid.