2016-04-11 2 views
2

Я хотел бы реализовать эффект «масштабирования» на пейджинге UIScrollView, который я создал, но у меня много трудностей. Моя цель состоит в том, что, когда пользователь начинает прокручиваться до следующей страницы, текущая страница масштабируется, становясь немного меньше. Когда появится следующая страница, она масштабируется до тех пор, пока она не станет ее полным размером. Ближе всего я мог бы найти в качестве примера был этот ...Эффект увеличения на Paging UIScrollView?

https://www.pinterest.com/pin/147141112804210631/

Может кто-нибудь дать мне несколько советов о том, как это сделать? Я вот-вот ударил головой о стену в течение последних 3 дней.

+0

Опубликованный ответ ниже, который должен делать то, что вы хотите, - сообщите мне, если у вас возникнут проблемы! – trdavidson

+0

@shadowman, я опубликовал немного другой ответ, который должен дать вам гибкость и контроль, в которых вы нуждаетесь. – barndog

ответ

1

Я бы рекомендовал использовать scrollView.contentOffset.y вашего UIScrollView разбитого на страницах, чтобы следить за свиток и использовать это значение для анимации преобразования ваших взглядов внутри UIScrollView.

Итак, добавьте свой разбитый на страницу прокрутки и сделайте себя как делегат.

paginatedScrollView = [[UIScrollView alloc] initWithFrame:CGRectMake(0, 0, [[self view] bounds].size.width, [[self view] bounds].size.height-paginatedScrollViewYOffset)]; 
    [self.view addSubview:paginatedScrollView]; 

    paginatedScrollView.pagingEnabled = YES; 
    [paginatedScrollView setShowsVerticalScrollIndicator:NO]; 
    [paginatedScrollView setShowsHorizontalScrollIndicator:NO]; 
    [paginatedScrollView setAlwaysBounceHorizontal:NO]; 
    [paginatedScrollView setAlwaysBounceVertical:YES]; 
    paginatedScrollView.backgroundColor = [UIColor clearColor]; 

    paginatedScrollView.contentSize = CGSizeMake([[self view] bounds].size.width, [[self view] bounds].size.height*2); //this must be the appropriate size depending of the number of pages you want to scroll 

    paginatedScrollView.delegate = self; 

Затем использовать метод делегата scrollViewDidScroll, чтобы следить за scrollView.contentOffset.y

- (void) scrollViewDidScroll:(UIScrollView *)scrollView { 

    NSLog(@"Scroll Content Offset Y: %f",scrollView.contentOffset.y); 
    //use here scrollView.contentOffset.y as multiplier with view.transform = CGAffineTransformMakeScale(0,0) or with view.frame to animate the zoom effect 

    } 
+0

Имеет смысл. Итак, в прокрутке scrollViewDid, где я бы поставил код для постепенного изменения размера? – Shadowman

+0

Да, и вы можете запускать анимацию эффекта масштабирования для разных подзонов, зная, на какой странице они расположены со следующей строкой -int indexOfPage = scrollView.contentOffset.y/scrollView.frame.size.height; –

1

Используйте этот код Scrollview его наезд при прокрутке следующей страница, код приведена ниже,

-(UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath 
{ 


    GridCollectionViewCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:@"CollectCell" forIndexPath:indexPath]; 
    cell.myscrollview.minimumZoomScale = 5.0; 
    cell.myscrollview.zoomScale = 5.0; 
    cell.myscrollview.contentSize = cell.contentView.bounds.size; 
    return cell; 
} 

, если вы измените значение шкалы масштабирования его автоматическое увеличение или уменьшение масштаба, чтобы быть показан при прокрутке следующего или Предыдущая страница.

надеюсь, что это будет полезно.

1

Я на самом деле просто отправил ответ на очень похожий вопрос, где кто-то пытался добиться этого с использованием UICollectionView. Ссылка на мой ответ здесь: https://stackoverflow.com/a/36710965/3723434

Соответствующий фрагмент кода я буду размещать здесь:

Так что другой подход будет установить CGAffineTransformMakeScale (,) в UIScrollViewDidScroll где вы динамически обновлять размер этих страниц основанные на их расстоянии от центра экрана.

Для каждой страницы, вычислить расстояние от его центра до центра yourScrollView

Центр yourScrollView может быть найден с помощью этого метода отличного: CGPoint точки = [self.view convertPoint: yourScrollView .center toView: * yourScrollView];

Теперь настройте правило, что если центр страницы больше, чем x, размер страницы, например, «нормальный размер», назовите его 1. и чем ближе он дойдет до центра, тем ближе он получает в два раза больше нормального размера, 2.

, то вы можете использовать следующие, если/еще идея:

if (distance > x) { 
     page.transform = CGAffineTransformMakeScale(1.0f, 1.0f); 
} else if (distance <= x) { 

     float scale = MIN(distance/x) * 2.0f; 
     page.transform = CGAffineTransformMakeScale(scale, scale); 
} 

что происходит, что размер страницы будет точно следовать ваши прикосновения.Дайте мне знать, если у вас есть еще вопросы, поскольку я пишу большую часть этого из головы).

0

Раньше я занимался стилизованной страницей руководства для приложений.

Для меня, я бы использовал CADisplayLink для отслеживания contentOffset.x scrollView, связанного с вашим процессом анимации. Не помещайте свои взгляды в scrollView, помещайте их в оверлейный вид этого scrollView.

Это решение следует за философией: подделайте его, прежде чем вы его сделаете.

Основано на CADisplayLink и физическом моделировании UIScrollView, вы получите гладкую анимацию. Поверь мне.

0

Что вы действительно хотите, это не UIScrollView, это UICollectionView с пользовательским расположением. UICollectionViewLayoutAttributes имеет свойство transform, которое вы можете установить.

Скажем, например, в layoutAttributesForElementsInRect::

override func layoutAttributesForElementsInRect(rect: CGRect) -> [UICollectionViewLayoutAttributes]? { 
    guard let attributes = super.layoutAttributesForElementsInRect(rect) else { 
     return nil 
    } 
    return attributes.map { attribute -> UICollectionViewLayoutAttributes in 
     if attribute.frame.origin.y < 0 { 
      let scale = -attribute.frame.origin.y/attribute.frame.height 
      attribute.transform = CGAffineTransformMakeScale(scale, scale) 
     } 
     return attribute 
    } 
} 

Здесь вы фильтрации по если элемент на экране (так, не видимые элементы не будут учитываться) и проверять, если y offset меньше 0. Если это так, вы берете разницу между отрицательным значением y и высотой элемента и превращаете его в пропорциональный масштаб.

Вы можете сделать это, как хотите, если хотите, чтобы шкала составляла от 1 до 0,5, например. Мне нравится, что я делаю что-то, с помощью прокрутки.

Смежные вопросы