HeyCHのブログ

慢性疲労のへいちゃんです

【C#】PictureBoxでお絵かきしよう

前回、前々回に引き続いてPictureBoxについて学んでいきたいと思います。
heych.hatenablog.com
heych.hatenablog.com

プロジェクトの準備

そろそろ慣れてきたと思うので、プロジェクトの準備画像は省略して画像1個だけにします。
Form1にPictureBoxを配置し、AnchorプロパティをTop,Bottom,Left,Rightにしただけです。
f:id:HeyCH:20200410234140p:plain

プロジェクトのリソースに画像を追加し、PictureBoxに描画

まだリソースを使ったことがなかったので、紹介がてらやってみようと思います。

  • ソリューションを右クリックしてプロパティを選択

f:id:HeyCH:20200410235013p:plain

  • リソースを選択して、メニューからイメージを選択

f:id:HeyCH:20200410235220p:plain

  • リソースの追加メニューから、既存のファイルの追加を選択

f:id:HeyCH:20200410235701p:plain
f:id:HeyCH:20200410235714p:plain

  • Form1をダブルクリックしてコードを記述
        Graphics gra;
        private void Form1_Load(object sender, EventArgs e) {
            pictureBox1.Image = new Bitmap(pictureBox1.Width, pictureBox1.Height);
            gra = Graphics.FromImage(pictureBox1.Image);
            gra.DrawImage(Properties.Resources.Sample, new Point(0, 0));
        }

線や図形を描画してみよう

        Graphics gra;
        Font f = new Font("MS UI Gothic", 12.0f);
        Pen p = new Pen(Brushes.Red);
        private void Form1_Load(object sender, EventArgs e) {
            pictureBox1.Image = new Bitmap(pictureBox1.Width, pictureBox1.Height);
            gra = Graphics.FromImage(pictureBox1.Image);
            //画像の描画
            gra.DrawImage(Properties.Resources.Sample, new Point(0, 0));
            //線の描画
            gra.DrawLine(p, new Point(0, 0), new Point(100, 100));
            //文字列の描画
            gra.DrawString("テキストです", f, Brushes.Aqua, new PointF(50.0f, 0.0f));
            //楕円の描画
            gra.DrawEllipse(p, new RectangleF(50.0f, 50.0f, 100.0f, 50.0f));
            //四角形の描画
            gra.FillRectangle(Brushes.Gray, new Rectangle(10, 100, 30, 50));
        }

f:id:HeyCH:20200411002300p:plain

マウスで自由に描画する

  • PictureBoxにイベントを追加する

f:id:HeyCH:20200411003407p:plain

  • コードを記述
        Graphics gra;
        Pen p = new Pen(Brushes.Red);
        bool drag = false;
        int startX, startY;
        private void Form1_Load(object sender, EventArgs e) {
            pictureBox1.Image = new Bitmap(pictureBox1.Width, pictureBox1.Height);
            gra = Graphics.FromImage(pictureBox1.Image);
        }

        private void pictureBox1_MouseDown(object sender, MouseEventArgs e) {
            drag = true;
            startX = e.X;
            startY = e.Y;
        }

        private void pictureBox1_MouseUp(object sender, MouseEventArgs e) {
            drag = false;
        }

        private void pictureBox1_MouseMove(object sender, MouseEventArgs e) {
            if (!drag) return;
            gra.DrawLine(p, new Point(startX, startY), new Point(e.X, e.Y));
            pictureBox1.Refresh();
            startX = e.X;
            startY = e.Y;
        }

f:id:HeyCH:20200411003605p:plain