Material Design

A collection of 7 posts
Material Design

Material Design Patterns 教學 (4) - RecyclerView

本來想寫 AppBarLayout,不過發現會牽涉到 RecyclerView,所以決定先寫 RecyclerView。 RecyclerView 就像 ListView,都是透過 scrolling 的動作來顯示一個清單,不過它更具彈性更自由。RecyclerView 可以很簡單的將它設為橫向或直向,或者以格仔形式顯示,而且設定加減項目的動畫也很容易。它的定位是 ListView 的後繼者,之前介紹過的 CoordinatorLayout 也只支援 RecyclerView 而不支援 LisView,所以大家還是用一用 RecyclerView 吧。 ![RecyclerView 架構](/content/images/2015/11/RecyclerView.png) 此教學分為以下幾步: 1. 安裝 2. 設定 layout 3. 編寫 adapter 4. 給合 adapter 和
8 min read
Material Design

Material Design Patterns 教學 (3) - Snackbar & CoordinatorLayout

相信大家有用過 Toast, Toast是 Android App 用來顯示簡短提示或通知的一種方法。Material Design 引入 Snackbar ,用來取代 Toast。比起 Toast ,Snackbar 歸屬於顯示中的 view,可以加「行動」按鍵,並且可以以左去右形式掃走。 Snackbar 用法 Snackbar 使用方法是跟 Toast 一樣: Snackbar.make(contentView, "I am snackbar", Snackbar.LENGTH_SHORT).show(); 跟 Toast 不同的是,Snackbar 是以 view 作參數,而不是以 context。這確保 Snackbar 只在有 view
3 min read
android dev

Material Design Patterns 教學 (2) - Floating Action Buttons

Floating Action Button (FAB),直譯為「浮動動作按鈕」,為 Material Design 的其一大標誌。它是一個「浮」在畫面上的一個按鈕,按下去則執行該畫面常用的功能。 ![FAB Sample](/content/images/2015/08/fab_sample.jpg) 加入 FAB FAB 的使用非常簡單,我們繼續使用 Part 1 的 project ,將 activity_main.xml 中的 LinearLayout 轉為 FrameLayout ,然後加上以下 code: 3 min read
android dev

Material Design Patterns 教學 (1) - Navigation Drawer

想有漂亮的 Material Design,其實 Google 已提供 Android Design Support Library 可供使用。它支援 Android 2.1 或以上,提供不少好用的 UI element,可方便做到 Material Design Pattern 的效果。我們在此逐一介紹 (可以一段時間不用再煩惱寫什麼,Yeah! 用 code 代替一部份內容,寫少很多,Yeah Yeah!)。 安裝 Android Design Support Library 可通過 Gradle 來安裝: dependencies { compile fileTree(dir: 'libs', include: ['*.jar']) compile
7 min read