Advanced Android - Color Palette



Color Palette which can help you to pick colors from an image dynamically

Example

This example demostrate about how to integrate Color Palette.

Step 1 − Create a new project in Android Studio, go to File ⇒ New Project and fill all required details to create a new project.

Step 2 − Add the following code to res/layout/activity_main.xml.

<?xml version = "1.0" encoding = "utf-8"?>
<LinearLayout xmlns:android = "http://schemas.android.com/apk/res/android"
   xmlns:tools = "http://schemas.android.com/tools"
   android:layout_width = "match_parent"
   android:orientation = "vertical"
   android:layout_height = "match_parent"
   android:paddingBottom = "@dimen/activity_vertical_margin"
   android:paddingLeft = "@dimen/activity_horizontal_margin"
   android:paddingRight = "@dimen/activity_horizontal_margin"
   android:paddingTop = "@dimen/activity_vertical_margin">
   <ImageView
      android:src = "@drawable/abcd"
      android:layout_width = "match_parent"
      android:layout_height = "300dp"
      android:scaleType = "fitXY"
      android:text = "Hello World!" />
   <ListView
      android:layout_marginTop = "@dimen/activity_horizontal_margin"
      android:id = "@+id/list_color"
      android:layout_width = "match_parent"
      android:layout_height = "wrap_content"/>
</LinearLayout>

Step 3 − Add the following code to src/MainActivity.java

package myapplication.example.com.myapplication;

import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.support.v7.graphics.Palette;
import android.widget.ListView;

public class MainActivity extends AppCompatActivity {
   private ListView listView;
   private SwatchesAdapter swatchesAdapter;
   
   @Override
   protected void onCreate(Bundle savedInstanceState) {
      super.onCreate(savedInstanceState);
      setContentView(R.layout.activity_main);
      listView = (ListView) findViewById(R.id.list_color);
      
      swatchesAdapter = new SwatchesAdapter(this);
      listView.setAdapter(swatchesAdapter);
      
      //get bitmap from drawable resource
      Bitmap bitmap = BitmapFactory.decodeResource(getResources(), R.drawable.abcd);
      
      //generating Palette from this bitmap
      Palette.from(bitmap).generate(new Palette.PaletteAsyncListener() {
         @Override
         public void onGenerated(Palette palette) {
            for (Palette.Swatch swatch : palette.getSwatches()) {
               swatchesAdapter.add(swatch);
            } 
            swatchesAdapter.sortSwatches();
            swatchesAdapter.notifyDataSetChanged();
         } 
      });
   }
}

Step 4 − Add the following code to src/SwatchesAdapter.java

package myapplication.example.com.myapplication;

import android.content.Context;
import android.support.v7.graphics.Palette;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ArrayAdapter;
import android.widget.TextView;

import java.util.Comparator;

public class SwatchesAdapter extends ArrayAdapter<Palette.Swatch> {
   public SwatchesAdapter(Context context) {
      super(context, 0);
   } 
   
   @Override
   public View getView(int position, View convertView, ViewGroup parent) {
      ViewHolder holder;
      if (convertView == null) {
         holder = new ViewHolder();
         convertView = LayoutInflater.from(
            getContext()).inflate(R.layout.color_item, parent, false);
            
         holder.view = (TextView) convertView.findViewById(R.id.view);
         convertView.setTag(holder);
      } else {
         holder = (ViewHolder) convertView.getTag();
      } 
      holder.view.setBackgroundColor(getItem(position).getRgb());
      holder.view.setTextColor(getItem(position).getBodyTextColor());
      holder.view.setText(String.format(
         "Population: %d", getItem(position).getPopulation()));
      
      return convertView;
   } 
   public void sortSwatches() {
      sort(new Comparator<Palette.Swatch>() {
         @Override
         public int compare(Palette.Swatch lhs, Palette.Swatch rhs) {
            return rhs.getPopulation() - lhs.getPopulation();
         } 
      }); 
   } 
   public class ViewHolder {
      TextView view;
   }
}

Step 5 − Add the following code to res/layout/color_item.xml.

<?xml version = "1.0" encoding = "utf-8"?>
<TextView xmlns:android = "http://schemas.android.com/apk/res/android"
   android:id = "@+id/view"
   android:layout_width = "match_parent"
   android:layout_height="wrap_content"
   android:text = "Text"/>

Step 6 − Add the following code to build.gradle

dependencies {
   compile fileTree(dir: 'libs', include: ['*.jar'])
   testCompile 'junit:junit:4.12'
   compile 'com.android.support:appcompat-v7:24.2.1'
   compile 'com.android.support:palette-v7:24.1.1'
}

Step 7 − No need to change manifest.xml

Let's try to run your application. I assume you have connected your actual Android Mobile device with your computer. To run the app from android studio, open one of your project's activity files and click Run Eclipse Run Icon icon from the toolbar. Select your mobile device as an option and then check your mobile device which will display your default screen −

Eclipse Run Icon
Advertisements