Androidでモノクロ変換

最近は忙しくて。。。
記事書くのが久しぶりになってしまった。
今日は、久しぶりに時間があったので、何か新しいことに挑戦したいなと思い、お題を考えていました。
かしこまって考えるとなかなかいい題材がなくて。。。
結局、画像をモノクロにしてみたいなって思い、画像のモノクロサンプルを作成しました。
では、作成方法を書いていきたいと思います。


メイン画面
f:id:nlinks:20160212190935p:plain

処理終了後
f:id:nlinks:20160212190940p:plain


① まずはメイン画面を作成します。画面はボタンと結果を表示するためのImageViewで構成します。

 1)レイアウトファイル(fragment_main.xml

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent"
    android:layout_height="match_parent" android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    android:paddingBottom="@dimen/activity_vertical_margin" tools:context=".MainActivity">

    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/imageView"
        android:layout_alignParentTop="true"
        android:layout_centerHorizontal="true"
        android:background="@drawable/base" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Monochrome"
        android:id="@+id/button"
        android:layout_below="@+id/imageView"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true"
        android:layout_alignParentRight="true"
        android:layout_alignParentEnd="true"
        android:onClick="onClickConvertMonochrome" />
</RelativeLayout>

 2)MainActivity.java

public class MainActivity extends AppCompatActivity 
{
    /* カラー → モノクロ 変換 */
    public void onClickConvertMonochrome(View view)
    {
        // 表示画面の取得 & 設定
        Bitmap baseImage = BitmapFactory.decodeResource(getResources(), R.drawable.base);
        baseImage = Bitmap.createScaledBitmap(baseImage, 400, 278, false);
        int width = baseImage.getWidth();
        int height = baseImage.getHeight();

        int[] pixels = new int[width * height];
        baseImage.getPixels(pixels, 0, width, 0, 0, width, height);

        for (int i = 0; i < width; i++)
        {
            for(int k = 0; k < height; k++)
            {
                int pixel = pixels[i + k * width];
                int red = Color.red(pixel);
                int green = Color.green(pixel);
                int blue = Color.blue(pixel);

                int gray = ((red * 2990 / 10000 ) +
                             (green * 5870 / 10000) +
                             (blue * 1140 / 10000 ));
                // モノクロ変換
                pixels[i + k * width] = Color.argb(Color.alpha(pixels[i + k * width]), gray, gray, gray);
            }
        }
        baseImage.setPixels(pixels, 0, width, 0, 0, width, height);
        ((ImageView)findViewById(R.id.imageView)).setImageBitmap(baseImage);
    }
}


こんな感じで、モノクロ変換できました。
ドット毎に色を取得して、モノクロに変換し、変換した値をもとにBitmapを作成している感じです。
応用すれば、画像編集のアプリなんかもつくれるなって思います。
皆さんもぜひ挑戦してみてください。