Load more

假設今天 iPhone app 想要跟 Server side 查詢我們有興趣的資料,Server side 開放 Web service 且透過 API 查詢,我們給了適當的查詢條件後,就可以查符合使用者要的資料回來。

在 iPhone app 呈現是,一開始畫面載入進來查詢前面 20 筆,如果畫面滑到底部可以呈現『載入更多』多 10 筆的按鈕,這時候可以持續透過網路查詢更多的資料來呈現。如果畫面滑動回到畫面最上方,提供可以下拉放開重新整理,可以將整個頁面全部重新整理。這樣的使用者體驗不論在查詢 feeds 或者任何有興趣想看到的訊息,這種方式蠻常呈現的。

在查詢 API 方面我們會希望可以多上了 limit 和 offset。這兩個用法跟我們來查資料庫的資料概念一樣。Limit 來決定每次 iPhone 跟 Server side 要多少資料筆數,例如 limit=10 就是跟 Server side 要 10 筆即可。太多資料不是我們希望看到的,不但 Server 端要處理比較久,且透過網路傳輸和呈現,太大太肥的資料不是我們希望看到的。Offset 是用來告知要忽略多少筆資料,例如已經查過了第 1~10 筆資料,那麼第二次跟 Server side 我們會希望從第 11 筆開始,這時候就可以讓 offset =10 ,搭配 limit 如此一來即可做到像我們系統表單上幾筆到幾筆點閱一樣。

規劃 Data Model ,這支負責傳入要查 API 的 URL ,裡面負責透過 API 進來,加上一些附加的條件來決定資料回傳筆,再將資料陣列回傳給 Data source 來呈現。開設一個 function 叫做 load more (boolen),透過傳進來告知是否是查詢更多或者僅是重新整理。在這個 load more 的 function 去決定 limit 和 offset 要組合的值。

如果不是 load more 僅是資料重新整理,先判斷現在擁有資料筆數是否小於初始化基本數,如果不到就是讓 limit 值至少帶回初始化筆數,如果超過的話,就完整的查擁有資料比數回來,所以 limit 也就是目前擁有筆數重查。以上這樣查資訊回來再把現有的資料覆蓋掉即可。

如果是 load more 要查更多筆數,offset 等於 offset 現有值加上限制筆數來移動那個查詢的紀錄位置,limit 等於 limit 限制次數,類似固定 10 筆或者 20 筆之類的。


回到我們 iPhone app 的畫面操作,當畫面到最上方滑動重新整理,我們就帶動 Data model 重新整理資料,如果是畫面滑動到最下方按下載入更多,那麼我們就帶動 Data model 來查更多筆數。

以上讓我學到最關鍵的是,把邏輯看整個過程結果,先在白紙上勾勒清楚,確定邏輯無誤在到 Xcode 寫程式在是正確方式。不然容易犯了為了在意程式寫法 coding 而卻忘記整體最重要的 logic,如此才能做出好的效果來。

Comments