系列文章
【Day21】導航元件 - Drawer
元件介紹 Drawer 抽屜元件，由螢幕邊緣滑出的浮動面版，常見的應用是作為導航用途，例如 Navigation drawers。 參考設計 & 屬性分...
【Day22】導航元件 - Tabs
元件介紹 Tabs 是一個選項卡切換元件，能夠在同一層級的內容組別當中導航、切換。此元件由兩個部分構成，一個是讓使用者點擊的導覽頁籤 Tab，一個是對應的內容...
【Day23】導航元件 - Pagination
元件介紹 Pagination 是一個分頁元件，當頁面中一次要載入過多的資料時，載入及渲染將會花費更多的時間，因此，考慮分批載入資料的時候，需要分頁元件來幫助我...
【Day24】反饋元件 - Spin
元件介紹 Spin 是一個載入狀態元件，當頁面正在處理非同步行為，或需要讓用戶等待的作業時，用來顯示以緩解用戶等待的焦慮。 參考設計 & 屬性分析 一個...
【Day25】反饋元件 - Skeleton
元件介紹 Skeleton 是一個骨架載入元件(Skeleton Screen Loading)，跟 Spin 不同的是，Skeleton 幫助我們在頁面載入完...
【Day26】反饋元件 - Progress bar
元件介紹 Progress bar 是能夠展示當前進度的進度條元件。當一個操作需要顯示目前百分比，或是需要較長時間等待運行的時候，能夠使用這樣的元件提示用戶目前...
【Day27】反饋元件 - Progress circle
元件介紹 Progress circle 跟上一篇 Progress bar 一樣是能夠展示當前進度的元件。只是在外觀上面以圓形替代長條形，好處是在寬度不夠的排...
【Day28】反饋元件 - Modal
元件介紹 Modal 元件為彈出相關元件提供了重要的基礎建設，如 Dialog、Popover、Drawer...等等。 參考設計 & 屬性分析 各家元...
【Day29】反饋元件 - Toast
元件介紹 Toast 可以提供使用者操作的反饋訊息。包含一般資訊、操作成功、操作失敗、警告訊息等。預設為在頂部置中顯示並自動消失，是一種不打斷用戶操作的輕量級提...
【Day30】挑戰回顧 & 鐵人練成心得分享
挑戰最後一日的題目真的讓我想了很久，倒底該放什麼元件來壓軸才好？要寫一個綜合演練，把前面的元件都拿出來大亂鬥一番，搞出一個看起來很厲害的應用嗎？還是說我應該老老...