査読必須サイト
I/O 2014 アプリに学ぶマテリアルデザイン
Customize the Color Palette
Google本家のスタイルガイド
各パーツと要素の指定
以下、各パーツと要素名です。style.xmlにて各要素の色を指定します。
AppCompat使用時の指定
次はStatsuBarとActionBarの背景色を指定するサンプルです。styles.xmlに記載しました。
<resources>
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<!-- your app branding color for the app bar -->
<item name="colorPrimary">@color/primary</item>
<!-- darker variant for the status bar and contextual app bars -->
<item name="colorPrimaryDark">@color/primary_dark</item>
</style>
</resources>
AppCompatを使用時は「name="android:colorPrimary"」でないことに注意してください。
サンプル画面
次のようにcolor.xmlに定義を追加してみました。
色は
Google本家のスタイルガイドから適用しました。
<resources>
<!-- Material -->
<color name="primary">#4caf50</color>
<color name="primary_dark">#388e3c</color>
</resources>
StatsuBarとActionBarの背景色がマテリアルデザインっぽくなりました。
0 件のコメント:
コメントを投稿