本文共 6220 字，大约阅读时间需要 20 分钟。

Palette简介

可以从一张图片中提取颜色，我们可以把提取的颜色融入到App UI中，可以使UI风格更加美观融洽。比如，我们可以从图片中提取颜色设置给ActionBar做背景颜色，这样ActionBar的颜色就会随着显示图片的变化而变化。

Palette可以提取的颜色如下:

• Vibrant （有活力的）
• Vibrant dark（有活力的 暗色）
• Vibrant light（有活力的 亮色）
• Muted （柔和的）
• Muted dark（柔和的 暗色）
• Muted light（柔和的 亮色）

Palette的使用

1、添加依赖

compile 'com.android.support:palette-v7:x.x.x'

2、如何获取Palette对象

// 同步 Palette p = Palette.from(bitmap).generate(); // 异步  Palette.from(bitmap).generate(new PaletteAsyncListener() {     public void onGenerated(Palette p) {         // Use generated instance     } });

如果图片过大使用generate方法，可能会阻塞主线程，我们更倾向于使用generateAsync的方法，其实内部就是创建了一个AsyncTask。generateAsync方法需要一个PaletteAsyncListener对象用于监听生成完毕的回调。除了必须的Bitmap参数外，还可以传入一个numColors参数指定颜色数，默认是 16。

Palette.getVibrantSwatch()Palette.getDarkVibrantSwatch()Palette.getLightVibrantSwatch()Palette.getMutedSwatch()Palette.getDarkMutedSwatch()Palette.getLightMutedSwatch()

使用颜色，上面get方法中返回的是一个 Swatch 样本对象，这个样本对象是Palette的一个内部类，它提供了一些获取最终颜色的方法。

getPopulation(): 样本中的像素数量getRgb(): 颜色的RBG值getHsl(): 颜色的HSL值getBodyTextColor(): 主体文字的颜色值getTitleTextColor(): 标题文字的颜色值

通过 getRgb() 可以得到最终的颜色值并应用到UI中。getBodyTextColor() 和 getTitleTextColor() 可以得到此颜色下文字适合的颜色，这样很方便我们设置文字的颜色，使文字看起来更加舒服。

private void initViews() {      mToolbar = (Toolbar) findViewById(R.id.toolbar);      // toolbar.setLogo(R.drawable.ic_launcher);      mToolbar.setTitle("Rocko");// 标题的文字需在setSupportActionBar之前，不然会无效      // toolbar.setSubtitle("副标题");      setSupportActionBar(mToolbar);      /* 这些通过ActionBar来设置也是一样的，注意要在setSupportActionBar(toolbar);之后，不然就报错了 */      // getSupportActionBar().setTitle("标题");      // getSupportActionBar().setSubtitle("副标题");      // getSupportActionBar().setLogo(R.drawable.ic_launcher);      /* 菜单的监听可以在toolbar里设置，也可以像ActionBar那样，通过下面的两个回调方法来处理 */      mToolbar.setOnMenuItemClickListener(new Toolbar.OnMenuItemClickListener() {          @Override          public boolean onMenuItemClick(MenuItem item) {              switch (item.getItemId()) {              case R.id.action_settings:                  Toast.makeText(MainActivity.this, "action_settings", 0).show();                  break;              case R.id.action_share:                  Toast.makeText(MainActivity.this, "action_share", 0).show();                  break;              default:                  break;              }              return true;          }      });      getSupportActionBar().setDisplayHomeAsUpEnabled(true);      /* findView */      mDrawerLayout = (DrawerLayout) findViewById(R.id.drawer);      mDrawerToggle = new ActionBarDrawerToggle(this, mDrawerLayout, mToolbar, R.string.drawer_open,              R.string.drawer_close);      mDrawerToggle.syncState();      mDrawerLayout.setDrawerListener(mDrawerToggle);      mPagerSlidingTabStrip = (PagerSlidingTabStrip) findViewById(R.id.tabs);      mViewPager = (ViewPager) findViewById(R.id.pager);      mViewPager.setAdapter(new MyPagerAdapter(getSupportFragmentManager()));      mPagerSlidingTabStrip.setViewPager(mViewPager);      mPagerSlidingTabStrip.setOnPageChangeListener(new OnPageChangeListener() {          @Override          public void onPageSelected(int arg0) {              colorChange(arg0);          }          @Override          public void onPageScrolled(int arg0, float arg1, int arg2) {          }          @Override          public void onPageScrollStateChanged(int arg0) {          }      });      initTabsValue();  }  /**  * mPagerSlidingTabStrip默认值配置  *   */  private void initTabsValue() {      // 底部游标颜色      mPagerSlidingTabStrip.setIndicatorColor(Color.BLUE);      // tab的分割线颜色      mPagerSlidingTabStrip.setDividerColor(Color.TRANSPARENT);      // tab背景      mPagerSlidingTabStrip.setBackgroundColor(Color.parseColor("#4876FF"));      // tab底线高度      mPagerSlidingTabStrip.setUnderlineHeight((int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP,              1, getResources().getDisplayMetrics()));      // 游标高度      mPagerSlidingTabStrip.setIndicatorHeight((int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP,              5, getResources().getDisplayMetrics()));      // 选中的文字颜色      mPagerSlidingTabStrip.setSelectedTextColor(Color.WHITE);      // 正常文字颜色      mPagerSlidingTabStrip.setTextColor(Color.BLACK);  }  /**  * 界面颜色的更改  */  @SuppressLint("NewApi")  private void colorChange(int position) {      // 用来提取颜色的Bitmap      Bitmap bitmap = BitmapFactory.decodeResource(getResources(),              SuperAwesomeCardFragment.getBackgroundBitmapPosition(position));      // Palette的部分      Palette.generateAsync(bitmap, new Palette.PaletteAsyncListener() {          /**          * 提取完之后的回调方法          */          @Override          public void onGenerated(Palette palette) {              Palette.Swatch vibrant = palette.getVibrantSwatch();              /* 界面颜色UI统一性处理,看起来更Material一些 */              mPagerSlidingTabStrip.setBackgroundColor(vibrant.getRgb());              mPagerSlidingTabStrip.setTextColor(vibrant.getTitleTextColor());              // 其中状态栏、游标、底部导航栏的颜色需要加深一下，也可以不加，具体情况在代码之后说明              mPagerSlidingTabStrip.setIndicatorColor(colorBurn(vibrant.getRgb()));              mToolbar.setBackgroundColor(vibrant.getRgb());              if (android.os.Build.VERSION.SDK_INT >= 21) {                  Window window = getWindow();                  // 很明显，这两货是新API才有的。                  window.setStatusBarColor(colorBurn(vibrant.getRgb()));                  window.setNavigationBarColor(colorBurn(vibrant.getRgb()));              }          }      });  }  /**  * 颜色加深处理  *   * @param RGBValues  *            RGB的值，由alpha（透明度）、red（红）、green（绿）、blue（蓝）构成，  *            Android中我们一般使用它的16进制，  *            例如："#FFAABBCC",最左边到最右每两个字母就是代表alpha（透明度）、  *            red（红）、green（绿）、blue（蓝）。每种颜色值占一个字节(8位)，值域0~255  *            所以下面使用移位的方法可以得到每种颜色的值，然后每种颜色值减小一下，在合成RGB颜色，颜色就会看起来深一些了  * @return  */  private int colorBurn(int RGBValues) {      int alpha = RGBValues >> 24;      int red = RGBValues >> 16 & 0xFF;      int green = RGBValues >> 8 & 0xFF;      int blue = RGBValues & 0xFF;      red = (int) Math.floor(red * (1 - 0.1));      green = (int) Math.floor(green * (1 - 0.1));      blue = (int) Math.floor(blue * (1 - 0.1));      return Color.rgb(red, green, blue);  }

最终效果图如下：