[iOS/Swift] ScrollView 자동스크롤 구현 (feat. LayoutCycle)

PinLayout, FlexLayout으로 ScrollView를 포함하여 작성하였다.

 

UITextView에 글을 입력하면 UITextVIew 전체 크기도 바뀌도록 구현하였다.

하지만, UITextView 크기가 화면을 넘어가면 자동으로 스크롤이 안됐다.

그래서 자동 스크롤 기능을 구현하기 위해 검색을 하여서 아래 블로그 글을 참조하였다.

 

https://velog.io/@lwb112/%EC%8A%A4%ED%81%AC%EB%A1%A4%EB%B7%B0-%EC%9E%90%EB%8F%99%EC%8A%A4%ED%81%AC%EB%A1%A4

스크롤뷰 자동스크롤

 

private func goToBottomOfScrollView() {
        guard let scrollView = historyScrollView else { return }
        scrollView.scrollRectToVisible(CGRect(x: 0,
                                              y: scrollView.contentSize.height - scrollView.bounds.height,
                                              width: scrollView.bounds.size.width,
                                              height: scrollView.bounds.size.height),
                                       animated: true)
    }

 

하지만 해당 함수를 내 코드안 어느 위치에 넣어야 할지 몰라서 여기저기 넣어봤다.

 

먼저 viewDidLoad()에 넣어봤다.

override func viewDidLoad() {
        super.viewDidLoad()
        view.backgroundColor = .white
        
        
        self.navigationItem.title = "팀 추가"
        self.navigationItem.rightBarButtonItem = UIBarButtonItem(title: "완료", style: .plain, target: self, action: #selector(addCompleteBtnClicked))
        navigationItem.rightBarButtonItem?.isEnabled = false
        
        addImageButtonSet()
        setLayout()
        
        // 자동 스크롤
        goToBottomOfScrollView()

        
    }

 

하지만 아래처럼 자동 스크롤이 안됐다.

 

그래서 LayoutCycle 에 대해 알아봤다.

LayoutCycle

 

현재 내 코드에서 텍스트 뷰 크기 조절하는 함수는 UITextViewDelegate로 적용을 하였다.

그리고 이 스크롤 크기가 조절되는 코드는 viewDIdLayoutSubviews에 작성되어 있다.

텍스트 입력시 텍스트 뷰 크기가 변하고 이에 따라 Scroll VIew가 변한다.

따라서 viewDidLayoutSubviews()의 마지막 부분에 작성해주는 것이 맞다고 생각했다.

 

override func viewDidLayoutSubviews() {
        super.viewDidLayoutSubviews()
        
        teamScrollView.pin.all(view.pin.safeArea)
        containerView.pin.all()
        
        containerView.flex.layout(mode: .adjustHeight)
        addLabel.pin.vCenter(to: addImageView.edge.vCenter)
        addLabel.pin.hCenter(to: addImageView.edge.hCenter)
        deleteImageBtn.pin.topRight(to: addImageView.anchor.topRight)
        
        
        teamScrollView.contentSize = containerView.frame.size
        
        // 자동 스크롤
        goToBottomOfScrollView()
    }

 

하지만 아래와 같이 뷰가 정신을 못차리고 산만하게 위아래로 계속 움직였다.

 

자동 스크롤 함수를 잘못된 부분에 넣었나 싶었지만, 알고보니 해결은 간단했다.

 

해당 코드에서 animated를 false로 바꿔주니 해결되었다.

 // 자동 스크롤
    private func goToBottomOfScrollView() {
        let scrollView = teamScrollView
        scrollView.scrollRectToVisible(CGRect(x: 0,
                                              y: scrollView.contentSize.height - scrollView.bounds.height,
                                              width: scrollView.bounds.size.width,
                                              height: scrollView.bounds.size.height),
                                       animated: false)
    }