你躺在床上,拿著手機上下滑動瀏覽著臉書上不斷更新的訊息,好不容易看到一則有意義的訊息或是有趣的照片,此時沒注意一個翻身,手機聰明地切換成橫向閱讀模式…「我 X!我想看的訊息怎麼不見了!?」於是乎你又慢慢的捲動尋找到那則訊息的位置,不料此時又不經意地稍微調整了一下姿勢,手機又聰明地轉回直立式的閱讀模式….「挖勒!?」最後你只好小心翼翼的保持你手的姿勢以閱讀完你想要看的訊息。
這樣的情境的確常常發生在某些 APP(舊版Facebook iOS 就是一個很好的錯誤範例)!但是為什麼有的 APP 卻能在手機轉向時,訊息仍然保持在原本的位置呢?
清單視圖(ListView or TableView)可以簡單分為兩類:每列資料高度(1)為固定(2)視內容而變動,而訊息位置在手機轉向時跑掉的問題通常只會發生在第二種類別裡,原因在於當手機轉向時,因為寬度的改變,清單視圖必須依據新的寬度重新計算每列資訊所需的高度,例如圖片的縮放、更改排版位置等,但此時捲軸的位置卻不會隨之改變,仍然維持在原來的深度(若假設每列資料都是圖片的話,在轉向時將會等比例縮放如下圖所示),所以看到的東西也將隨著每列資料高度的變化而改變。
這的確在閱讀上會造成很大的困擾,尤其是當使用者想要換手機方向閱讀時,所以細心的開發者就應該必須要注意到這點,解決的辦法就是在手機轉向時,必須記錄使用者原本是正在閱讀第幾列資料,在手機轉向後手動將視圖捲動到原來資料的正確深度,這樣簡單的機制便不會讓使用者惱怒或是找不到資料!
延伸閱讀:
Image via TheGiantVermin, CC License