Adding the key board events

Currently we have two different keyboard events for this program, first one is the key down which will trigger when any keys on the keyboard is pressed down and the second one is key up which is triggered when the keys are released. We cannot afford to trigger the event with every key because then the program will be very confusing to use so we will only trigger the event when certain keys are pressed. We are interested in UP, DOWN, LEFT and RIGHT keys on the keyboard. Let take a look at both of the functions, they are very similar to each other.

        private void Canvas_KeyDown(object sender, KeyEventArgs e)
        {
            if (e.Key == Key.Down)
            {
                goDown = true; // down key is pressed go down will be true
            }
            else if (e.Key == Key.Up)
            {
                goUp = true; // up key is pressed go up will be true
            }
            else if (e.Key == Key.Left)
            {
                goLeft = true; // left key is pressed go left will be true
            }
            else if (e.Key == Key.Right)
            {
                goRight = true; // right key is pressed go right will be true
            }
        }

        private void Canvas_KeyUp(object sender, KeyEventArgs e)
        {
            if (e.Key == Key.Down)
            {
                goDown = false; // down is released go down will be false
            }
            else if (e.Key == Key.Up)
            {
                goUp = false; // up key is released go up will be false
            }
            else if (e.Key == Key.Left)
            {
                goLeft = false; // left key is released go left will be false
            }
            else if (e.Key == Key.Right)
            {
                goRight = false; // right key is released go right will be false
            }
        }

Canvas_KeyDown function contains 4 if statements that’s checking for their respective keys being pressed. If you look at the first if statement if (e.Key == Key.Down) is checking if the pressed key is DOWN then we can change the goDown Boolean to true. This will be useful in the timer event. In this function we are doing the same to rest of the keys. Each key is turning the concurring Booleans to true.

In the Canvas_KeyUp function we are reversing the Booleans we turned true in the first function. Its similar to the key down function except when the DOWN key is pressed and released it will turn the goDown Boolean back to false. This logic follows through the function.

The Timer Function –

Below is the timer function, let’s take a look on how the timer is helping us move the rectangle across the form.

        private void Timer_Tick(object sender, EventArgs e)
        {
            if (goUp && Canvas.GetTop(rec1) > 0)
            {
                Canvas.SetTop(rec1, Canvas.GetTop(rec1) - speed);
                // if go up is true and player is within the boundary from the top 
                // then we can use the set top to move the rec1 towards top of the screen
            }
            if (goDown && Canvas.GetTop(rec1) + (rec1.Height * 2) < Application.Current.MainWindow.Height)
            {
                Canvas.SetTop(rec1, Canvas.GetTop(rec1) + speed);
                // if go down is true and player is within the boundary from the bottom of the screen
                // then we can set top of rec1 to move down
            }
            if (goLeft && Canvas.GetLeft(rec1) > 0)
            {
                Canvas.SetLeft(rec1, Canvas.GetLeft(rec1) - speed);
                // if go left is true and player is inside the boundary from the left
                // then we can set left of the player to move towards left of the screen
            }
            if (goRight && Canvas.GetLeft(rec1) + (rec1.Width * 2) < Application.Current.MainWindow.Width)
            {
                Canvas.SetLeft(rec1, Canvas.GetLeft(rec1) + speed);
                // if go right is true and player is inside the boundary from the right
                // then we can set left of the player to move towards right of the screen
            }
        }
    }

In the timer function we have 4 different if statements. Lets break them down

if (goUp && Canvas.GetTop(rec1) > 0)

{

Canvas.SetTop(rec1, Canvas.GetTop(rec1) – speed);

// if go up is true and player is within the boundary from the top

// then we can use the set top to move the rec1 towards top of the screen

}

This is the first if statement first we are IF goUp Boolean is true meaning if the player has pressed the UP button then we are using the double & sign which means both of these conditions will need to be true in order for the other instructions to go on. We are looking for the goUp Boolean to be true and Canvas.GetTop(rec1) meaning get the top of the object is greater than 0 meaning if the object is inside the form then we can move it up. In this case if we hit the top of the form then it will stop.

Canvas.SetTop(rec1, Canvas.GetTop(rec1) – speed);

We are using Canvas.SeTop(), inside this Set top function we need to add two different values inside it, first which object we are querying and second is the position we want to move to, so we are using the Get top again to get the position of the rec1 object and we will deduct the speed integer from it. Notice that since we want to make the object move up we are deducting the speed from the current position.

if (goDown && Canvas.GetTop(rec1) + (rec1.Height * 2) < Application.Current.MainWindow.Height)

{

Canvas.SetTop(rec1, Canvas.GetTop(rec1) + speed);

// if go down is true and player is within the boundary from the bottom of the screen

// then we can set top of rec1 to move down

}

This if statement is checking if the goDown Boolean is true AND we get the top position of the rec1 object and then we are adding the height TIMES 2 meaning we will get the full height of the object and it needs to be less the height of the main window meaning its still inside the boundary. When both of these conditions are met we can then move the object down. In the last if statement we were deducting the speed from the set top function since we want to make it go down we are now adding the speed to it.

if (goLeft && Canvas.GetLeft(rec1) > 0)

{

Canvas.SetLeft(rec1, Canvas.GetLeft(rec1) – speed);

// if go left is true and player is inside the boundary from the left

// then we can set left of the player to move towards left of the screen

}

Now that we have done UP and DOWN for LEFT and RIGHT keys. They are similar to the ones before except for GetTop which changes to GetLeft and SetTop chages to SetLeft. In this if statement we are checking if goLeft is true AND rec1’s left position is greater than 0 then we can continue to move by using the SetLeft and deducting the speed from the GetLeft position.

if (goRight && Canvas.GetLeft(rec1) + (rec1.Width * 2) < Application.Current.MainWindow.Width)

{

Canvas.SetLeft(rec1, Canvas.GetLeft(rec1) + speed);

// if go right is true and player is inside the boundary from the right

// then we can set left of the player to move towards right of the screen

}

Above is the go right if statement, this one is checking if the go right Boolean is true, rec1’s get left plus the width times 2 is less than the applications width then we can move the object to the right.

If you managed to follow this so far, well done. New code can always be little daunting but always keep trying.

Full Source code available.

Moo Out.