[iOS] ScrollView

ScrollView 이벤트와 델리게이트에 대해 알아 보겠습니다.

 

ScrollView

화면의 크기보다 더 큰 콘텐츠의 크기를 가진 컨텐츠를 표현하기 위한 뷰 입니다.

스크롤 뷰의 크기와 콘텐츠의 크기

뷰의 크기는 프레임(frame)을 이용해서 뷰 자체의 크기를 얻어 올 수 있습니다. 스크롤 뷰의 경우에는 콘텐츠의 크기와 스크롤 뷰에 나타나는 위치 정보를 다뤄야합니다.

• Content size : CGSize 구조체를 사용하고 콘텐츠의 크기를 설정

• Content offset : CGPoint 구조체를 사용하고 콘텐츠가 스크롤 뷰에 표시되는 위치를 설정합니다. 곧 Bounds의 X좌표, Y좌표를 의미하는 것으로서 스크롤을 한다는 자체가 ContentOffset이 변하는 것입니다.

• Content inset : UIDegeInsets 구조체로 스크롤 뷰에 표시되는 콘텐츠 뷰의 외부 여백의 크기를 위, 왼쪽, 아래, 오른쪽 순서로 설정.

 

ContentOffset과 ContentInset에 대해 더 궁금하다면  [iOS] ContentOffset과 ContentInset를 참고하세요

 

스크롤 기능

// 콘텐츠의 크기
var contentSize: CGSize

// 콘텐츠의 위치
var contentOffset: CGPoint

// 스크롤 뷰에 표시되는 콘텐츠 외부의 여백
var contentInset: UIEdgeInsets

// 스크롤 기능 활성화
var isScrollEnabled: Bool

// 콘텐츠 가장자리 경계에서 튕기며 돌아오는 속성 설정
var bounces: Bool

//원하는 Offset으로 이동한다.
func setContnetOffset(_ contentOffset: CGPoint, animate: Bool)

// 원하는 CGRect위치로 이동한다.
func scrollRectToVisible(_ rect: CGRect, animated: Bool)

 

스크롤 이벤트와 델리게이트

스크롤 동작은 사용자가 터치하고 끄는동작(Dragging)으로 시작한다. Dragging하는 속도에 맞춰서 스크롤되다가 손가락을 떼면 스크롤 속도가 줄어들면서(Decelerate) 스크롤 동작이 멈춥니다.

 

스크롤 동작에 관련된 UIScrollViewDelegate프로토콜에 정의된 메소드

// 스크롤 뷰를 끌기 시작
func scrollViewWillBeginDragging(_ scrollView: UIScrollView)

// 스크롤을 끝냈을때
func scrollViewWillEndDragging(_ scrollView: UIScrollView, withVelocity velocity: CGPoint, targetContentOffset: UnsafeMutablePointer<CGPoint>)

func scrollViewDidEndDragging(_ scrollView: UIScrollView, willDecelerate decelerate: Bool)

// 스크롤 뷰에서 스크롤 속도가 줄어드는 경우
func scrollViewWillBeginDecelerating(_ scrollView: UIScrollView)
func scrollViewDidEndDecelerating(_ scrollView: UIScrollView)

// 스크롤을 할 때마다
func scrollViewdidScroll(_ scrollView: UIScrollView)

 

스크롤 상태

사용자가 터치가 닿은 상태인지 끄는 동작인지 체크

// 터치가 닿아있는 중
var isTracking: Bool { get }

// 끄는 동작 중
var isDragging: Bool { get }

// 감속 중
var Decelerating: Bool { get }

 

상태바 터치시 최상위로 스크롤

// 가장 위쪽으로 스크롤 기능 사용 여부
var scrollsToTop: Bool

 

델리게이트

func scrollViewShouldScrollToTop(_ scrollView: UIScrollView) -> Bool

func scrollViewDidScrollToTop(_ scrollView: UIScrollView)

 

확대 / 축소

스크롤 뷰가 제공하는 콘텐츠 확대/축소 기능을 사용하려면 스크롤 뷰에 줌 비율을 설정해야합니다.

// 프로퍼티
var zoomScale: CGFloat
var minimumZoomScale: CGFloat
var maximumZoomScale: CGFloat

// 코드
func zoom(to rect: CGRect, animated: Bool)
func setZoomScale(_ scale: CGFloat, animated: Bool)

그리고 스크롤 뷰 델리게이트에서 viewForZoomingInScrollView 메소드를 이용해서 확대/축소를 하는 뷰를 제공해야합니다.

func viewForZooming(in scrollView: UIScrollView) -> UIView?

// 이런식으로 대상을 리턴시켜주면 확대/ 축소가 가능해집니다.
func viewForZooming(in scrollView: UIScrollView) -> UIView? {
    return imageView
}

또 확대 / 축소를 하면 스크롤 뷰는 델리게이트에게 다음의 메소드를 이용해서 확대/축소 동작에 대응할 수 있도록 해줍니다.

func scrollViewDidZoom(_ scrollView: UIScrollView)