第一份作業要在 xcode 中用 view 畫出圖案。私以為最耗時的部分應該是以下兩點：

1. view 定位
2. 調整顏色

為了繪畫過程中能省去這些麻煩，決定先用 Google Sheet 打個草稿、找出各方格的顏色與定位。

在網路上找到合適的圖畫後就來開工啦！

第一步，用 Google Sheet 打草稿！

要畫的圖片格數是 23*32。測試了一下 view 一格大小 10*10 最為剛好，故先在畫布上新增一個 230*320 的 super view (命名為 “SnowWhite”)，將要作畫的小方格成為其 sub view，以便進行定位。

決定尺寸後，回到 Google Sheet 上找出要使用的色號、以及各自的 x, y 軸定位點。

(不過後來顏色在 xcode 上還是有進行微調😆)

為了避免一直調整顏色的麻煩，使用 Sort by color 功能，一次先畫一種顏色。

開始畫啦！一直複製黑色小方格，調整為之前整理好的 x, y 座標即可，相鄰的色號則直接修改 width 加快繪製速度。

換個顏色繼續填充。

像素風 Snow White 繪製完成啦！

如法炮製 Jasmine 及 Mulan ～

畫好後模擬器畫面如下：

設定一個童話風的 App icon：

完成後在模擬器中進行 gif 錄製：

但是橫向的設計在錄屏中會需要扭著脖子看，覺得稍嫌美中不足。故找了一下彼得潘的文章，依著上面的步驟一步步設置了 Scroll View。感謝老師超詳細的教學～

設定 content size，實現水平捲動，上下捲動和分頁的 scroll view

為了讓 Scroll View 能成功滾動，在 SnowWhite, Jasmine 及 Mulan 三個 Views 上再加了一個 Super View，並將長度拉長到 1100，以便實現 Scroll View 向下滾動功能。

成功啦！

雖然只是很簡單的繪製，還是迫不急待的導入到手機上，跟親友炫耀一下學習的第一步😆。用手機長截圖紀念一下：

最後將這個 Project 上傳至 GitHub 交作業～

GitHub - Pei-7/View-drawing