[UIKit] UIScrollView "Scrollable content size is ambiguous." 에러 해결

 

아래 코드처럼 요상하게 구현했었는데... 조작하는 데나 보여지는 뷰에서는 아무 문제가 없었지만, View Hierarchy를 보면 제약조건 에러가 있는 게 너무너무 거슬려서 결국 해결했다!

 

(평소 scrollView 에러는 터치나 스크롤이 안 되는 등의 문제가 있었지만, 이 경우는 모든 인터랙션이 다 가능하긴 했음.) 

원래 코드 (SnapKit 사용)

        self.view.addSubviews([scrollView])
        self.scrollView.addSubview(contentView)
        self.contentView.addSubviews([infoTitleLabel, profileInfoView, tagTitleLabel, tagCollectionView, emailTitleLabel, emailButton])
        
        self.scrollView.snp.makeConstraints { make in
            make.edges.equalToSuperview()
        }
        
        self.contentView.snp.makeConstraints { make in
            make.width.equalToSuperview()
            make.centerX.top.bottom.equalToSuperview()
        }

 

 

 

 

여러 블로그를 참고해 본 결과... scrollView를 이용해 레이아웃을 구현할 때의 나의 대전제(?)를 세울 수 있었는데

1️⃣ scrollView는 top, bottom, leading(left), trailing(right)를 모두 스크롤 될 영역 사이즈에 맞춘다. (보통 equalToSuperView 사용)

self.scrollView.snp.makeConstraints { make in
    make.edges.equalToSuperview()
}

2️⃣ scrollView 안에 들어가는 contentView는 top, bottom, leading(left), trailing(right)는 모두 equalToSuperView를 사용하여 scrollView 영역과 동일하게 맞추고, 세로 스크롤을 원하면 width를 equalToSuperView, 가로 스크롤을 원하면 height를 equalToSuperView 한다.

self.contentView.snp.makeConstraints { make in
    make.edges.width.equalToSuperview() // 세로 스크롤
}

4️⃣ contentView의 height는 항상 정해져 있어야 하며, height 값을 직접 넣을 수도 있고, contentView의 하위 UI 컴포넌트들을 통해 height을 설정해도 된다. (하위 UI 컴포넌트를 통해 contentView의 사이즈가 결정되므로,,, (세로 스크롤이면 height가 결정됨) 하위 컴포넌트들의 제약 조건을 잘 넣었는지 확인한다!

self.infoTitleLabel.snp.makeConstraints { make in
    make.top.equalToSuperview().inset(26) // top 설정!
    make.horizontalEdges.equalToSuperview().inset(20)
    make.height.equalTo(27) // height 1
}
self.profileInfoView.snp.makeConstraints { make in
    make.top.equalTo(self.infoTitleLabel.snp.bottom).offset(10)
    make.horizontalEdges.equalToSuperview().inset(20)
    make.height.equalTo(194) // height 2
    make.bottom.equalToSuperView().inset(40) // bottom 설정!
}

 

 

 

해결!

전체 코드

self.view.addSubviews([scrollView])
self.scrollView.addSubview(contentView)
self.contentView.addSubviews([infoTitleLabel, profileInfoView])

self.scrollView.snp.makeConstraints { make in
    make.edges.equalToSuperview()
}

self.contentView.snp.makeConstraints { make in
    make.edges.width.equalToSuperview()
}

self.infoTitleLabel.snp.makeConstraints { make in
    make.top.equalToSuperview().inset(26) // top 설정!
    make.horizontalEdges.equalToSuperview().inset(20)
    make.height.equalTo(27) // height 1
}
self.profileInfoView.snp.makeConstraints { make in
    make.top.equalTo(self.infoTitleLabel.snp.bottom).offset(10)
    make.horizontalEdges.equalToSuperview().inset(20)
    make.height.equalTo(194) // height 2
    make.bottom.equalToSuperView().inset(40) // bottom 설정!
}

 

 

~ 아닐 수도 있음 ~