AndroidSupportPalette使用詳解

使用Palette API選擇顏色

公司主營業(yè)務(wù):網(wǎng)站設(shè)計(jì)、成都網(wǎng)站建設(shè)、移動(dòng)網(wǎng)站開發(fā)等業(yè)務(wù)。幫助企業(yè)客戶真正實(shí)現(xiàn)互聯(lián)網(wǎng)宣傳,提高企業(yè)的競爭能力。創(chuàng)新互聯(lián)建站是一支青春激揚(yáng)、勤奮敬業(yè)、活力青春激揚(yáng)、勤奮敬業(yè)、活力澎湃、和諧高效的團(tuán)隊(duì)。公司秉承以“開放、自由、嚴(yán)謹(jǐn)、自律”為核心的企業(yè)文化,感謝他們對(duì)我們的高要求,感謝他們從不同領(lǐng)域給我們帶來的挑戰(zhàn),讓我們激情的團(tuán)隊(duì)有機(jī)會(huì)用頭腦與智慧不斷的給客戶帶來驚喜。創(chuàng)新互聯(lián)建站推出金林免費(fèi)做網(wǎng)站回饋大家。

 良好的視覺設(shè)計(jì)是app成功所必不可少的, 而色彩設(shè)計(jì)體系是設(shè)計(jì)的基礎(chǔ)構(gòu)成. Palette包是支持包, 能夠從圖片中解析出突出的顏色, 從而幫助你創(chuàng)建出視覺迷人的應(yīng)用

你能夠使用Palette包設(shè)計(jì)布局主題, 并把自定義色彩應(yīng)用到可視化元素中. 比如, 你可以根據(jù)專輯封面, 用Palette創(chuàng)建為歌曲創(chuàng)建一個(gè)彩色標(biāo)題卡片, 或者當(dāng)應(yīng)用背景圖片發(fā)生改變時(shí)調(diào)整toolbar顏色. Palette對(duì)象給予你權(quán)限訪問Bitmap圖片里面的顏色, 同時(shí)也根據(jù)Bitmap提供了6個(gè)主要的顏色, 供你填寫設(shè)計(jì)選擇.

設(shè)置依賴

Palette為庫從版本Android Support Library 24.0.0引入, 可以在build.gradle中按照如下代碼添加Palette依賴:

android {
 compileSdkVersion 27
 ...
}

dependencies {
 ...
 implementation 'com.android.support:palette-v7:27.1.1'
}

創(chuàng)建Palette對(duì)象

Palette給予你權(quán)限訪問圖片中的基本顏色, 以及重疊文本對(duì)應(yīng)的顏色. 可以根據(jù)給定資源圖片, 使用palette設(shè)計(jì)應(yīng)用風(fēng)格, 動(dòng)態(tài)改變應(yīng)用的色彩體系.

要?jiǎng)?chuàng)建Palette, 首先在從Bitmap中實(shí)例化Palette.Builder. 然后在生成Palette之前, 可以使用Palette.Builder來自定義Palette.

生成Palette實(shí)例

首先, 利用Palette的from(Bitmap)方法從Bitmap中生成Palette.Builder. 之后利用這個(gè)Builder同步或者異步地生成Palette. 如果你想在generate()方法被調(diào)用的線程中創(chuàng)建Palette對(duì)象, 使用同步的palette生成. 如果你想在不同的線程上異步地生成Palette, 就要使用Palette.PaletteAsyncListener.onGenerated方法在Palette生成之后立即訪問它.

下面的代碼片斷展示了兩種不同的Palette生成方式:

// Generate palette synchronously and return it
public Palette createPaletteSync(Bitmap bitmap) {
 Palette p = Palette.from(bitmap).generate();
 return p;
}

// Generate palette asynchronously and use it on a different
// thread using onGenerated()
public void createPaletteAsync(Bitmap bitmap) {
 Palette.from(bitmap).generate(new PaletteAsyncListener() {
 public void onGenerated(Palette p) {
  // Use generated instance
 }
 });
}

如果你需要持續(xù)為多個(gè)有序圖片生成多個(gè)Palette, 考慮將Palette實(shí)例緩存起來, 以避免減緩UI性能. 你也不應(yīng)該在主線程中創(chuàng)建Palette.

自定義Palette

 Palette.Builder允許你自定義Palette, 通過從結(jié)果Palette中選擇多少種顏色, Builder使用圖片的什么區(qū)域生成Palette, Palette中允許什么顏色等. 比如, 你能夠過濾掉黑色, 或者, Builder只能夠使用圖片的上半部分生成Palette.

通過Palette.Builder中的下列方法, 可以微調(diào)Palette尺寸和顏色:

  1. addFilter(): 該方法添加了過濾器, 用以表明結(jié)果Palette中什么顏色是允許的. 傳入自己的Palette.Filter, 修改isAllowed()方法來決定Palette過濾哪些方法.
  2. maximumColorCount(): 該方法設(shè)置了Palette中最大的顏色數(shù)目. 默認(rèn)值是16, 最優(yōu)值依賴于源圖. 對(duì)于風(fēng)景圖, 最優(yōu)值處于8~16, 而肖像圖通常擁有16~24個(gè)值. 顏色越多, Palette.Builder生成Palette就需要花費(fèi)超久的時(shí)間.
  3. setRegion(): 該方法指出了生成Palette時(shí), Builder使用Bitmap的什么區(qū)域. 你只能使用這個(gè)方法從Bitmap中生成Palette, 而不會(huì)影響源圖.
  4. addTarget(): 該方法允許你通過向Builder添加Target色彩配置文件來執(zhí)行自己的顏色匹配. 如果默認(rèn)的Target并不有效的話, 高級(jí)開發(fā)人員能夠使用Target.Builder創(chuàng)建自己的Target.

提取色彩配置文件

基于材料設(shè)計(jì)標(biāo)準(zhǔn), Palette庫從圖片中提供常用的色彩配置文件. 每一個(gè)文件被一個(gè)Target定義, 從Bitmap圖片中提取的色彩基于飽和度, 亮度和分布(Bitmap中表示色彩的像素?cái)?shù))對(duì)文件進(jìn)行評(píng)分. 對(duì)于每一個(gè)文件, 具有最好分?jǐn)?shù)的顏色定義了給定圖片的色彩配置文件.

默認(rèn)情況下, 對(duì)于給定圖片, Palette對(duì)象包含16個(gè)基本顏色. 在生成Palette的時(shí)候, 你可以通過Palette.Builder自定義顏色數(shù). 提取更多的色彩對(duì)于每個(gè)色彩配置文件提供了更多的潛在匹配, 但也引起Palette.Builder花費(fèi)更久的時(shí)間來生成Palette.

Palette庫嘗試提取以下6個(gè)色彩配置文件:

  1. Light Vibrant
  2. Vibrant
  3. Dark Vibrant
  4. Light Muted
  5. Muted
  6. Dark Muted

每一個(gè)Palette.get<Profile>Color()方法返回了Palette中的顏色, 而每一個(gè)Palette關(guān)聯(lián)了一個(gè)特定的配置文件, 其中, <Profile>被以上6個(gè)色彩配置文件名取代. 比如, 獲取Dark Vibrant色彩配置文件的方法是getDarkVibrantProfile(). 因?yàn)椴皇撬械膱D片都會(huì)包含所有的色彩配置文件, 所以, 你必須也提供一個(gè)默認(rèn)顏色返回.

Android Support Palette使用詳解

使用樣本創(chuàng)建色彩體系

Palette對(duì)象也為每一個(gè)色彩配置文件生成 Palette.Swatch對(duì)象. Palette.Swatch對(duì)象包含對(duì)象的配置文件關(guān)聯(lián)的顏色和顏色的像素分布.

Swatch擁有額外的方法來訪問色彩配置文件更多的信息, 比如HSL值, 像素分布等. 你能夠通過使用getBodyTextColor()和getTitleTextColor()來生成更多繁雜的色彩體系和應(yīng)用主題. 這些方法返回的顏色恰好配合Swatch的顏色使用.

每一個(gè)Palette.get<Profile>Swatch()方法返回了關(guān)聯(lián)特定配置文件的Swatch. 盡管get<Profile>Swatch()方法并不默認(rèn)值參數(shù), 如果圖片中并不存在特定的某個(gè)配置文件, 該方法會(huì)返回null. 由此, 你應(yīng)該在使用Swatch之前判斷它是否為空. 比如, 下面的代碼從Palette中獲取了標(biāo)題文本顏色, 并檢查了Vibrant Swatch是否為空:

 Palette.Swatch vibrant = myPalette.getVibrantSwatch();
 if(vibrant != null){
  int titleColor = vibrant.getTitleTextColor();
  // ...
 }

要訪問Palette中的所有顏色, getSwatches()方法返回了包含圖片中生成的所有Swatch的列表, 包括標(biāo)準(zhǔn)的6個(gè)色彩配置文件.

下面的代碼片斷使用了上述代碼片斷, 同步生成了Palette, 獲取了Vibrant Swatch, 改變了Toolbar顏色, 以匹配Bitmap圖片. 下面的圖片則展示了結(jié)果和toolbar

Android Support Palette使用詳解

// Set the background and text colors of a toolbar given a
// bitmap image to match
public void setToolbarColor(Bitmap bitmap) {
 // Generate the palette and get the vibrant swatch
 // See the createPaletteSync() method
 // from the code snippet above
 Palette p = createPaletteSync(bitmap);
 Palette.Swatch vibrantSwatch = p.getVibrantSwatch();

 Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);

 // Load default colors
 int backgroundColor = ContextCompat.getColor(getContext(),
  R.color.default_title_background);
 int textColor = ContextCompat.getColor(getContext(),
  R.color.default_title_color);

 // Check that the Vibrant swatch is available
 if(vibrantSwatch != null){
  backgroundColor = vibrantSwatch.getRgb();
  textColor = vibrantSwatch.getTitleTextColor();
 }

 // Set the toolbar background and text colors
 toolbar.setBackgroundColor(backgroundColor);
  toolbar.setTitleTextColor(textColor);
}

以上就是本文的全部內(nèi)容,希望對(duì)大家的學(xué)習(xí)有所幫助,也希望大家多多支持創(chuàng)新互聯(lián)。

本文名稱:AndroidSupportPalette使用詳解
本文鏈接:http://muchs.cn/article32/geeosc.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供移動(dòng)網(wǎng)站建設(shè)、營銷型網(wǎng)站建設(shè)、軟件開發(fā)、標(biāo)簽優(yōu)化響應(yīng)式網(wǎng)站、做網(wǎng)站

廣告

聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請(qǐng)盡快告知,我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如需處理請(qǐng)聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來源: 創(chuàng)新互聯(lián)

成都做網(wǎng)站