[ios] 모바일 사파리 탭과 같은 UIScrollView 수평 페이징

Mobile Safari를 사용하면 하단에 페이지 컨트롤이있는 일종의 UIScrollView 수평 페이징보기를 입력하여 페이지를 전환 할 수 있습니다.

가로로 스크롤 가능한 UIScrollView가 다음보기의 콘텐츠 중 일부를 표시하는이 특정 동작을 복제하려고합니다.

Apple에서 제공 한 예제 : PageControl은 가로 페이징에 UIScrollView를 사용하는 방법을 보여 주지만 모든보기는 전체 화면 너비를 차지합니다.

모바일 Safari처럼 다음보기의 일부 콘텐츠를 표시하는 UIScrollView를 얻으려면 어떻게해야합니까?



답변

UIScrollView페이징이 활성화 된 A 는 프레임 너비 (또는 높이)의 배수에서 중지됩니다. 따라서 첫 번째 단계는 페이지의 너비를 파악하는 것입니다. 그 너비를 UIScrollView. 그런 다음 서브 뷰의 크기를 원하는만큼 크게 설정하고 UIScrollView의 폭의 배수를 기반으로 중앙을 설정하십시오 .

그런 다음, 사용자가 설정 물론 다른 페이지,보고 싶은 이후 clipsToBoundsNOmhjoy이 명시된 바와 같이합니다. 트릭 부분은 사용자가 UIScrollView의 프레임 범위 밖에서 드래그를 시작할 때 스크롤하도록하는 것 입니다. 내 솔루션 (최근에이 작업을 수행해야했을 때)은 다음과 같습니다.

크리에이트 UIView서브 클래스 (즉 ClipView포함) UIScrollView과의 파단. 본질적으로, 그것은 당신이 UIScrollView정상적인 상황에서 가질 것이라고 가정하는 틀을 가져야합니다 . 장소 UIScrollView의 중심에 ClipView. 너비가 부모보기의 너비보다 작 으면 ClipViewclipsToBounds가로 설정되어 있는지 확인하십시오 YES. 또한에 ClipView대한 참조가 필요합니다 UIScrollView.

마지막 단계는 무시하는 것입니다 - (UIView *)hitTest:withEvent:내부 ClipView.

- (UIView *)hitTest:(CGPoint)point withEvent:(UIEvent *)event {
  return [self pointInside:point withEvent:event] ? scrollView : nil;
}

이것은 기본적으로 터치 영역을 UIScrollView부모 뷰의 프레임 으로 확장 합니다. 정확히 필요한 것입니다.

또 다른 옵션은 메서드 를 하위 클래스 화 UIScrollView하고 재정의하는 - (BOOL)pointInside:(CGPoint) point withEvent:(UIEvent *) event것이지만 클리핑을 수행하려면 컨테이너 뷰가 여전히 필요하며 의 프레임 YES만을 기준 으로 반환 할시 기를 결정하기 어려울 수 있습니다 UIScrollView.

참고 : 하위보기 사용자 상호 작용에 문제가있는 경우 Juri Pakaste의 hitTest : withEvent : 수정 도 살펴 봐야 합니다.


답변

ClipView위 의 솔루션은 저에게 효과적이지만 다른 -[UIView hitTest:withEvent:]구현 을 수행해야했습니다 . Ed Marty의 버전은 수평 스크롤 뷰 내부에있는 수직 스크롤 뷰로 작업하는 사용자 상호 작용을 얻지 못했습니다.

다음 버전이 저에게 효과적이었습니다.

-(UIView*)hitTest:(CGPoint)point withEvent:(UIEvent*)event
{
    UIView* child = nil;
    if ((child = [super hitTest:point withEvent:event]) == self)
        return self.scrollView;
    return child;
}


답변

scrollView의 프레임 크기를 페이지 크기로 설정하십시오.

[self.view addSubview:scrollView];
[self.view addGestureRecognizer:mainScrollView.panGestureRecognizer];

이제에서 패닝 할 수 self.view있으며 scrollView의 콘텐츠가 스크롤됩니다.
또한 scrollView.clipsToBounds = NO;내용이 잘리지 않도록 사용 합니다.


답변

사용자 지정 UIScrollView를 사용하는 것은 나에게 가장 빠르고 간단한 방법 이었기 때문입니다. 그러나 정확한 코드를 보지 못해서 공유 할 것이라고 생각했습니다. 내 요구 사항은 콘텐츠가 작은 UIScrollView가 필요했기 때문에 UIScrollView 자체는 페이징 효과를 얻기 위해 작았습니다. 게시물에 나와 있듯이 스 와이프 할 수 없습니다. 하지만 이제 할 수 있습니다.

CustomScrollView 클래스와 UIScrollView 하위 클래스를 만듭니다. 그런 다음 .m 파일에 추가하기 만하면됩니다.

- (BOOL)pointInside:(CGPoint)point withEvent:(UIEvent *)event {
  return (point.y >= 0 && point.y <= self.frame.size.height);
}

이를 통해 좌우 (수평)로 스크롤 할 수 있습니다. 그에 따라 경계를 조정하여 스 와이프 / 스크롤 터치 영역을 설정합니다. 즐겨!


답변

자동으로 scrollview를 반환 할 수있는 다른 구현을 만들었습니다. 따라서 프로젝트에서 재사용을 제한하는 IBOutlet이 필요하지 않습니다.

- (UIView *)hitTest:(CGPoint)point withEvent:(UIEvent *)event
{
    if ([self pointInside:point withEvent:event]) {
        for (id view in [self subviews]) {
            if ([view isKindOfClass:[UIScrollView class]]) {
                return view;
            }
        }
    }
    return nil;
}


답변

ClipView hitTest 구현에 대해 잠재적으로 유용한 또 다른 수정이 있습니다. ClipView에 대한 UIScrollView 참조를 제공 할 필요가 없었습니다. 아래 구현을 통해 ClipView 클래스를 재사용하여 모든 항목의 적중 테스트 영역을 확장 할 수 있으며 참조를 제공 할 필요가 없습니다.

- (UIView *)hitTest:(CGPoint)point withEvent:(UIEvent *)event
{
    if (([self pointInside:point withEvent:event]) && (self.subviews.count >= 1))
    {
        // An extended-hit view should only have one sub-view, or make sure the
        // first subview is the one you want to expand the hit test for.
        return [self.subviews objectAtIndex:0];
    }

    return nil;
}


답변

위의 upvoted 제안을 구현했지만 UICollectionView프레임 밖의 모든 것을 화면에서 벗어나는 것으로 간주했습니다. 이로 인해 사용자가 자신을 향해 스크롤 할 때 주변 셀이 경계를 벗어나 만 렌더링되었는데 이는 이상적이지 않았습니다.

내가 한 일은 아래의 메소드를 델리게이트 (또는 UICollectionViewLayout) 에 추가하여 스크롤 뷰의 동작을 에뮬레이션하는 것 입니다.

- (CGPoint)targetContentOffsetForProposedContentOffset:(CGPoint)proposedContentOffset withScrollingVelocity:(CGPoint)velocity
{
  if (velocity.x > 0) {
    proposedContentOffset.x = ceilf(self.collectionView.contentOffset.x / pageSize) * pageSize;
  }
  else {
    proposedContentOffset.x = floorf(self.collectionView.contentOffset.x / pageSize) * pageSize;
  }

  return proposedContentOffset;
}

이렇게하면 스 와이프 동작의 위임을 완전히 피할 수 있으며 이는 또한 보너스였습니다. 는 UIScrollViewDelegate라는 유사한 방법이 scrollViewWillEndDragging:withVelocity:targetContentOffset:페이지 UITableViews 및 UIScrollViews에 사용될 수있다.