建立Material Design風格的Android應用--使用Drawable

如下Drawables的功能幫助你在應用中實現Material Design:html

圖片資源着色

在android 5.0(api 21)和更高版本,能夠着色bitmap和.9 png 經過定義透明度遮蓋。你能夠着色經過使用顏色資源或者主題的屬性去解析顏色資源(好比,?android:attr/colorPrimary).一般咱們建立一次,而後資源自適應主題。java

你能夠給BitmapDrawable或NinePatchDrawable對象着色使用setTint()方法。你能夠能夠在佈局文件中使用android:tintandroid:tintMode屬性設置着色顏色和着色模式。android

從圖片中抽取高亮顏色

support library r21和更高的版本中包括了Palette類,能夠從一個圖片中提取高亮顏色。這個類能夠提起如下幾種突出顏色:api

Vibrant 充滿生機app

Vibrant dark 暗的充滿生機佈局

Vibrant light 亮的充滿生機gradle

Muted 柔和線程

Muted dark 暗的柔和code

Muted light 亮的柔和xml

傳遞一個Bitmap對象給靜態方法Palette.generate(),它會在後臺線程幫你從後臺線程提取顏色。若是你不能使用這個後臺線程,使用Palette.generateAsync()方法,而且設置一個監聽器listener.

你能夠從圖片中取得突出顏色使用Palette類中的getter方法,好比Palette.getVibrantColor.

在項目中使用Palette方法,須要在項目中包含v7包palette的jar, gradle dependecy添加的方式是:

...
compile 'com.android.support:palette-v7:21.0.+'

下面這個是示例代碼:

Palette.generateAsync(bitmap, new Palette.PaletteAsyncListener() {
     public void onGenerated(Palette palette) {
         // Do something with colors...
         palette.getVibrantColor(Color.BLACK); //get a color in rgb value
     }
 });

更多信息,請查看Paltette的api文檔:http://developer.android.com/reference/android/support/v7/graphics/Palette.html

建立矢量drawables

在android 5.0和更高版本中,能夠建立矢量的drawable,在縮放的時候不會失真。你只須要定義一個矢量圖片文件,相反的,使用bitmap位圖則須要針對不一樣的分辨率建立多個文件。建立一個矢量圖片,你須要說明圖形的詳細,在xml文件的<vector>標籤下。

下面是一個例子:

<?xml version="1.0" encoding="utf-8"?>
<!-- res/drawable/heart.xml -->
<vector
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:width="256dp"
    android:height="256dp"
    android:viewportHeight="32"
    android:viewportWidth="32">

    <!-- draw a path -->
    <path
        android:fillColor="#f15467"
        android:pathData="M20.5,9.5
                        c-1.955,0,-3.83,1.268,-4.5,3
                        c-0.67,-1.732,-2.547,-3,-4.5,-3
                        C8.957,9.5,7,11.432,7,14
                        c0,3.53,3.793,6.257,9,11.5
                        c5.207,-5.242,9,-7.97,9,-11.5
                        C25,11.432,23.043,9.5,20.5,9.5z"/>
</vector>

上面的圖顯示效果以下:

矢量圖片在android表現爲VectorDrawable對象。更多信息,查看Svg Path reference。

參考資料:http://developer.android.com/training/material/drawables.html

原文地址:http://blog.isming.me/2014/11/03/creating-app-with-material-design-four-drawables/,轉載請註明出處。

相關文章
相關標籤/搜索