iOS 드 롭 다운 리 셋 gif 실시 간 애니메이션 효과 구현

최근 에는 앱 드 롭 다운 이 새로 고침 되 는 쿨 한 효 과 를 많이 보 았 는데, 그림 은 드 롭 다운 높이 와 함께 프레임 이 변화 하 는 효과 가 있다.많은 자 료 를 찾 았 지만 이런 효과 demo 를 찾 지 못 했 습 니 다...그러나 고도 로 선 을 그 리 는 라인 애니메이션 을 계산 하여 이 루어 진 demo 도 찾 았 습 니 다. 이 효과 도 매우 좋 은 demo 전송 문 입 니 다.
이런 효 과 를 실현 하려 면 비교적 복잡 한 라인 알고리즘 이 필요 하고 시간 원가 가 비교적 크다.그래서 저 는 더 간단 한 드 롭 다운 애니메이션 효 과 를 실 현 했 습 니 다. 전체적인 사고 와 일반적인 드 롭 다운 리 셋 차이 가 많 지 않 습 니 다. 먼저 gif 그림 의 모든 프레임 을 얻 은 다음 에 scrollView Did Scroll: 리 셋 에서 프레임 논 리 를 합 니 다.그 중에서 ibime 대신 의 YYImage 이미지 프레임 워 크 를 사용 하여 gif 프레임 작업 에 사용 합 니 다.
일부 드 롭 다운 리 셋 구성 요 소 는 KVO 와 제스처 를 결합 하여 이 루어 집 니 다. 이렇게 하면 구성 요소 화 에 더욱 적합 합 니 다. 예 를 들 어 MJrefresh.저 는 편 의 를 위해 scrollViewDid Scroll: scrollViewWillEndDragging: 리 셋 방법 으로 이 루어 졌 습 니 다.핵심 방법 은 다음 코드 를 보십시오.

- (void)scrollViewDidScroll:(UIScrollView *)scrollView
{
    CGFloat y = scrollView.contentOffset.y;
    NSLog(@"offsetY:%f",y);
    CGFloat dis = head_h/self.imgArr.count;
    int yy = abs((int)y);
    //             ，       
    if (y < 0 && yy < head_h) {
        //            
        NSInteger index = yy/dis;
        index = index >= self.imgArr.count ? self.imgArr.count - 1 : index;
        NSLog(@"index:%ld",index);
        [self.refreshImg stopAnimating];
        self.refreshImg.currentAnimatedImageIndex = index;
    }
}

- (void)scrollViewWillEndDragging:(UIScrollView *)scrollView withVelocity:(CGPoint)velocity targetContentOffset:(inout CGPoint *)targetContentOffset
{
    CGFloat y = scrollView.contentOffset.y;
    int yy = abs((int)y);
    //             
    if (y < 0 && yy >= head_h) {
        [self ll_beginRefresh];
    }
}

//    
- (void)ll_beginRefresh
{
    [UIView animateWithDuration:0.3 animations:^{
        
        //       top
        UIEdgeInsets inset = self.tableView.contentInset;
        inset.top = self->head_h;
        self.tableView.contentInset = inset;
        //       
        CGPoint offset = self.tableView.contentOffset;
        offset.y = -self->head_h;
        [self.tableView setContentOffset:offset animated:NO];
        
    } completion:^(BOOL finished) {
        //    
        [self.refreshImg startAnimating];
        self->_pullHandler(self);
    }];
    
}

//    
- (void)ll_endRefresh
{
    [self.refreshImg startAnimating];
    [UIView animateWithDuration:0.3 animations:^{
        
        //       top
        UIEdgeInsets inset = self.tableView.contentInset;
        inset.top = 0;
        self.tableView.contentInset = inset;
        //       
        CGPoint offset = self.tableView.contentOffset;
        offset.y = 0;
        [self.tableView setContentOffset:offset animated:NO];
        
    } completion:^(BOOL finished) {
        //    
        [self.refreshImg stopAnimating];
    }];
    
}

마지막 으로 실현 효 과 는 마지막 으로 전체 demo 소스 코드 를 첨부 합 니 다. demo 는 실현 방향 만 제공 할 뿐 디 테 일 을 최적화 할 수 있 습 니 다. 괜 찮 으 시 면 star 해 주세요. 감사합니다.