Twitter 앱의 프로필풍 UI (2020년 추가)

만들어 보니 의외로 바삭하게 갈 수 있었습니다.



코드
htps : // 기주 b. 코 m / 오사나이 코타 로우 / ぃ

※ 물론 본가를 보면 알 수 있듯이 실제로는 조금 더 복잡합니다.

조금 해설

계층은 이런 상태입니다.

보기
　　-HeaderView
　　ーUIScrollView(옆)
　　　　ーUITableView
　　　　ーUITableView
　　　　ーUITableView
　　　　ーUITableView

HeaderView가 스크롤 안에 들어 있지 않은 것이 덫입니다. 이것을 넣어 버리면 어려워집니다.
이러한 UI는 View의 Constraint를 직접 재작성하는 것이 컨트롤하기 쉽습니다.
제어하는 것은 UIScrollViewDelegate의 scrollViewDidScroll입니다.
노란 막대가 그냥 위로 올 때 멈추면 마치 UITableView의 구성 요소처럼 보입니다.
(하지만 4개의 ​​TableView에 영향을 주고 움직이고 있기 때문에 컴포넌트가 되지는 않습니다)

노란 View 안의, 현재의 View를 나타내는 하늘색의 View도, 화면 왼쪽으로부터의 Constraint를 움직이고 있을 뿐입니다.

추기： 실천

2안건으로 실제로 조립했습니다.
유지 보수를 고려하여 각 TableView를 ViewController로 잘라 ContainerView를 사용했지만 생각 외에 복잡해졌습니다.
이것 아무 말도 하지 않으면 계승 힘들게 된다고 생각합니다.
안건에 따라서는 사양 레벨에서 회피하는 편이 좋다고 생각합니다.
도하마리 것 같습니다.

코드는 이쪽.
htps : // 기주 b. 코 m / 오사나이 코타로 / ぃ r ぃ 케 우이 / t ree / ゔ ぇ p

ContainerView를 사용하지 않으면 조금 더 단순해지지만 ViewController가 매우 무거워지기 때문에 통증이 가려워집니다.

UIPageViewController로 도망치는 손도 있습니다.
이 경우 iTunes Store 앱이 도움이 될 것입니다.

추기 : 더욱 제대로 구현한다

Library를 사용하는 방법도있는 것 같습니다.
htps : // 기주 b. 코 m / 뭐 p / MX 파랏 x 헤어 r
　
스스로 구현하는 경우도, 「복수 ScrollView＋1HeaderView」를 구현할 때에 이쪽의 Library가 참고가 될지도 모릅니다