IOS 7 CollectionViewFlowLayout 3D Translation (как новый Safari Tabviewer)

Question

Моя проблема

Я хочу реализовать CollectionView с CollectionViewFlowLayout, который выглядит как Safari PageViewer (см скриншот)

Поскольку Apple цитировал такие вещи, как «г -index "и" Transformations "просты в реализации. После нескольких дней следующих уроков и исследований я не смог это сделать.

Я следовал за обычным CollectionViewFlowLayout и перешел в подкласс CollectionView FlowLayout. Теперь я попробовал

-(NSArray*)layoutAttributesForElementsInRect:(CGRect)rect 

-(void)modifyLayoutAttributes:(UICollectionViewLayoutAttributes *)layoutAttributes 

и

-(UICollectionViewLayoutAttributes *)layoutAttributesForItemAtIndexPath:(NSIndexPath *)indexPath 

в моих попытках дать клетки в 3D Transform.

Но layoutAttributesForItemAtIndex никогда не называли (нашел несколько объяснений этого, но я не очень понимаю)

И попробовав другие методы так и не работает (не было 3D трансформации видны на клетках.)

Вот мои попытки, так что вы можете увидеть, что я пробовал:

// это один никогда не был назван

-(UICollectionViewLayoutAttributes *)layoutAttributesForItemAtIndexPath:(NSIndexPath *)indexPath 
{ 

    UICollectionViewLayoutAttributes *attributes = 
    [super layoutAttributesForItemAtIndexPath:indexPath]; 


    [attributes setTransform3D:CATransform3DMakeTranslation(10.0, 20.0, 10.0)]; 
    attributes.transform3D = CATransform3DMakeScale(1.0, 2.0, 1.0); 


    return attributes; 
} 

// этот был вызван, но трансформация не работала по желанию.

-(NSArray*)layoutAttributesForElementsInRect:(CGRect)rect 
    { 

     NSArray *allAttributesInRect = [super 
             layoutAttributesForElementsInRect:rect]; 

     for (UICollectionViewLayoutAttributes *cellAttributes in allAttributesInRect) 
     { 
      cellAttributes.size=CGSizeMake(300, 300); 
      cellAttributes.transform3D = CATransform3DMakeScale(1.0, 2.0, 1.0); 
      cellAttributes.transform3D = CATransform3DMakeTranslation(1, 200, 100); 


       [self modifyLayoutAttributes:cellAttributes]; 
     } 
     return allAttributesInRect; 
    } 

// это тоже не работает

-(void)modifyLayoutAttributes:(UICollectionViewLayoutAttributes *)layoutAttributes 
{ 
    if ([layoutAttributes.indexPath isEqual:_currentCellPath]) 
    { 

     Assign the new layout attributes 
     layoutAttributes.size = CGSizeMake(300, 300); 
     layoutAttributes.transform3D = CATransform3DMakeScale(_currentCellScale, _currentCellScale, 1.0); 
     layoutAttributes.center = _currentCellCenter; 
    } 
} 

Вот мой вопрос:

ли кто-нибудь есть идеи, как реализовать это «Coverflow» -как CollectionView и может мне помочь?

Неправильно ли я использую методы CollectionViewFlowLayout или неправильно использую CATransform3D?

благодаря

Answer 1

Проекты GitHub WKPagesCollectionView и NFSafariTabs показывают, как это может быть достигнуто.

UICollectionViewLayoutAttributes *attributes = [UICollectionViewLayoutAttributes layoutAttributesForCellWithIndexPath:indexPath]; 

    // rotation 
    CGFloat angleOfRotation = -61.0; 
    CATransform3D rotation = CATransform3DMakeRotation((M_PI*angleOfRotation/180.0f), 1.0, 0.0, 0.0); 

    // perspective 
    CGFloat depth = 300.0; 
    CATransform3D translateDown = CATransform3DMakeTranslation(0.0, 0.0, -depth); 
    CATransform3D translateUp = CATransform3DMakeTranslation(0.0, 0.0, depth); 
    CATransform3D scale = CATransform3DIdentity; 
    scale.m34 = -1.0f/1500.0; 
    CATransform3D perspective = CATransform3DConcat(CATransform3DConcat(translateDown, scale), translateUp); 

    // final transform 
    CATransform3D transform = CATransform3DConcat(rotation, perspective); 

Answer 2

Это не может полностью ответить на ваш вопрос, но this question говорит вам, как перспективно вращать точку зрения. После экспериментирования с кодом я изменил m34 на m24, а -500 - на 500.

Окончательный код выглядел примерно так:

CALayer *layer = myView.layer; 
CATransform3D rotationAndPerspectiveTransform = CATransform3DIdentity; 
rotationAndPerspectiveTransform.m24 = 1.0/500; 
rotationAndPerspectiveTransform = CATransform3DRotate(rotationAndPerspectiveTransform, 45.0f * M_PI/180.0f, 0.0f, 1.0f, 0.0f); 
layer.transform = rotationAndPerspectiveTransform; 

Надеется, что это помогает!