C# - Change Color Image to Black & White Image

Posted by ေတဇာလင္း Thursday 16 February 2017 0 comments

မိတ္ေဆြ၊ ညီအစ္ကို၊ ေမာင္ႏွမမ်ား အားလံုးပဲ မဂၤလာပါဗ်ာ။ ဒီေန႔ေတာ့ က်ေနာ္တို႔ Visual Studio C# ကို အသံုးျပဳၿပီး Color Image တစ္ခုကို Black & White ပံုစံသို႔ ဘရ္လိုေျပာင္းလဲ ယူႏိုင္မလဲဆိုတာေလးနဲ႔ ပါတ္သတ္ၿပီး ေလ့လာၾကည့္ပါ့မရ္။ က်ေနာ့္ ေလ့က်င့္ခန္းေတြကေတာ့ စတင္ ေလ့လာသူမ်ားအတြက္သာ ရည္ရြယ္ပါတရ္။ ဒါေၾကာင့္ သိေနၿပီးသား သူမ်ားအေနနဲ႔ နားလည္ေပးၾကဖို႔နဲ႔ က်ေနာ္ရဲ႕ တင္ျပပံု မွားယြင္းတာမ်ားရွိခဲ့ရင္ ျပန္လည္ေထာက္ျပေပးႏိုင္ဖို႔ ေမွ်ာ္လင့္ပါတရ္ဗ်။

က်ေနာ္တို႔ ဒီေန႔ ေလ့က်င့္ခန္းေလးကို မေလ့လာမွီ Ditigal Image တစ္ခုရဲ႕ အၾကမ္းဖ်ဥ္း ဖြဲ႔စည္းပံုနဲ႔ သေဘာတရားကို ၾကည့္မရ္ဆိုရင္ သိခဲ့ၿပီးသားအတိုင္းပါပဲ... Image တစ္ခုဟာ 2-Dimension ပံုစံ Pixel ေတြနဲ႔ ဖြဲ႔စည္းထားပါတရ္။ Pixel တစ္ခုစီတိုင္းမွာေတာ့ အေျခခံအက်ဆံုး Red, Green, Blue and Alpha ဆိုတဲ့ Color တန္ဖိုးေတြရွိပါတရ္။ ဒီ Color တန္ဖိုး အခ်ိန္းအေျပာင္းေပၚမူတည္ၿပီး Pixel တစ္ခုစီတိုင္းမွာ Secondly Color တစ္ခုစီျဖစ္လာၿပီး ရုပ္လံုးေပၚကာ က်ေနာ္တို႔ ျမင္ကြင္းထဲကို ေရာက္လာတာပဲျဖစ္ပါတရ္။ ယင္းဆိုရင္ျဖင့္ Pixel တစ္ခုစီတိုင္းမွာရွိတဲ့ Color တန္ဖိုးေတြကို Black သို႔မဟုတ္ White အျဖစ္ ေျပာင္းလဲေပးႏိုင္မွသာ က်ေနာ္တို႔ လိုခ်င္ေနတဲ့ Black & White Image တစ္ခုကို ရရွိပါလိမ့္မရ္။

ဒီေတာ့ က်ေနာ္တို႔အေနနဲ႔ RGB Color Channel ရဲ႕ ဘရ္တန္ဖိုးေတြက Black ျဖစ္တရ္၊ ဘရ္တန္ဖိုးေတြက White ျဖစ္မရ္ဆုိတာကို သိဖို႔လိုအပ္လာပါၿပီ။ မခက္ခဲပါဘူးဗ်ာ။ Color တန္ဖိုးရဲ႕ lower bound ျဖစ္တဲ့ Zero(0) ဟာ Black Color ျဖစ္ၿပီး upper bound ျဖစ္တဲ့ 255 ဟာ White Color ျဖစ္ပါတရ္ (Color Channel တစ္ခုဟာ 0 to 255 ရွိတရ္ဆိုတာေတာ့ သိၾကမရ္ထင္ပါတရ္)။ ဆိုလိုတာကေတာ့ RBG(0, 0, 0) ဟာ Black Color ျဖစ္တရ္။ RGB(255, 255, 255) ဟာ White Color ျဖစ္တရ္လို႔ ေျပာတာပါ။

ကိုရင္ေမာင္ေရ... Color တန္ဖိုးေတြကို Black(0) ျဖစ္ျဖစ္၊ White(255) ျဖစ္ျဖစ္ ေျပာင္းလဲရမွာေတာ့ ဟုတ္ပါၿပီ။ Pixel ကို Detect လုပ္တဲ့အခါမွာ 0 to 255 ၾကား ဘာျဖစ္လာမရ္မွန္းမသိတဲ့ Color တန္ဖိုးေတြ ရမွာေလ။ ဒါကို က်ေနာ္တို႔က ဘရ္ဟာကို Black ေျပာင္းၿပီး ဘရ္ဟာကို White ေျပာင္းယူမွာလဲလို႔ ေမးဖို႔ရွိလာပါတရ္။ ဒီအေမးကိုေတာ့ က်ေနာ္တို႔အေနနဲ႔... ဒီ Algorithm အတြက္ တိတိက်က် သတ္မွတ္ထားတာမရွိပါဘူး။ User ရဲ႕ လိုအပ္ခ်က္အရ Threshold value တစ္ခုထားၿပီး ပိုင္းျခားလိုက္ပါလို႔ ေျဖရမွာပါပဲ။ Threshold Value ဆိုလို႔ ေခါင္းရႈပ္မသြားပါနဲ႔။ 0 to 255 ၾကား တန္ဖိုးတစ္ခုခုကို key အျဖစ္ အေသယူလိုက္တာပါ။ Detect ရရွိတဲ့ တန္ဖိုးဟာ ယင္း key နဲ႔ငယ္ရင္ Black ေျပာင္း၊ ႀကီးရင္ White အျဖစ္ေျပာင္းပါလို႔ ခိုင္းလိုက္တာပါ။ အမ်ားစုကေတာ့ Color Rage (0 to 255) ရဲ႕ တ၀တ္ျဖစ္တဲ့ 127 ကို Threshold Value ထားၿပီး Black & White Image အျဖစ္ ေျပာင္းယူၾကပါတရ္။ နားလည္ၾကမရ္ ထင္ပါတရ္ဗ်။

ကဲ... က်ေနာ္တို႔ Processing ရဲ႕ သေဘာတရားကို သိၿပီဆိုရင္ေတာ့ GUI ေလးေဖာက္ၿပီး Coding ေလးနဲ႔ လက္ေတြ႔ ေလ့လာၾကည့္ၾကရေအာင္။ ဒါကေတာ့ က်ေနာ္တို႔ Project မွာ အသံုးျပဳမရ္ Library File ေတြပါ။

using System;
using System.Drawing;
using System.Windows.Forms;
using System.Drawing.Imaging;

ဒီေန႔ ေလ့က်င့္ခန္းအတြက္ GUI တည္ေဆာက္ျခင္းအပိုင္းမွာေတာ့ က်ေနာ္ Button(1)ခု၊ Label(1)ခု၊ PictureBox(2)ခုနဲ႔ TrackBar(1)ခုကို အသံုးျပဳထားပါတရ္။ Tools ေတြရဲ႕ Properties ေတြကိုေတာ့ ေအာက္က Table အတိုင္း ျပင္ယူလိုက္ၾကပါဗ်ာ။

က်ေနာ္ကေတာ့ ေအာက္ကပံုအတိုင္း ပံုစံခ်ထားပါတရ္ဗ်ာ။ မိတ္ေဆြတို႔အေနနဲ႔ေတာ့ GUI ကို ႀကိဳက္သလို ပံုေဖာ္ ဖန္တီးႏိုင္ပါတရ္ဗ်။

ဒီေန႔ ေလ့က်င့္ခန္းမွာေတာ့ Black & White Processing အတြက္ သီးသန္႔ Button မထည့္ေတာ့ပဲ TrackBar ရဲ႕ Scroll_Event ထဲက တိုက္ရိုက္ Processing လွမ္းလုပ္တဲ့ ပံုစံေလးနဲ႔ ေလ့လာၾကည့္သြားပါ့မရ္။ ဒီေတာ့ TrackBar Value ေျပာင္းလဲမႈရွိတိုင္း Black & White Processing ေျပာင္းလဲမႈျဖစ္မွာ ျဖစ္ပါတရ္။ TrackBar ကို D-Click ေပးၿပီး ေအာက္က Method ေလးကို ေရးယူလိုက္ပါဗ်ာ။

public Image BlackAndWhiteImage(Image inputImg, int threshold) 
{
   Bitmap cloneImg = new Bitmap(inputImg);
   Rectangle rect = new Rectangle(0, 0, cloneImg.Width, cloneImg.Height);
   BitmapData bmpData = cloneImg.LockBits(rect, ImageLockMode.ReadWrite, PixelFormat.Format24bppRgb);

   unsafe {
      byte* firstAddress = (byte*)bmpData.Scan0;
      for (int y = 0; y < bmpData.Height; y++) {
         byte* currentAddress = firstAddress + (y * bmpData.Stride);
         for (int x = 0; x < bmpData.Stride; x = x + 3) {
             int averageColor = (currentAddress[x] + currentAddress[x+1] + currentAddress[x+2]) / 3;
             if (averageColor >= threshold) {
                currentAddress[x] = 255;
                currentAddress[x + 1] = 255;
                currentAddress[x + 2] = 255;
             }else {
                currentAddress[x] = 0;
                currentAddress[x + 1] = 0;
                currentAddress[x + 2] = 0;
             }
          }
       }
       cloneImg.UnlockBits(bmpData);
       return cloneImg;
   }            
}

Method ကိုေတာ့ Processing လုပ္မရ္႕ Image နဲ႔ Threshold Value ကုိ Parameter Passing လုပ္ထားပါတရ္။ Pixel Detection လုပ္တဲ့ လုပ္ငန္းစဥ္ကိုေတာ့ က်ေနာ္တို႔ ေရွ႕မွာေလ့လာခဲ့ၿပီးျဖစ္တဲ့ Fast Image Processing ေလ့က်င့္ခန္းအတိုင္း Detect လုပ္ထားပါတရ္။ နားမလည္ေသးတဲ့ မိတ္ေဆြတို႔အတြက္ ေရွ႕သင္ခန္းစာေတြကို ျပန္ဖတ္ေပးပါလို႔ တိုက္တြန္းပါရေစ။ ဒီမွာ Black & White အတြက္ ထူးျခားသြားတာကေတာ့ Pixel တစ္ကြက္ခ်င္းစီမွာ ရွိေနတဲ့ R, G, B Color တန္ဖုိး(၃)ခုကို ေပါင္းၿပီး အေရအတြက္နဲ႔ ျပန္စားကာ Average Color တန္ဖိုးကို ရွာယူလိုက္တာပါပဲ။ က်န္တာကေတာ့ က်ေနာ္ အေပၚမွာ ေဆြးေႏြးခဲ့ၿပီးတဲ့အတိုင္းပဲ ရလာတဲ့ averageColor တန္ဖိုးကို Threshold Value နဲ႔ ႏႈိင္းယွဥ္ပါတရ္။ averageColor ကႀကီးေနရင္ ယင္း Pixel ကြက္ရဲ႕ R, G, B Color တန္ဖိုးေတြကို 255 ေတြေပးၿပီး အျဖဴေရာင္ Pixel ကြက္အျဖစ္ေျပာင္းလဲယူပါတရ္။ ငယ္ခဲ့ရင္ေတာ့ 0 ေတြေပးၿပီး အနက္ေရာင္ Pixel ကြက္အျဖစ္ ဖန္တီးယူလိုက္တာပါ။ အရမ္း ရိုးရွင္းၿပီး လြယ္ကူလြန္းပါတရ္။

private void tbThresholdValue_Scroll(object sender, EventArgs e)
{
    lblThresholdValue.Text = tbThresholdValue.Value.ToString();
    if (picOriginalImg.Image != null) {
        picResultImg.Image = BlackAndWhiteImage(picOriginalImg.Image, tbThresholdValue.Value);
    }            
}

ဒါကေတာ့ Calling Method ပံုစံပါ။ ဘရ္ေလာက္ Threshold Value နဲ႔ Processing လုပ္ထားတရ္ဆိုတာကို ျပဖို႔ Label ကိုသံုးထားပါတရ္။ if()statement နဲ႔စစ္ထားတာကေတာ့ Processing လုပ္မရ္႕ Image ကုိဆြဲတင္ၿပီး ရွိ/မရွိကို သိခ်င္လို႔ပါ။

မိတ္ေဆြတို႔ အားလံုးကို ၿခံဳငံုနားလည္သြားေအာင္ ေအာက္မွာ Coding အျပည့္အစံုကို ေလ့လာႏိုင္ပါတရ္ဗ်။

using System;
using System.Drawing;
using System.Windows.Forms;
using System.Drawing.Imaging;

namespace ImgProcessing
{
    public partial class frmBlackAndWhiteImage : Form
    {
        public frmBlackAndWhiteImage()
        {
            InitializeComponent();
        }

        private void btnLoadImage_Click(object sender, EventArgs e)
        {
            LoadImage(picOriginalImg);
        }

        public void LoadImage(PictureBox pic) {
            OpenFileDialog openFD = new OpenFileDialog();
            openFD.Title = "Load an Image";
            openFD.Filter = "JPEG Images|*.Jpg|PNG Images|*.Png|GIF Images|*.Gif|BITMAP Images|*.Bmp";
            if (openFD.ShowDialog() == DialogResult.OK) {
                pic.Image = Image.FromFile(openFD.FileName);
            }
        }

        private void tbThresholdValue_Scroll(object sender, EventArgs e)
        {
            lblThresholdValue.Text = tbThresholdValue.Value.ToString();
            if (picOriginalImg.Image != null) {
                picResultImg.Image = BlackAndWhiteImage(picOriginalImg.Image, tbThresholdValue.Value);
            }            
        }

        public Image BlackAndWhiteImage(Image inputImg, int threshold) {
            Bitmap cloneImg = new Bitmap(inputImg);
            Rectangle rect = new Rectangle(0, 0, cloneImg.Width, cloneImg.Height);
            BitmapData bmpData = cloneImg.LockBits(rect, ImageLockMode.ReadWrite, PixelFormat.Format24bppRgb);

            unsafe
            {
                byte* firstAddress = (byte*)bmpData.Scan0;
                for (int y = 0; y < bmpData.Height; y++) {
                    byte* currentAddress = firstAddress + (y * bmpData.Stride);
                    for (int x = 0; x < bmpData.Stride; x = x + 3) {
                        int averageColor = (currentAddress[x] + currentAddress[x+1] + currentAddress[x+2]) / 3;
                        if (averageColor >= threshold) {
                            currentAddress[x] = 255;
                            currentAddress[x + 1] = 255;
                            currentAddress[x + 2] = 255;
                        }else {
                            currentAddress[x] = 0;
                            currentAddress[x + 1] = 0;
                            currentAddress[x + 2] = 0;
                        }
                    }
                }
                cloneImg.UnlockBits(bmpData);
                return cloneImg;
            }            
        }
    }
}

မိတ္ေဆြ၊ ညီအစ္ကို၊ ေမာင္ႏွမအားလံုး ေလ့လာျခင္းျဖင့္ ေက်နပ္ႏိုင္ၾကပါေစ။