개발/아이오에스
swift] 코드로 UIscrollView 구현하기
dev.jake
2021. 7. 28. 13:30
let scrollView: UIScrollView = {
let sv = UIScrollView()
sv.translatesAutoresizingMaskIntoConstraints = false
sv.backgroundColor = .systemRed
return sv
}()
let viewInScroll: UIView = {
let uv = UIView()
uv.translatesAutoresizingMaskIntoConstraints = false
uv.backgroundColor = .systemBlue
return uv
}()
//스크롤뷰와 스크롤뷰 안에 들어 갈 뷰를 선언해준다.
func initLayout(){
view.addSubview(scrollView)
scrollView.topAnchor.constraint(equalTo: naviTopView.bottomAnchor).isActive = true
scrollView.bottomAnchor.constraint(equalTo: view.safeAreaLayoutGuide.bottomAnchor).isActive = true
scrollView.leadingAnchor.constraint(equalTo: view.safeAreaLayoutGuide.leadingAnchor).isActive = true
scrollView.trailingAnchor.constraint(equalTo: view.safeAreaLayoutGuide.trailingAnchor).isActive = true
//우선 UIscrollView의 위아래와 양 옆의 Anchor을 view의 safeAreaLayoutGuide에 맞게 선언해준다.
scrollView.addSubview(viewInScroll) //스크롤 뷰 안에 view를 넣는다.
viewInScroll.topAnchor.constraint(equalTo: scrollView.topAnchor).isActive = true
viewInScroll.bottomAnchor.constraint(equalTo: scrollView.bottomAnchor).isActive = true
viewInScroll.leadingAnchor.constraint(equalTo: scrollView.leadingAnchor).isActive = true
viewInScroll.trailingAnchor.constraint(equalTo: scrollView.trailingAnchor).isActive = true
viewInScroll.widthAnchor.constraint(equalTo: scrollView.widthAnchor, multiplier: 1.0).isActive = true //가로로 스크롤 할 필요가 없을 때는 이처럼 스크롤뷰와 안에 뷰의 width값을 같게한다.
}
}
스크롤뷰 안에 있는 뷰는 스크롤뷰의 위아래, 양 옆과 같이 constraint를 정해준다.
run -
systemRed인 스크롤뷰가 화면에 가득차 있고, 스크롤뷰의 안에 뷰(systemBlue)는 보이지 않는다.(뷰의 크기가 정해지지 않음)
이때
viewInScroll.heightAnchor.constraint(equalToConstant: 350).isActive = true 처럼 heightAnchor- 높이를 정해주면
이런식으로 스크롤뷰안에 뷰가 보여진다.
viewInScroll.heightAnchor.constraint(equalToConstant: 800).isActive = true 높이를 화면 크키보다 크게 늘려 적용을 하면
스크롤이 되는 모습을 볼 수 있다.