標籤雲

搜尋此網誌

2015/09/15

Material Design - Meterial Theme

ActionBar 與 Notification Bar 的 style 在 5.0(API 21) Meterial Theme 變得簡單好多
首先了解一下各部分新的設定名稱
借一下官方的圖來用


Material theme 如下:

@android:style/Theme.Material (dark version)
@android:style/Theme.Material.Light
@android:style/Theme.Material.Light.DarkActionBar

<resources>
  <style name="AppTheme" parent="android:Theme.Material">
    <!-- actionbar color -->
    <item name="android:colorPrimary">@color/primary</item>
    <!-- status bar and contextual app bars -->
    <item name="android:colorPrimaryDark">@color/primary_dark</item>
    <!--   theme UI controls like checkboxes and text fields -->
    <item name="android:colorAccent">@color/accent</item>
  </style>
</resources>

要注意的是如果要支持 5.0 前的版本
記得要使用 support library V7 並繼承自 Theme.AppCompat

<!-- Base application theme -->
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
    <item name="android:textViewStyle">@style/DefaultTextViewStyle</item>
    <item name="android:textColorPrimary">@android:color/white</item> <!-- ActionBar 的文字顏色 -->
    <item name="colorPrimary">@color/colorPrimary</item> <!-- ActionBar 底色 -->
    <item name="colorPrimaryDark">@color/colorPrimary</item> <!-- NotificationBar 底色 -->
    <item name="android:windowBackground">@android:color/white</item>
</style>

相關資料:
appcompat v21: material design for pre-Lollipop devices!
Android develop - Using the Material Theme

沒有留言: