트러블 슈팅 - ScrollView Subviews Width 짤림현상

ScrollView

문제점 : ScrollView의 SubView들이 화면 전체에 알맞게 설정이 되지 않음.

• 스크롤 뷰는 큰 도화지라고 생각합니다. → 도화지에서 얼만큼 그릴것인지 정해야한다!
• 스크롤 뷰는 width와 height를 설정해줘야 합니다.

SubViews 짤림 현상

설정 사항

• 스크롤뷰는 화면의 크기에 맞게 설정
• 최 상단 위의 두개의 Label을 제외한 모든 SubView뷰의 leading,trailing이 UIScrollView 기준으로 Constraint 가 걸려 있습니다.

SubView들의 넓이 설정 기준

• 습관정보의 회색 Border을 가진 View의 최소한의 크기가 SubView들중에 가장 넓은 width를 가지고 있기 때문에 이를 기준으로 UIScrollView의 SubView뷰들의 넓이가 정해져서 이를 기준으로 넓이가 설정됩니다.

문제점 부가설명

• 위와 같이 설정됨으로 SubView들의 넓이가 습관 정보의 회색 BorderView의 넓이와 동일하게 설정되 화면 전체를 꽉 채우지 않고 위의 이미지와 같이 짤리게 나오게 됩니다.

해결법

• ScrollView는 화면(ViewController의 view)의 제약조건과 똑같게 걸어줬기 때문에 시뮬레이터 화면에 꽉차게 출력됩니다.
• 위에서 설명한 원리를 이용하여 ScrollView의 넓이와 동일하게 설정시 해당 SubView가 가장 넓은 Width를 가지게 되기 때문에 정상적으로 화면에 꽉차게 출력됩니다.

해결 코드

firstDivider.snp.makeConstraints { make in
	make.width.equalToSuperview()
}

 

 

아래와 같은 제약조건을 가진 뷰들 중 하나를 선택해서 width를 설정해주면 됩니다.

firstDivider.snp.makeConstraints { make in make.width.equalToSuperview() }

 

SubView들 중 랜덤을 선택을 해도 되는 이유 : 어떠한 View든 ScrollView의 넓이와 같아지게되면 SubView들중 가장 큰 넓이를 가지기 때문입니다.

 

 지적할 점 또는 궁근한점 있으시면  댓글 달아주세요 . 언제든지 환영입니다.!!