高级UI-Palette
Google推出的Palette是用来调色的,正如其汉语意思一样,可以用来显示颜色,在显示图片的时候,会配合图片的色调来显示,这样就显得很融合,其实Palette可以分析出图片中的很多特性,例如主色调、鲜艳度、柔和度等
Palette获得的颜色
其主要的获取颜色方法如下:
获取主要颜色:getDominantColor()
获取柔和颜色:getMutedColor()
获取鲜艳颜色:getVibrantColor()
获取亮、柔和颜色:getLightMutedColor()
获取亮、鲜艳颜色:getLightVibrantColor()
获取暗、柔和颜色:getDarkMutedColor()
获取暗、鲜艳颜色:getDarkVibrantColor()
Palette实例
在一张图片中显示出获得的以上颜色,并以Google推荐的颜色显示在图片上
在手机中找到一张以前做的拍黄瓜的图片,还有煎鸡蛋的图片,这里就是用这两张图片来演示,代码没有任何变化,只是改变了ImageView里面的src源
在使用Palette要先导入依赖,25.4.0为版本号
implementation 'com.android.support:palette-v7:25.4.0'
贴出布局
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="300dp">
<ImageView
android:id="@+id/image_view"
android:layout_width="300dp"
android:layout_height="300dp"
android:layout_centerInParent="true"
android:src="@drawable/cuke" />
<TextView
android:id="@+id/text_view"
android:layout_marginTop="5dp"
android:layout_width="300dp"
android:layout_height="120dp"
android:layout_centerHorizontal="true"
android:layout_alignBottom="@id/image_view"
android:gravity="center"
android:textSize="24sp"/>
</RelativeLayout>
<TextView
android:id="@+id/text_view_1"
android:layout_marginTop="5dp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:textSize="24sp"/>
<TextView
android:id="@+id/text_view_2"
android:layout_marginTop="5dp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:textSize="24sp"/>
<TextView
android:id="@+id/text_view_3"
android:layout_marginTop="5dp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:textSize="24sp"/>
<TextView
android:id="@+id/text_view_4"
android:layout_marginTop="5dp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:textSize="24sp"/>
<TextView
android:id="@+id/text_view_5"
android:layout_marginTop="5dp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:textSize="24sp"/>
<TextView
android:id="@+id/text_view_6"
android:layout_marginTop="5dp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:textSize="24sp" />
<TextView
android:id="@+id/text_view_7"
android:layout_marginTop="5dp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:textSize="24sp"/>
</LinearLayout>
然后在活动中使用
public class MainActivity extends AppCompatActivity {
private ImageView imageView;
private TextView textView1;
private TextView textView2;
private TextView textView3;
private TextView textView4;
private TextView textView5;
private TextView textView6;
private TextView textView7;
private TextView textView;
@Override
protected void onCreate(final Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
imageView = (ImageView) findViewById(R.id.image_view);
textView1 = (TextView) findViewById(R.id.text_view_1);
textView2 = (TextView) findViewById(R.id.text_view_2);
textView3 = (TextView) findViewById(R.id.text_view_3);
textView4 = (TextView) findViewById(R.id.text_view_4);
textView5 = (TextView) findViewById(R.id.text_view_5);
textView6 = (TextView) findViewById(R.id.text_view_6);
textView7 = (TextView) findViewById(R.id.text_view_7);
textView = (TextView) findViewById(R.id.text_view);
BitmapDrawable bitmapDrawable = (BitmapDrawable) imageView.getDrawable();
Bitmap bitmap = bitmapDrawable.getBitmap();
//同步方法,已弃用,可能造成线程阻塞
//Palette palette = Palette.generate(bitmap);
//异步
Palette.from(bitmap).generate(new Palette.PaletteAsyncListener() {
@Override
public void onGenerated(Palette palette) {
int dominantColor = palette.getDominantColor(Color.GRAY);
textView1.setBackgroundColor(dominantColor);
textView1.setText("DominantColor");
int mutedColor = palette.getMutedColor(Color.GRAY);
textView2.setBackgroundColor(mutedColor);
textView2.setText("MutedColor");
int vibrantColor = palette.getVibrantColor(Color.GRAY);
textView3.setBackgroundColor(vibrantColor);
textView3.setText("VibrantColor");
int lightMutedColor = palette.getLightMutedColor(Color.GRAY);
textView4.setBackgroundColor(lightMutedColor);
textView4.setText("LightMutedColor");
int lightVibrantColor = palette.getLightVibrantColor(Color.GRAY);
textView5.setBackgroundColor(lightVibrantColor);
textView5.setText("LightVibrantColor");
int darkMutedColor = palette.getDarkMutedColor(Color.GRAY);
textView6.setBackgroundColor(darkMutedColor);
textView6.setText("DarkMutedColor");
int darkVibrantColor = palette.getDarkVibrantColor(Color.GRAY);
textView7.setBackgroundColor(darkVibrantColor);
textView7.setText("DarkVibrantColor");
//推荐颜色获取
Palette.Swatch swatch = palette.getLightVibrantSwatch();
//推荐的主色调
int rgb = swatch.getRgb();
//推荐的主体文字颜色
int bodyTextColor = swatch.getBodyTextColor();
//推荐的标题文字颜色
int titleTextColor = swatch.getTitleTextColor();
//颜色向量
float[] hsl = swatch.getHsl();
//得到该颜色在图片中的值
int population = swatch.getPopulation();
textView.setBackgroundColor(getTranslucentColor(0.7F, rgb));
textView.setTextColor(bodyTextColor);
textView.setText("这是一道我做的菜");
}
});
}
private int getTranslucentColor(float persent, int rgb) {
//转化透明度
int blue = rgb & 0xFF;
int green = rgb >>> 8 & 0xFF;
int red = rgb >>> 16 & 0xFF;
int alpha = rgb >>> 24;
alpha = Math.round(alpha * persent);
return Color.argb(alpha, red, green, blue);
}
}
运行结果如下


高级UI-Palette的更多相关文章
- firefox 扩展开发笔记(三):高级ui交互编程
firefox 扩展开发笔记(三):高级ui交互编程 前言 前两篇链接 1:firefox 扩展开发笔记(一):jpm 使用实践以及调试 2:firefox 扩展开发笔记(二):进阶开发之移动设备模拟 ...
- Android 高级UI设计笔记07:RecyclerView 的详解
1. 使用RecyclerView 在 Android 应用程序中列表是一个非常重要的控件,适用场合非常多,如新闻列表.应用列表.消息列表等等,但是从Android 一出生到现在并没有非常 ...
- iOS开发——高级UI&带你玩转UITableView
带你玩装UITableView 在实际iOS开发中UITableView是使用最多,也是最重要的一个控件,如果你不会用它,那别说什么大神了,菜鸟都不如. 其实关于UItableView事非常简单的,实 ...
- 高级UI晋升之自定义View实战(六)
更多Android高级架构进阶视频学习请点击:https://space.bilibili.com/474380680本篇文章将从Android 自定义属性动画&Camera动画来介绍自定义V ...
- 高级UI晋升之布局ViewGroup(四)
更多Android高级架构进阶视频学习请点击:https://space.bilibili.com/474380680本篇文章将从LinearLayout.RelativeLayout.FrameLa ...
- 高级UI晋升之常用View(三)中篇
更多Android高级架构进阶视频学习请点击:https://space.bilibili.com/474380680本篇文章将从ViewPager来介绍常用View:文章目录 一.简介 二.基本使用 ...
- 高级UI晋升之View渲染机制(二)
更多Android高级架构进阶视频学习请点击:https://space.bilibili.com/474380680 优化性能一般从渲染,运算与内存,电量三个方面进行,今天开始说聊一聊Android ...
- 高级UI晋升之触摸事件分发机制(一)
更多Android高级架构进阶视频学习请点击:https://space.bilibili.com/474380680 0. 前言 鉴于安卓分发机制较为复杂,故分为多个层次进行讲解,分别为基础篇.实践 ...
- Android 高级UI设计笔记21:Android SegmentView(分段选择控件)
1. 分段控制(SegmentView) 首先我们先看看什么是SegmentView的效果,如下: 分段控制这个View控件是ios7的分段控制,和QQ消息页面顶部的效果一样,android没有这个控 ...
- Android 高级UI设计笔记17:Android在非UI线程中显示Toast
1. 子线程的Toast怎么显示不出来? 因为Toast在创建的时候会依赖于一个Handler,并且一个Handler是需要有一个Looper才能够创建,而普通的线程是不会自动去创建一个Looper对 ...
随机推荐
- sql server 存储过程 output 和return的使用 方法,详解
SQL Server目前正日益成为WindowNT操作系统上面最为重要的一种数据库管理系统,随着 SQL Server2000的推出,微软的这种数据库服务系统真正地实现了在WindowsNT/2000 ...
- *51nod 1815
从若干个数中选出最大的任意两数取模之后的结果 严格次大值 对于此题 首先缩点 然后拓扑排序 维护到达每个点的最大值与严格次大值 感觉思路与代码都OK啊 then.... #include <io ...
- Bzoj 3123: [Sdoi2013]森林(主席树+启发式合并)
3123: [Sdoi2013]森林 Time Limit: 20 Sec Memory Limit: 512 MB Description Input 第一行包含一个正整数testcase,表示当前 ...
- Atcoder Rating System
来翻译一下官方文档,但是建议看英文原文,本文可能会出现一些错误,只是为了方便自己查阅用的. 对于你的每一场rated比赛,会有一个Performance值\(X_i\),你的rating是\(X_i- ...
- CF891C Envy【最小生成树】
题目链接 我们知道,根据Kruskal的贪心,对于最小生成树,每一种权值的边数是一样的,而且如果将\(\leq x\)的边做最小生成树,合法方案的联通性是一样的.所以我们可以对于所有边分开考虑. 对于 ...
- 1.OC类
一.基础语法 1.在OC中,一般用2个文件来描述一个类: 1> .h:类的声明文件,用于声明成员变量.方法.类的声明使用关键字@interface和@end. 注意:.h中的方法只是做一个声明, ...
- Ubuntu14.04系统显示器不自动休眠修改
-----设置Ubuntu14.04不自动锁屏,常亮 右上角的菜单打开system setting ----- brightness&lock按钮 1. 2. 参考: https://blog ...
- HDU 1402 A * B Problem Plus ——(大数乘法,FFT)
因为刚学fft,想拿这题练练手,结果WA了个爽= =. 总结几点犯的错误: 1.要注意处理前导零的问题. 2.一定要注意数组大小的问题.(前一个fft的题因为没用到b数组,所以b就没管,这里使用了b数 ...
- Jenkins 更新 jenkins.war的方法
Jenkins 有时候更新,直接是主页提示下载 jenkins.war只需要把下载的jenkins.war 替换原来的jenkins.war 就可以了那么问题来了? 原来的 jenkins.war 到 ...
- mysql安装和简要操作命令+python基本操作mysql数据库
mysql数据库是一种关系型数据库管理系统. 一. windows平台安装Mysql数据库. Mysql数据库官网 :https://dev.mysql.com/downloads/windows/ ...