Android應(yīng)用的Material設(shè)計中圖片的相關(guān)處理指南
可伸縮的矢量圖片不會丟失清晰度,并且單一顏色的app-icon是完美的
可定義一個bitmap作為透明度(alpha)和運行時的顏色
可對一個bitmap image取色,會取出它比較顯眼的顏色
官網(wǎng)地址:https://developer.android.com/training/material/drawables.html
以下圖片的功能能幫助你在app中實現(xiàn)Material設(shè)計:
- 圖片著色
- 顏色提取
- 矢量圖片
Tint Drawable Resources 為圖片資源染色
在Android 5.0(API級別21)及以上,你可以將圖片和9-patch定義為掩飾透明度。你能使用顏色資源(如,?android:attr/colorPrimary)或主題屬性來給它們上色。通常,你只需創(chuàng)建這些資源一次,且自動匹配你的主題為它們上色。
可以為BitmapDrawable和NinePatchDrawable 的對象使用setTint(int tint)進行染色。也可以在xml中定義android:tint和android:tintMode屬性。
·關(guān)于setTint(int tint)的參數(shù),可以是一個@color/下的屬性,也可以是一個xml的selector,selector中的item是使用了數(shù)字的,如:
<selector xmlns:android="http://schemas.android.com/apk/res/android"> <item android:state_focused="true" android:color="@color/testcolor1"/> <item android:state_pressed="true" android:state_enabled="false" android:color="@color/testcolor2" /> <item android:state_enabled="false" android:color="@color/testcolor3" /> <item android:color="@color/testcolor5"/> </selector>
·關(guān)于xml中定義屬性,如:
<?xmlversion="1.0"encoding="utf-8"?> <nine-patchxmlns:android="http://schemas.android.com/apk/res/android" android:tint="@color/abc_primary_text_material_light" android:tintMode="src_over" ... > </nine-patch>
Extract Prominent Colors from an Image 從圖片抽取明顯的顏色
在api21上的support-v7庫中有一個android-support-v7-palette.jar,它能夠讓你從圖片中抽取一些顯眼的顏色:
Palette p = Palette.generate(Bitmap bitmap);
- 鮮艷的 p.getVibrantColor(int defaultColor);
- 鮮艷的黑暗 p.getDarkVibrantColor(int defaultColor);
- 鮮艷的明亮 p.getLightVibrantColor(int defaultColor);
- 柔和的 p.getMutedColor(int defaultColor);
- 柔和的黑暗 p.getDarkMutedColor(int defaultColor);
- 柔和的明亮 p.getLightMutedColor(int defaultColor);
Palette.generate(),用于在后臺線程中執(zhí)行,如果在前臺線程中創(chuàng)建Palette對象,那么可以使用Palette.generateAsync()。
Create Vector Drawables 創(chuàng)建矢量圖片
在Android 5.0(API級別21)及以上 可以創(chuàng)建矢量圖片,如下面的例子可以繪制一個心形的矢量圖:
<!-- res/drawable/heart.xml -->
<vector xmlns:android="http://schemas.android.com/apk/res/android"
<!-- intrinsic size of the drawable -->
android:height="256dp"
android:width="256dp"
<!-- size of the virtual canvas -->
android:viewportWidth="32"
android:viewportHeight="32">
<!-- draw a path -->
<path android:fillColor="#8fff"
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中使用VectorDrawble對象與之對應(yīng)。path的更多信息請見:http://www.w3.org/TR/SVG11/paths.html#PathData。
設(shè)計標(biāo)準(zhǔn)樣例
選用圖片


描述具體事物,優(yōu)先使用照片。然后可以考慮使用插畫。
圖片上的文字

圖片上的文字,需要淡淡的遮罩確保其可讀性。深色的遮罩透明度在20%-40%之間,淺色的遮罩透明度在40%-60%之間。

對于帶有文字的大幅圖片,遮罩文字區(qū)域,不要遮住整張圖片。

可以使用半透明的主色蓋住圖片。
提取顏色

Android L可以從圖片中提取主色,運用在其他UI元素上。
圖片加載過程

圖片的加載過程非常講究,透明度、曝光度、飽和度3個指標(biāo)依次變化,效果相當(dāng)細膩。

相關(guān)文章
Android 使用<layer-list>實現(xiàn)微信聊天輸入框功能
<layer-list> 標(biāo)簽可以設(shè)置LayerDrawable,一種有層次的Drawable疊加效果,<layer-list> 可以包含多個 <item>標(biāo)簽。這篇文章主要介紹了Android 使用<layer-list>實現(xiàn)微信聊天輸入框,需要的朋友可以參考下2017-05-05
Android無限循環(huán)RecyclerView的完美實現(xiàn)方案
這篇文章主要介紹了Android無限循環(huán)RecyclerView的完美實現(xiàn)方案,文中通過示例代碼介紹的非常詳細,對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-06-06
Android?ViewModel創(chuàng)建不受橫豎屏切換影響原理詳解
這篇文章主要為大家介紹了Android?ViewModel創(chuàng)建不受橫豎屏切換影響原理詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進步,早日升職加薪2023-03-03
Android WebView userAgent 設(shè)置為桌面UA實例
這篇文章主要介紹了Android WebView userAgent 設(shè)置為桌面UA實例,具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧2020-03-03
Android手勢滑動實現(xiàn)ImageView縮放圖片大小
這篇文章主要為大家詳細介紹了Android手勢滑動實現(xiàn)ImageView縮放圖片大小的相關(guān)資料,文中示例代碼介紹的非常詳細,具有一定的參考價值,感興趣的小伙伴們可以參考一下2016-02-02

