C# Tutorial – Create a Single 4 Directional moving image with .Net, Windows Form and Visual Studio

Hi, in this tutorial we will moving a single dynamically drawn image across the screen on all 4 directions using the arrow keys. For any games development project player movements are very important. We are experimenting with moving images not by using picture boxes but by drawing them directly to the form. This way we can draw multiple images on the screen as you may have seen in the particle effects tutorials we have done before. This tutorial will explore how to give control the user and move an image inside of the form using the key down and key up events. We will also make use of the timer and the paint event in windows form. We won’t be using any extra libraries or frameworks for this, we will only using C# and Visual Studio. Lets get started.

Lesson Objectives –

  1. Move an object up, down, left and right using the arrow keys
  2. Assign key down and key up events to the form
  3. Use the paint event to dynamically draw the image to the screen
  4. Use the timer to control the movement and speed
  5. Limit the objects movement to inside of the form only
  6. Have fun

Video Tutorial

 

Download the images here

 

Source Code –

 

namespace _4_way_single_image_movement_MOO_ICT
{
    public partial class Form1 : Form
    {

        // created by mooict.com 2022
        // for educational purpose only

        Image FootBall;
        bool goLeft, goRight, goUp, goDown;
        int speed = 10;
        int positionX = 200;
        int positionY = 200;
        int height = 50;
        int width = 50;

        public Form1()
        {
            InitializeComponent();


            this.BackgroundImage = Image.FromFile("bg.jpg");
            this.BackgroundImageLayout = ImageLayout.Stretch;
            FootBall = Image.FromFile("ball.png");
        }

        private void TimerEvent(object sender, EventArgs e)
        {

            if (goLeft && positionX > 0)
            {
                positionX -= speed;
            }
            if (goRight && positionX + width < this.ClientSize.Width) { positionX += speed; } if (goUp && positionY > 0)
            {
                positionY -= speed;
            }
            if (goDown && positionY + height < this.ClientSize.Height)
            {
                positionY += speed;
            }


            this.Invalidate();

        }

        private void KeyIsDown(object sender, KeyEventArgs e)
        {
            if (e.KeyCode == Keys.Left)
            {
                goLeft = true;
            }
            else if (e.KeyCode == Keys.Right)
            {
                goRight = true;
            }
            else if (e.KeyCode == Keys.Up)
            {
                goUp = true;
            }
            else if (e.KeyCode == Keys.Down)
            {
                goDown = true;
            }
        }

        private void KeyIsUp(object sender, KeyEventArgs e)
        {
            if (e.KeyCode == Keys.Left)
            {
                goLeft = false;
            }
            else if (e.KeyCode == Keys.Right)
            {
                goRight = false;
            }
            else if (e.KeyCode == Keys.Up)
            {
                goUp = false;
            }
            else if (e.KeyCode == Keys.Down)
            {
                goDown = false;
            }
        }

        private void FormPaintEvent(object sender, PaintEventArgs e)
        {
            Graphics Canvas = e.Graphics;

            Canvas.DrawImage(FootBall, positionX, positionY, width, height);

        }
    }
}




Comment on this tutorial and let us know how you got on -