Android Create Color Picker Dialog Example Tutorial Using Github Library

How to select color from Color Picker Dialog and change activity screen background programmatically.

In this tutorial we would going to make Color picker Dialog using GitHub library known as AmbilWarna library. This library is an amazing library and used by over hundreds of applications.  So here is the complete step by step tutorial for Android Create Color Picker Dialog Example Tutorial Using Library.

android-project-download-code-button

How to Android Create Color Picker Dialog Example Tutorial Using Library.

1. Open your project’s build.gradle(Module:app) file.

build-gradle

2. Add compile ‘com.github.yukuku:ambilwarna:2.0.1’ inside dependencies scope.

Start Coding :

Code for MainActivity.java file.

package com.android_examples.colorpicker_android_examplescom;
import android.support.v4.content.ContextCompat;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.RelativeLayout;
import android.widget.Toast;

import yuku.ambilwarna.AmbilWarnaDialog;

public class MainActivity extends AppCompatActivity {

    Button button;
    RelativeLayout relativeLayout;
    int DefaultColor ;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        relativeLayout = (RelativeLayout) findViewById(R.id.activity_main);

        button = (Button) findViewById(R.id.button);

        DefaultColor = ContextCompat.getColor(MainActivity.this, R.color.colorPrimary);

        button.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {

                OpenColorPickerDialog(false);

            }
        });
    }

    private void OpenColorPickerDialog(boolean AlphaSupport) {

        AmbilWarnaDialog ambilWarnaDialog = new AmbilWarnaDialog(MainActivity.this, DefaultColor, AlphaSupport, new AmbilWarnaDialog.OnAmbilWarnaListener() {
            @Override
            public void onOk(AmbilWarnaDialog ambilWarnaDialog, int color) {

                DefaultColor = color;

                relativeLayout.setBackgroundColor(color);
            }

            @Override
            public void onCancel(AmbilWarnaDialog ambilWarnaDialog) {

                Toast.makeText(MainActivity.this, "Color Picker Closed", Toast.LENGTH_SHORT).show();
            }
        });
        ambilWarnaDialog.show();

    }

    }

Code for activity_main.xml layout file.

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/activity_main"
    android:layout_width="match_parent"
    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"
    tools:context="com.android_examples.colorpicker_android_examplescom.MainActivity">

    <Button
        android:text="open Color Picker Dialog"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_centerVertical="true"
        android:layout_centerHorizontal="true"
        android:id="@+id/button" />

</RelativeLayout>

Screenshots:

Android Create Color Picker Dialog Example Tutorial Using Library

Click here to download Android Create Color Picker Dialog Example Tutorial Using Library project with source code.

Leave a Reply

Your email address will not be published. Required fields are marked *