【やさしいC#】lesson8.1 グラフィックの基本

画像を処理する

　　描画に関する処理について見ていくことにしましょう。
　　私たちは、ピクチャーボックスを使って画像を読み込み、表示しています。しかし、これまでのプログラムは、プログラムの処理中も変化しない画像を表示しているに過ぎません。ウインドウ上で高度な画像処理をしつつ動作するプログラムを作成していくためには、これまでの知識だけでは不十分です。高度な画像処理を行うためには、プログラム処理中に様々な手法で画像を描画する必要があります。

フォームに描画をする

　　描画を行うには、これまでにもコントロールを扱う際に利用してきた、イベント処理の仕組みを利用することになります。
　　今度は

　　Paintイベント

　　を処理することになります。これは、ソースを描画するイベントです。

　　例えばフォームに描画したい場合にはPaintEventHandler(Object sender, PaintEventArgs e)デリゲートによって、イベントハンドラを設計・登録する必要があります。

this.Paint += new PaintEventHandler(fm_Paint);
　　このイベントハンドラ内で、Graphicsオブジェクトを取得します。このオブジェクトのメソッドを使って様々な画像処理を行うのです。なお、イベントハンドラの２つ目の引数はPaintEventArgsとする必要があります。

画像を描画・回転する

　　それでは、どんな画像処理を行うことができるのでしょうか。実際にコードを作成しながらみていくことにしましょう。

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

namespace lesson8
{
    class sample1 : Form
    {
        private Image img; 
        static void Main(string[] args)
        {
            Application.Run(new sample1());
        }
        public sample1()
        {
            this.Text = "lesson8 グラフィックの基本";
            this.Width = 400; this.Height = 300;

            img = Image.FromFile("E:\\099_Technology\\C#\\csharp\\csharp_train\\lesson2\\google.JPG");

            this.Click += new EventHandler(fm_Click);
            this.Paint += new PaintEventHandler(fm_Paint);
        }
        public void fm_Click(object sender, EventArgs e)
        {
            img.RotateFlip(RotateFlipType.Rotate90FlipNone);
            this.Invalidate();
        }
        public void fm_Paint(object sender, PaintEventArgs e)
        {
            Graphics g = e.Graphics;
            g.DrawImage(img, 0, 0);
        }

    }
}

　　ここでは、クリックした場合に処理されるイベントハンドラ内で、画像の回転を行うようにしています。

public void fm_Click(object sender, EventArgs e)
{
img.RotateFlip(RotateFlipType.Rotate90FlipNone); //回転・反転を行う。
this.Invalidate();
}

RotateFlipType 列挙体のメンバとして、Rotate「回転」Flip「反転」という指定ができます。

回転…None、90、180、270
反転…None、X、XY、Y
回転を行ったら、フォーム画面を、回転後の状態で描画しなおす必要があります。このために、次のフォームを再描画する メソッド であるInvalidate()メソッドを呼び出します。
this.Invalidate();
　　この呼び出しが行われると、今度はフォームのPaintイベントが発生し、イベントハンドラの処理を行われます。GraphicsクラスのDrawImage()メソッド を指定位置に画像を描画することができます。

public void fm_Paint(object sender, PaintEventArgs e)
{
Graphics g = e.Graphics;
g.DrawImage(img, 0, 0); //画像を描画する
}

なお、Invalidate()の呼び出しを行わないと、画像が回転した状態に描画されないので、注意してください。画像を変更したタイミングで(クリックしたときに)描画を行う必要があるのです。

クラス	説明
System.Drawing.Graphicsクラス
DrawImage(Image i, float x, float y)	指定位置に画像を描画する
System.Drawing. Imageクラス
void RotateFlip(RotateFlipType t)メソッド	画像を回転・反転する
System.Windows.Forms.Controlクラス
void Invalidate()メソッド	コントロールを再描画する

画像を拡大・縮小する

　　次に画像の拡大・縮小を行ってみましょう。今度は拡大・縮小の選択を行うラジオボタンを使って処理してみることにします。

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

namespace lesson8
{
    class sample2 : Form
    {
        private Image img;
        private RadioButton rb1, rb2, rb3;
        private GroupBox gb;
        private int i;
        static void Main(string[] args)
        {
            Application.Run(new sample2());
        }
        public sample2()
        {
            this.Text = "lesson8 グラフィックの基本";
            this.Width = 400; this.Height = 300;

            img = Image.FromFile("E:\\099_Technology\\C#\\csharp\\csharp_train\\lesson2\\google.JPG");

            rb1 = new RadioButton();rb2 = new RadioButton();rb3 = new RadioButton();
            rb1.Text = "通常";rb2.Text = "拡大"; rb3.Text = "縮小";
            rb1.Dock = rb2.Dock = rb3.Dock = DockStyle.Bottom;
            rb1.Checked = true;

            gb = new GroupBox();gb.Text = "種類"; gb.Dock = DockStyle.Bottom;
            rb1.Parent = rb2.Parent = rb3.Parent = this;

            rb1.Click += new EventHandler(rb_Click);
            rb2.Click += new EventHandler(rb_Click);
            rb3.Click += new EventHandler(rb_Click);

            this.Paint += new PaintEventHandler(fm_Paint);
        }
        public void rb_Click(object sender, EventArgs e)
        {
            RadioButton tmp = (RadioButton)sender;
            if (tmp == rb1)
            { i = 1; }
            else if (tmp == rb2)
            { i = 2; }
            else if (tmp == rb3)
            { i = 3; }

            this.Invalidate();
        }
        public void fm_Paint(object sender, PaintEventArgs e)
        {
            Graphics g = e.Graphics;
            if (i == 1)
            {
                g.DrawImage(img, 0, 0);//画像を描画する
            }
            else if (i == 2)
            {
                g.DrawImage(img, 0, 0,img.Width*2,img.Height*2);//拡大を行う
            }
            else if (i == 3)
            {
                g.DrawImage(img, 0, 0, img.Width / 2, img.Height / 2);//縮小を行う
            }
            
        }

    }
}

　　ここでは通常・拡大・縮小のいずれが表示されるかを変数iで管理しています。
DrawImage()メソッドで必要な引数を指定すれば、必要な大きさで描画できます。

g.DrawImage(img, 0, 0,img.Width2,img.Height2);//拡大を行う
g.DrawImage(img, 0, 0, img.Width / 2, img.Height / 2);//縮小を行う

クラス	説明
System.Drawing.Graphicsクラス
DrawImage(Image i, float x, float y,int w, int h)メソッド	指定位置に指定幅・高さで画像を描画する