در این مقاله قصد داریم در مورد اشباع رنگ با استفاده از seekbar تغییر دهیم ، این نمونه برای تغییر رنگ پس زمینه و یا عکس ها قابل استفاده می باشد که می توانید با استفاده از seekbar تصویر مورد نظر خود را از حالت رنگی به حالت سیاه وسفید تبدیل نمایید.

ابتدا داخل صفحه از یک Imageview و یک seekbar استفاده می نماییم.

می توانید قبل از ادامه ی این مقاله, مقاله ی درک seekbar در اندروید را مطالعه نمایید.

با استفاده از seekkbar مورد نظر می توانید با تغییر دادن و جلو و عقب بردن آن رنگ عکس مورد نظر خود را تغییر دهید.

برای کنترل اشباع رنگ ما به متغییر هایی مثل colormatrix,colormatrixcolorfilter و یک شی به نام paint نیاز داریم.

اشباع رنگ توسط colormatrix پارامتر colormatrixcolorfilter را به آن پاس می دهد.

برای کشیدن bitmap باید شی مورد نظر را به صورت زیر set نمایید:

ابتدا داخل لایه ی activity قطعه کد زیر را قرار دهید:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:background="#FFFFFFEE"
    android:orientation="vertical" >
    <TextView
        android:id="@+id/textView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center_horizontal"
        android:gravity="center_horizontal"
        android:text="Use the seekbar to adjust the saturation:" />
    <ImageView
        android:id="@+id/iv_exampleimage"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center_horizontal"
        android:layout_marginBottom="20dip"
        android:layout_marginTop="20dip"
        android:src="@drawable/exampleimage" />
    <SeekBar
        android:id="@+id/sb_seekbar"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_marginBottom="30dip"
        android:layout_marginLeft="30dip"
        android:layout_marginRight="30dip"
        android:paddingLeft="12px"
        android:paddingRight="12px" />
</LinearLayout>

برای کلاس جاوا هم قطعه کد زیر را بنویسید:

import android.os.Bundle;  
import android.widget.ImageView;  
import android.widget.SeekBar;  
import android.widget.SeekBar.OnSeekBarChangeListener;  
import android.app.Activity;  
import android.graphics.Bitmap;  
import android.graphics.BitmapFactory;  
import android.graphics.Canvas;  
import android.graphics.ColorMatrix;  
import android.graphics.ColorMatrixColorFilter;  
import android.graphics.Paint;  
  
public class CISactivity extends Activity   
{  
    //An ImageView and a SeekBar  
    private ImageView ivImage;  
    private SeekBar sbSeekBar;  
  
    //These member variables responsible for modifying the color saturation  
    private ColorMatrix colorMatrix;  
    private ColorMatrixColorFilter cmFilter;  
    private Paint cmPaint;  
  
    //These member variables are responsible for drawing the Bitmap  
    private Canvas cv;  
    private Bitmap imgBitmap;  
    private Bitmap canvasBitmap;  
  
    @Override  
    public void onCreate(Bundle savedInstanceState)   
    {  
        super.onCreate(savedInstanceState);  
        setContentView(R.layout.activity_cisactivity);  
  
        //Initialize the ColorMatrix object  
        colorMatrix = new ColorMatrix();  
        //Initialize the ColorMatrixColorFilter object  
        cmFilter = new ColorMatrixColorFilter(this.colorMatrix);  
  
        //Initialize the cmPaint  
        cmPaint = new Paint();  
        //Set 'cmFilter' as the color filter of this paint  
        cmPaint.setColorFilter(cmFilter);  
  
        //Initialize the 'imgBitmap' by decoding the 'exampleimage.png' file  
        imgBitmap = BitmapFactory.decodeResource(getResources(), R.drawable.exampleimage);  
        //Create a new mutable Bitmap, with the same width and height as the 'imgBitmap'  
        canvasBitmap = Bitmap.createBitmap(128, 128, Bitmap.Config.ARGB_8888);  
        //Initialize the canvas assigning the mutable Bitmap to it  
        cv = new Canvas(canvasBitmap);  
  
        //Initialize the ImageView and the SeekBar objects by inflating them 'activity_cisactivity.xml' layout file  
        ivImage = (ImageView) findViewById(R.id.iv_exampleimage);  
        sbSeekBar = (SeekBar) findViewById(R.id.sb_seekbar);  
  
        //Sets the range between 0 and 100  
        sbSeekBar.setMax(100);  
        //Set the seek bar increments to 1  
        sbSeekBar.setKeyProgressIncrement(1);  
        //Set the progress to 100  
        sbSeekBar.setProgress(100);  
  
        sbSeekBar.setOnSeekBarChangeListener(new OnSeekBarChangeListener()   
        {  
            @Override  
            public void onStopTrackingTouch(SeekBar seekBar)   
            {  
            }  
  
            @Override  
            public void onStartTrackingTouch(SeekBar seekBar)   
            {  
            }  
  
            //This method is called every time the SeekBar thumb is dragged  
            @Override  
            public void onProgressChanged(SeekBar seekBar, int progress, boolean fromUser)   
            {  
                //Set the ColorMatrix saturation according to the SeekBar progress  
                colorMatrix.setSaturation(progress/(float)100);  
                //Create a new ColorMatrixColorFilter with the recently altered colorMatrix  
                cmFilter = new ColorMatrixColorFilter(colorMatrix);  
  
                //Assign the ColorMatrix to the paint object again  
                cmPaint.setColorFilter(cmFilter);  
  
                //Draw the Bitmap into the mutable Bitmap using the canvas. Don't forget to pass the Paint as the last parameter  
                cv.drawBitmap(imgBitmap, 0, 0, cmPaint);  
                //Set the mutalbe Bitmap to be rendered by the ImageView  
                ivImage.setImageBitmap(canvasBitmap);                 
            }  
        });   
    }  
}  

در مجموع 8 متغییر در activity بالا اعلام شده است که فقط دو مورد اول آن برای نمایش ویجت است.

3 متغییر هم برای colormatrix و برای اشباع رنگ تعریف شده است، آن ها شامل یک colormatrix و یک colormatrixfilter و یک شی برای رنگ تعریف شده است.

3 متغییر آخری برای نمایش Bitmap بر روی صفحه نمایش هستند، یکی برای bitmap و دو تای دیگر برای canvas هستند.

یکی از شی هایی که برای bitmap تعریف کرده ایم برای رمز گشایی تصویر است که  پیکسل را داخل یک فایل تصویری نگه می دارد، یک شی هم برای canvas تعریف کرده ایم که این شی مورد نظر هدف آن نمایش canvas است.

در داخل متد oncreate یک شی از نوع colormatrix ایجاد می نماییم، که این شی می تواند اشباع رنگ را با استفاده از ماتریس 4*5  تغییر داد، با استفاده از شی colormatrixcolorfilter می توان آن شی را مقدار دهی اولیه کرد.

شی که تعریف کرده ایم یک رنگ از تصویر است، بنابراین این یک امر لازم و ضروری است که شما یک شی به نام cmpaint داشته باشید و به عنوان یک پارامتر زمانی آن را به صورت یک Bitmap تولید نمایید.

یک شی bitmap که تصویر رمز گشایی شده را داخل پوشه ی res/drawable-HDPI نگه می دارد، و یک شی دیگر برای تولید canvas استفاده می شود و ذخیره خواهد شد.

از bitmap زمانی مورد استفاده خواهد شد که می خواهید یک عکسی را نمایش دهید برای اینکار باید از متد canvasDrawBitmap برای نمایش استفاده کنید.

برای رمز گشایی تصویر با استفاده از Imageview لازم است که یک شی bitmap را به عنوان یک پارامتر به روش Imageview.setImagebitmap ارسال نماییم که هدف ما از این متد تولید یک شی به صورت canvas است.

باید دو شی bitmap را در ابتدا مقدار دهی نمایید، به عنوان مثال عکس رمز گشایی شده داخل پوشه ی res/drawable/HDPI قرار دارد.

Bitmap دومی که مقدار دهی شده است برای canvas استفاده می شود، یک متد به نام  bitmap.CreateBitmap  تعریف نمایید و داخل آن یک عرض و ارتفاع یکسان برای تنظیم یک پیکسل استفاده نمایید.

حالا باید اشیاهایی را که داخل activity مورد نظر است تعریف کنیم یک imageview و یک seekbar داخل صفحه تعریف می کنیم، در حال حاضر برای تغییر اشباع رنگ، ما از تنظیمات seekbar استفاده می کنیم و

bitmap رمز گشایی شده را با استفاده از comPLaint رمز گشایی می نماییم.

حالا برای اینکه درجه ی seekbar تغییر نماید و بتوانید تصویر را رنگ آن را زیاد یا کم نمایید باید از تنظیمات خود sekkbar استفاده کنید و مقدار setprocess آن را 100 بگذارید.

حالا برای seekbar یک متد تعریف نمایید که زمانی که آن را اجرا نمایید 3 متد اجرا خواهد شد که فقط از onprogresschanged اینجا استفاده خواهد شد.

زمانی که شما seeekbar مورد نظر خود را تغییر می دهید و زیاد یا کم می نمایید رنگ عکس مورد نظرتان هم سیاه و سفید و رنگی می شود و با کشیدن نوار پیشرفت، پیشرفت seekbar  می توانید میزان اشباع تصویر خود را زیاد یا کم نمایید.

یک شی جدید از colormatrixcolorfilter ایجاد نمایید و شی colormatrix را به آن اختصاص دهید.

عکس bitmap با استفاده از شی canvas و cmpaint تولید می شود، با صدا زدن متد drawbitmap شی ای به نام cmpaint به عنوان آخرین پارامتر پاس داده می شود.

canvas یک تصویر از bitmap تولید شده را با اشباع مشخص تعریف شده توسط شی colormatrix تولید می نماید، برای نمایش تصویر مورد نظر بر روی screen باید از متد setImageBitmap یک Canvasbitmap به عنوان یک پارامتر پاس دهیم.

در آخر خروجی کار به صورت زیر خواهد بود: