Xcode11でScrollViewを使う

# ScrollViewをXcode11で使いたい！
Xcode11からscrollViewの設定のあれこれが結構変わったので、備忘録として書いていきます
# 早速やっていこう
## 1. ViewControllerにScrollViewを置く
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/540178/6a97cc02-2547-764b-c931-e0a16a0c742e.png)
このscrollViewをViewの中に配置して、
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/540178/741ed69c-2ace-0594-7d74-8bc09e97278c.png)
こんな感じで画面いっぱいに広げます
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/540178/82b1f337-ff4c-e239-bab9-7b687e3cb2c0.png)
次にこんな感じで制約を追加
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/540178/21bc96b4-1ee2-4bce-60f1-b1b5fa7d7e6b.png)
この状態だとXcodeに怒られますが、後で追加で設定するから今は気にしないで大丈夫です
## 2. ScrollViewにStackViewを置く
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/540178/8dbc3fe9-92f5-09de-f3dc-a6fd0836b7de.png)
Vertical Stack Viewを
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/540178/d70be449-7c09-5f2a-95cd-428a9c0abf5f.png)
またこんな感じで画面全体に広げる
## 3. ScrollViewとStackViewをいい感じにする
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/540178/352a832a-290d-fccb-984b-43c1cc5e9bea.png)
StackViewからContent Layout Guideにcontrolキーを押しながらドラッグすると
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/540178/b9c5e800-02e9-a0af-56b6-115125dbc3ee.png)
こんな感じのポップアップが出るから、
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/540178/839ebded-c2fe-bd56-79ad-6d5b85136cc2.png)
上の４つにチェック入れます
で今度はStackViewからFrame Layout Guideにcontrolキーを押しながらドラッグして、
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/540178/e2f81d76-1052-890d-e628-64724dee0174.png)
Equal Widthにチェックしましょう
ここまでやったらConstraintsを見てみて、
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/540178/49ab53e2-18af-987d-0498-181ae3b287d8.png)
こんな感じで + 414とか + 896とかになってるやつを0にしましょう
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/540178/262cd795-52a7-7f67-c5e7-80f77301d5ca.png)
## 4. ScrollViewにViewを置く
ここまでできたらViewを置くだけです
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/540178/55f82f8a-c9ae-7c23-babf-999da34b186e.png)
ViewをScrollViewに置いて
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/540178/2f5b7d94-240f-6cd8-c9e2-eab7810a0cd3.png)
高さを指定してあげれば
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/540178/550fe497-0aad-7dd8-9c3f-9618ac9c1639.png)
こんな感じになる！！！！
もう１個下にViewを置きたいときは
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/540178/26ddf4c7-1007-7a03-ecd8-886b33369639.png)
こうやって上のViewの一番下に持ってって、StackViewの表示が出るところで離せば追加できます
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/540178/d0fa2746-9586-cca5-0bdf-79997ce4a259.png)
追加したViewにも高さを指定してあげることを忘れずに！
## 5.Viewの上に好きなものを置く
ViewControllerのサイズを大きくしてあげると作業しやすいかも？
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/540178/6f98ff3f-d837-1724-a3af-94b077c87574.png)
## 6.完成！
動いた動画↓
[![ビデオ開けなかったわ...ぴえん...](http://img.youtube.com/vi/Dstbk46BRCQ/0.jpg)](http://www.youtube.com/watch?v=Dstbk46BRCQ)
一応Githubにあげときました↓
https://github.com/sugijotaro/scrollView

# 参考
https://useyourloaf.com/blog/scroll-view-layouts-with-interface-builder/
https://youtu.be/KmE50giVuLA