傳承火之意志-火影電子書app的誕生!

唉~時隔好幾週終於繳出我的第一支作業,雖然還不是我理想中的樣子但完成到某個階段了就先傳上來拉~(畢竟把所有功能都做完再上傳,那可能作業就永不能交啦~QQ)之後會持續加上其他作業學到的功能上來,再不定期更新。

主題部分因為對日漫火影忍者的世界觀有興趣,故選擇做為取材主題,孰不知資料量有夠龐大的啦,整理素材花的時間比做app的過程還多ㄏㄏㄏㄏ

本app用得的功能有:

11/24

  1. 搭配 tab bar controller & navigation controller。(作業三)
  2. scroll view左右上下滑動(作業二)
  3. 使用 segue 串接頁面 (作業三)
  4. 使用 table view controller with static cells (有問題)
  5. 將 App 安裝到 iPhone (作業一)

相關連結:
實現水平捲動,上下捲動和分頁的 scroll view

搭配 tab bar controller,table controller,navigation controller

將 App 安裝到 iPhone

製作說明:

秉持著不寫一行程式碼原則,主要就是拉大量的scoll view製作圖片滾輪滑動,再搭配 tab bar controller跟navigation controller,頁面轉場以及segue 串接。

contentSize

滑動是用scoll view到User Defined Runtime Attributes加上contentSize產生的效果!

layer.cornerRadius

照片圓角是用圖片到User Defined Runtime Attributes加上layer.cornerRadius生的效果!

畫面下半部垂直滑動部分

中間一度遇到的問題就是我想在viewController裡面加入Table View的垂直滑動表單,面積是整個畫面的下半部,但是!登愣~~傳至模擬器卻是一片黑,完全沒有顯示出來,後來問了Peter之後,得到的建議是如果要使用TableView的功能的話,還是先使用整頁呈現的Table View Controller,是能理解,畢竟這次是希望不加任何程式的狀況製作,但有點晴天霹靂啊哈哈哈,因為下半部的畫面構圖就是要一個垂直拉動的表單,現在要改有點不知道要放啥。

所有頁面

思來想去之後呢~想到說我幹嘛不一樣用scoll view改用垂直滑動就好??segue 就以Button串接。所以還是解決了滑動上的需求問題。

串接的Table View Controller一片黑

但是我另外串連的Table View Controller在模擬器呈現是一片黑,目前暫時擱置(因為這邊的素材也都還沒準備好哈哈),希望之後能更正這個問題。

再來就是我自己ai拉製的Tab Bar Item的icon輸出為25x25、解析度為72,符合畫面大小但是糊糊的,而具體建議是多大比較適合我也不確定,就目測輸出這樣,也希望之後能解決!

最後呈現一下整體操作狀況啦~~

gif:

手機上的操作:

https://youtu.be/vyCsG50FvQ4

基本上完成內容就是這樣~~~

--

--