Android Studio神器之Image Asset

我把Image Asset翻譯成“圖片資源素材”,本章主要介紹如何使用Android Studio制作圖片素材。

(1)阿里圖庫的使用

起初,我常常在阿里圖庫中尋找我所需要的素材,阿里圖庫的官網如下:

https://www.iconfont.cn/

使用步驟如下:

【第一步】 搜索“設置”關鍵字

圖片.png

【第二步】 選擇合適的圖標,并下載

41.gif

【第三步】 下載之前會讓您選擇合適的顏色、大小、文件輸出格式

圖片.png

總體而言,使用阿里圖庫制作圖片素材還是非常方便的。

除此之外,還可以使用Android Studio自帶的Image Asset制作圖片素材,Android的圖片素材是png格式,屬于位圖。

(2)Image Asset打開步驟
圖片.png

【第一步】 新建一個ImageAsset項目

觀察一下項目目錄

【第二步】 選中app模塊
如圖所示,選中項目中的app模塊或者選中app文件下的任何文件,選中好之后就可以打開Image Asset界面了。

【第三步】 打開Image Asset界面

打開Image Asset界面的方式有兩種:

【1】File->New-->Image Asset
【2】鼠標右擊-->New-->Image Asset

Image Asset界面如下:

圖片.png
(3)選擇圖片類型

圖標類型(Icon Type)

  • Launcher Icons(Legacy only):僅傳統桌面啟動圖標
  • Launcher Icons(Adaptive and Legacy):自適應和傳統桌面啟動圖標
  • Action Bar and Tab Icons:Action Bar和Tab類圖標
  • Notification Icons:通知圖標
(4)僅傳統桌面啟動圖標

選擇Launcher Icons(Legacy only)之后,左半邊是屬性配置,右半邊是圖片預覽,如圖所示:

圖片.png

參數的意義:

Name:圖片文件名稱

Asset Type:素材類型,素材類型有三種

  • Image:從本地選擇圖片
圖片.png
  • Clip Art:剪貼畫
圖片.png

可以選擇想要的圖標

圖片.png
  • Text:文本
圖片.png

可以選擇合適的字體

圖片.png

Path:文件路徑,如果素材類型選擇Image,那么就會出現Path選項,可以從本地選擇一張圖片,最后將本地圖片作為素材的前景

Trim:修剪

這個英語單詞很熟悉,很容易想到String有個trim方法,意思是去除字符串首尾空格,這里轉換一下概念,將字符串想象成圖片,意思就是說,去除圖片周圍多余的透明空間。

如果選擇Yes:移除圖片周圍的透明空間
如果選擇No:保留原始資源不變

Padding:圖片前景和背景的距離

Foreground:前景顏色

Background:背景顏色

Scaling:縮放比例

  • Crop:裁剪源資源以適應圖標大小
  • Shrink to fit:縮小源資源以適應圖標大小

Shape:形狀(前景是一張本地圖片,這里的形狀是指背景的形狀)

  • None:沒有形狀

  • Circle:圓形


    圖片.png
  • Square:正方形

圖片.png
  • Vertical:垂直
圖片.png
  • Horizontal:水平
圖片.png

Effect:效果

  • None:無效果
圖片.png
  • DogEar:狗耳朵效果(書的折角)
圖片.png

最后,參數配置完成之后點擊“下一步”,界面如下:

圖片.png

我們發現,Launcher圖標的大小工具已經幫我們做好了:

  • mdpi對應48x48dp、48x48px
  • hdpi對應48x48dp、72x72px
  • xhdpi對應48x48dp、96x96px
  • xxhdpi對應48x48dp、144x144px
  • xxxhdpi對應48x48dp、192x192px
(5)自適應和傳統桌面啟動圖標

這種桌面圖標比“僅傳統桌面圖標”多了一個自適應,那么這個自適應是怎么回事呢?我們先來看一下基本參數。

Name:圖片文件名稱

Foreground Layer:前景圖層

圖片.png

Background Layer:背景圖層

圖片.png

Legacy:傳統

圖片.png

這里主要需要理解三個概念:

【一】前景圖層

  • Layer Name:前景圖名稱
  • Asset Type:素材類型,Image、Clip Art、Text(上面已經介紹,不重復介紹了)
  • Path:本地圖片路徑
  • Trim:去除圖片周圍多余的透明空間
  • Resize:設置前景圖的大小
  • Color:前景圖顏色

【二】背景圖層

  • Layer Name:背景圖名稱
  • Asset Type:素材類型,Image、Clip Art、Text(上面已經介紹,不重復介紹了)
  • Path:本地圖片路徑
  • Trim:去除圖片周圍多余的透明空間
  • Resize:設置背景圖的大小
  • Color:背景圖顏色

【三】傳統圖

傳統圖主要用于API 26以下的適配

圖片.png

最后,點擊“下一步”的界面如下:

圖片.png

如圖所示,與傳統圖標相比,它多了一個mipmap-anydpi-v26文件夾,這個文件夾里面的資源是為了自適應而存在的,API 26以上(包括API 26)的手機使用mipmap-anydpi-v26文件夾文件夾中的資源,低于API 26的手機使用傳統文件夾(mipmap-xxx)中的資源。

另外,需要說明的是,mipmap-anydpi-v26文件夾中的圖片一般是矢量圖,而不是位圖,矢量圖可以完美適配各種分辨率的手機。

(6)Action Bar和Tab類圖標
圖片.png

如圖所示,它的參數和Launcher圖標制作的參數明顯大部分一致,而且最終生成的圖片也是位圖和矢量圖。

(6)Notification Icons:通知圖標
圖片.png

通知類圖標也是,有位圖有矢量圖,但是有一點和前者明顯不同。

我們發現,當制作通知圖標時,始終找不到顏色的選項,那是為什么呢?

因為在高版本的手機中,通知圖標只能是透明的,不允許存在RGB顏色通道,所以Android Studio就去除了顏色選項。

[本章完...]

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容