Color Pickers from Google

There are a lot of Color Pickers available, some very nice.
The most difficult thing is to know that there are and where they are.

Here a first collection, written by Google.
Checkout in github repository last version and last document about usage.

Google Stock Calendar

You can find source in Color Picker repository.
You can download and use it

It is very simple to use. You have just to provide an array of colors.
  ColorPickerDialog colorcalendar = ColorPickerDialog.newInstance(
        R.string.color_picker_default_title, 
        mColor, 0, 5,
        Utils.isTablet(this)? ColorPickerDialog.SIZE_LARGE : ColorPickerDialog.SIZE_SMALL);
  colorcalendar.show(getFragmentManager(),"cal");
mColor is an array of Color.
public static int[] colorChoice(Context context){
 
    int[] mColorChoices=null; 
    String[] color_array = context.getResources().
                  getStringArray(R.array.default_color_choice_values);
 
    if (color_array!=null && color_array.length>0) {
           mColorChoices = new int[color_array.length];
           for (int i = 0; i < color_array.length; i++) {
              mColorChoices[i] = Color.parseColor(color_array[i]);
           }
    }
    return mColorChoices;
}
where default_color_choice_values is defined in res/colors.xml
<string-array name="default_color_choice_values" translatable="false">
        <item>#33b5e5</item>
        <item>#aa66cc</item>
        <item>#99cc00</item>
        <item>#ffbb33</item>
        <item>#ff4444</item>
        <item>#0099cc</item>
        <item>#9933cc</item>
        <item>#669900</item>
        <item>#ff8800</item>
        <item>#cc0000</item>
        <item>#ffffff</item>
        <item>#eeeeee</item>
        <item>#cccccc</item>
        <item>#888888</item>
    </string-array>
I think that Google Keep uses the same color picker.

DashClock Color Picker

Dashclock by Roman Nurik is an inexhaustible source of knowledge.

You can find an interesting implementation of Dashclock ColorPreference.

You can download and use it

It is very simple to use.You need just a preferences file.
 <PreferenceScreen xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res/it.gmariotti.android.example.colorpicker" >

    <PreferenceCategory android:title="@string/pref_config" >
         <it.gmariotti.android.example.colorpicker.dashclockpicker.ColorPreference
            android:key="preference_key"
            android:title="Preference Title"
            android:summary="Preference summary"
            android:defaultValue="@android:color/white"
            android:negativeButtonText="@null"
            android:positiveButtonText="@null"
            app:numColumns="5"
            app:itemLayout="@layout/dash_grid_item_color"/>
    </PreferenceCategory>

</PreferenceScreen>

ColorPreference is based on a DialogFragment.
I've extracted this Dialog in a separate class, removing the dependencies with Preferences.
You can find an example in ColorPickerDialogDash source. Also in this case, you should provide an array of colors as in previous example.

   //Custom Dialog extracted from ColorPreference
   ColorPickerDialogDash colordashfragment =   
        ColorPickerDialogDash.newInstance(
             R.string.color_picker_default_title,
             mColor,
             mSelectedColorDash1,5);
   
   //Implement listener to get selected color value
   colordashfragment.setOnColorSelectedListener(
      new ColorPickerDialogDash.OnColorSelectedListener(){

        @Override
        public void onColorSelected(int color) {
            mSelectedColorDash1=color; 
            item.colorSquare=color;
            mAdapter.notifyDataSetChanged();
        }
    
   });
   colordashfragment.show(getFragmentManager(), "dash");

You just have to use them.

You can get code from GitHub:

Popular posts from this blog

Expand and collapse animation

How to centralize the support libraries dependencies in gradle

A Material styled AlertDialog