스크롤뷰를 사용하여 정적 높이를 구해주고 싶다면
여기를 참조해주세요!
스크롤 뷰와 스택뷰를 이용해 동적 높이 구하기
- 스크롤 뷰를 추가해주고 왼, 오른, 위, 아래에 각각 0인 Constraint을 설정해 줍니다.
2. 스크롤 뷰 옵션의Content Layout Guides
를 체크해제 해 줍니다.
Content Layout Guide를 체크 해제해주면,
이와 같이 스크롤뷰가 전체화면에 차게 됩니다.
3. 이 위에 스택뷰를 올려놓고 똑같이 Constraint 0을 양옆, 위 아래에 줍니다.
이러면 이렇게 에러가 나게 되는데, 이유는 Width와 height가 설정되지 않았기 때문이죠! 이를 해결하기 위해서는
4. ScrollView와의 Equal Width를 잡아줍니다.
위와 같이 StackView를 ScrollView위에 상관관계를 잡아주기 위해 드래그 한 후
Equal Width를 클릭해줍니다.
StackView
를 클릭해보면 Width에Proportional Width to: SuperView
라고 되어있는데
5. Edit
을 클릭해 Multiplier
를 1로 만들어줍니다. (SuperView와 StackView의 길이를 같게 해주기위해서 입니다.)
하지만 아직 오토레이아웃이 완벽히 잡히지 않았습니다.
이유는 높이가 아직 잡히지 않아서에요.
6. StackView안에 높이를 잡아주기 위해 View를 하나 넣어주고 Height를 80으로 잡아줍니다.
그러면 드디어 Autolayout이 잘 잡혔고 에러도 다 사라졌네요.
그리고 같은 뷰를 복사해서 여러개를 넣어주고, 하나의 뷰만 배경을 바꿔보았습니다. 스택뷰 안에 넣으니, 스택뷰의 장점중 하나인 자동높이 조절을 해주니 정말 편안합니다.
시뮬레이터에서 스크롤 뷰 작동하는 동영상 첨부하며 블로그 마치도록 하겠습니다~