Private High School for Digital Sciences “SoftUni BUDITEL”

Exercises: Numeral Systems and Pixels

Problems for exercises and homework for the "Math Concepts for Developers" course from the official "Applied
Programmer" curriculum.
You can check your solutions here: https://judge.softuni.org/Contests/4083/Numeral-Systems-and-Pixels-Exercises

Part 1: Numeral Systems

1. Numeral Converter
In this problem you are given a simple WinForms desktop app:

→
Your task is to implement a couple of methods that convert numbers from different numeral systems:

© SoftUni Buditel – https://buditel.softuni.bg. Copyrighted document. Unauthorized copy, reproduction or use is not permitted.
 Private High School for Digital Sciences “SoftUni BUDITEL”

Hints
Converting from Base Ten
To convert a number in base 10 to another base we will create a simple method ConvertFromBaseTen(). The
method takes a number and a base to convert it to. It starts by initiating a Stack<char> for the digits:

Then while the number is not zero, we take the digit for processing. If the number is not above 10, we can just use
the number as it is. If higher, we would need to convert it to a letter for hexadecimal numbers:

Finally, we create a StringBuilder to build the number from the digits and return it as string:

From here we can use the method to convert decimal to binary:

© SoftUni Buditel – https://buditel.softuni.bg. Copyrighted document. Unauthorized copy, reproduction or use is not permitted.
 Private High School for Digital Sciences “SoftUni BUDITEL”

And we can see that it works in the app:

Now implement the rest of the methods to make all the buttons work using our method. Do not use built-in
methods.
You can reuse the ConvertFromBaseTen() and ConvertToBaseTen() for the ConvertBinaryToHex() and
ConvertHexToBinary() methods. Then, you can use all these methods for the button methods.

Part 2: Bitwise Operations

2. Get P-th Bit
Write a program that prints the bit at position p of given integer. We use the standard counting: from right to left,
starting from position 0.

Input
You will receive input on two lines:
• On the first line you will receive the number n that you need to convert to binary.
• On the second line you will receive the position p.

Output
You should print the converted number in binary.

© SoftUni Buditel – https://buditel.softuni.bg. Copyrighted document. Unauthorized copy, reproduction or use is not permitted.
 Private High School for Digital Sciences “SoftUni BUDITEL”

Examples
Input Output Comments
2145 1 0000100001100001 → 1
5
512 0 0000001000000000 → 0
0
111 0 0000000001101111 → 0
8
255 1 0000000011111111 → 1
7

Hints
1. Declare three variables (n, p and bitAtPositionP).
2. Read the user input from the console.
3. Find the value of the bit at position p:
a. Shift the number p times to the right (where p is the position) by using the >> operator. In that way
the bit we want to check will be at position 0.
b. Find the bit at position 0. Use & 1 operator expression to extract the value of a bit. By using the
following formula (bitAtPositionP & 1) you check whether the bit at position 0 is equal to 1 or not. If
the bit is equal to 1 the result is 1 if the bit is not equal – the result is 0.
c. Save the result in bitAtPosition1.
4. Print the result on the console.

3. Clear Bit
Write a program that sets the bit at position p to 0. Print the resulting integer.

Input
• On the first line you will receive n – the number you need to convert binary.
• On the second line you will receive the position p.

Output
Print the result integer (the converted binary number).

Examples
Input Output Comments
1313 1281 010100100001 → 010100000001
5
231 227 000011100111 → 000011100011
2
111 47 000001101111 → 000000101111
6
111 111 000001101111 → 000001101111
4

Hints
1. Declare four variables (n, p, mask, and result).
2. Read the user input from the console.

© SoftUni Buditel – https://buditel.softuni.bg. Copyrighted document. Unauthorized copy, reproduction or use is not permitted.
 Private High School for Digital Sciences “SoftUni BUDITEL”

a. Shift the number 1, p times to the left (where p is the position) by using the << operator. In that way
the bit we want to delete will be at position p. Save the resulting value in mask.
b. Invert the mask (e.g., we move the number 1, 3 times and we get 00001000, after inverting we get
11110111).
c. Use & mask operator expression to set the value of a number to 0. By using the following formulae
(n & mask) you copy all the bits of the number and you set the bit at position p to 0;
d. Save the result in result.
3. Print the result on the console.

4. Set Bit
Write a program that sets the bit at position p to 1. Print the resulting integer.

Input
• On the first line you will receive a number n that you need to convert to binary.
• On the second line you will receive the position p.

Output
Print the result integer (the converted binary number).

Examples
Input Output Comments
1313 1441 010100100001 → 010110100001
7
231 247 000011100111 → 000011100111
4
111 2159 000001101111 → 100001101111
11
111 111 000001101111 → 000001101111
0

Hints
1. Declare four variables (n, p, mask, and result).
2. Read the user input from the console.
a. Shift the number 1, p times to the left (where p is the position) by using the << operator. In that way
the bit we want to delete will be at position p. Save the resulting value in mask.
b. Use | mask operator expression to set the value of a number to 1. By using the following formulae
(n | mask) you copy all the bits of the number and you set the bit at position p to 1;
c. Save the result in result.
3. Print the result on the console.

Part 3: Graphics
5. Canvas Drawer
You are given a WinForms application for drawing different geometric figures on the screen:

© SoftUni Buditel – https://buditel.softuni.bg. Copyrighted document. Unauthorized copy, reproduction or use is not permitted.
 Private High School for Digital Sciences “SoftUni BUDITEL”

Your task for this exercise is to implement the missing methods from the DrawingCanvas class:

© SoftUni Buditel – https://buditel.softuni.bg. Copyrighted document. Unauthorized copy, reproduction or use is not permitted.
 Private High School for Digital Sciences “SoftUni BUDITEL”

The class itself holds a matrix of unsigned integers representing the pixels on the screen. The rows are the pixels as
they are, but the columns are whole integers where each integer has 32 bits, each bit representing a pixel (i.e., for
8 integers that’s 256 pixels).
Using the practice from the previous tasks you should be able to finish these methods.
You are given a helping hand such as a finished constructor, a CheckBounds() method, and some properties you
will need to use in the unimplemented methods.

Warning: Don’t modify the Clone() method in the class! It is used for the [Undo] button in the app!
Don't modify any other class you are provided with! (DrawerForm.cs, FigureType.cs,
CanvasColor.cs, Program.cs). You should only make changes in the DrawingCanvas class!

After the exercise you can still check the code in the DrawerForm.cs if you are curious how the app
works.

With all that said let's get to coding:

Implement Utility Methods

FillAllPixels(CanvasColor Color) Method
The first method we will implement is the FillAllPixels() method. The method takes in a color to fill the
matrix initially with:

© SoftUni Buditel – https://buditel.softuni.bg. Copyrighted document. Unauthorized copy, reproduction or use is not permitted.
 Private High School for Digital Sciences “SoftUni BUDITEL”

Well, this is easy. We loop through the matrix with a double for and set each row, col to the color… But wait our
matrix is from integers, right? Then how do we put a color inside? This is where our knowledge of bitwise
operations comes in.
Recall masking. If we think numerically the color white is just 255, analogically black is 0. With that knowledge we
will initialize a mask variable to 0 -> that is if the color we need is black. If not, we will use bitwise not to inverse
the mask and use that instead:

Now we call loop and fill it with the mask:

That is all we need to for this method.

InvertAllPixels() Method
This is a bit easier method. All we're doing is we invert each matrix element with bitwise not (~):

With this all our utility methods are implemented!

Pixel Methods
GetPixel(int Row, Int Col) Method
Now for the GetPixel() method. It takes a row and column to get the pixel from:

© SoftUni Buditel – https://buditel.softuni.bg. Copyrighted document. Unauthorized copy, reproduction or use is not permitted.
 Private High School for Digital Sciences “SoftUni BUDITEL”

Remember that our columns do not correspond to pixels so retrieval will be different. Here are the steps:
1. Check your matrix bounds using the CheckBounds() method.
2. Get the target row from the matrix by using the row variable.
3. Get the target column by dividing the column by 32. (Each int has 32 bits).
4. Get the target int by using the newly calculated target row / column.
5. Similarly get the bit index by using column modulus 32.
6. Using the get bit formula retrieve the needed bit.
7. Cast the bit to CanvasColor and return.

SetPixel(int Row, Int Col, CanvasColor Color) Method

SetPixel() method. It takes a row and column and a color to set to the matrix:

Our steps are similar to the previous method:

1. Check your matrix bounds.
2. Get the target row from the matrix by using the row variable.
3. Get the target column by dividing the column by 32. (Each int has 32 bits).
4. Get the target int by using the newly calculated target row / column.
5. Similarly get the bit index by using column modulus 32.
6. Using the clear bit formula clear the target bit in the target int.
7. Using the set bit formula set the color to the target bit.
8. Save the modified int back to the matrix.
Done! Not so bad right?

Drawing Methods
These methods are pretty trivial now that we have the SetPixel() method.

© SoftUni Buditel – https://buditel.softuni.bg. Copyrighted document. Unauthorized copy, reproduction or use is not permitted.
 Private High School for Digital Sciences “SoftUni BUDITEL”

Horizontal / vertical lines are as simple as looping and calling the SetPixel() method.
Rectangles simplified are just different horizontal / vertical lines. So, use those methods to draw the figures.

6. Colored Canvas Drawer

You are given a WinForms application for drawing different colored geometric figures on the screen.
The DrawingCanvas class you implemented earlier is mostly here untouched with the exception that some
methods need a new implementation:

This time the class holds a matrix of bytes representing the pixels on the screen. The rows are pixels as they are,
but the columns are multiplied by 3. Each triplet of bytes represents RGB values.

Warning: Again, don’t modify the Clone() method in the class! It is used for the [Undo] button in
the app! Don't modify any other class you are provided with! (DrawerForm.cs, FigureType.cs,

© SoftUni Buditel – https://buditel.softuni.bg. Copyrighted document. Unauthorized copy, reproduction or use is not permitted.
 Private High School for Digital Sciences “SoftUni BUDITEL”

CanvasColor.cs, ColorExtenstions.cs, Program.cs). You should only make changes in the

DrawingCanvas class!

After the exercise you can still check the code in the DrawerForm.cs if you are curious how the app
works.

With all that said let's get to coding.

Pixel Methods
GetPixel(int Row, Int Col) Method
The GetPixel() method. It takes a row and column to get the pixel from.
This is simpler than our previous implementation:
1. Check your matrix bounds using the CheckBounds() method.
2. Get the pixel offset by multiplying col by 3.
3. Take red by row and offset.
4. Take green by row and offset + 1.
8. Take blue by row and offset + 2.
9. Return a Color.FromArgb() with the RGB values.

SetPixel(int Row, Int Col, CanvasColor Color) Method

Yet again SetPixel() method is simpler. It takes a row and column and a color to set to the matrix.
The steps are as follows:
1. Check your matrix bounds.
2. Get the pixel offset by multiplying col by 3.
3. Set the colors red value with row and offset.
4. Set the colors green value with row and offset + 1.
5. Set the colors blue value with row and offset + 2.
Done! Not so bad right?

7. * Bresenham's Line Algorithm

You may have noticed we have a couple of new methods:

© SoftUni Buditel – https://buditel.softuni.bg. Copyrighted document. Unauthorized copy, reproduction or use is not permitted.
 Private High School for Digital Sciences “SoftUni BUDITEL”

The DrawTriangle() method is just a new figure. Implement it as the others this time calling a diagonal line too
to connect the triangle.
Now how do we draw diagonal lines? Well, we need to implement the Bresenham's Line Algorithm. It is an
algorithm for drawing any lines, but we will use it for diagonal lines.
Here is the pseudo code which you will need to implement the methods:

plotLineLow(x0, y0, x1, y1)

dx = x1 - x0
dy = y1 - y0
yi = 1
if dy < 0
yi = -1
dy = -dy
end if
D = (2 * dy) - dx
y = y0

for x from x0 to x1
plot(x, y)
if D > 0
y = y + yi
D = D + (2 * (dy - dx))
else
D = D + 2*dy
end if
plotLineHigh(x0, y0, x1, y1)
dx = x1 - x0
dy = y1 - y0
xi = 1
if dx < 0
xi = -1
dx = -dx
end if
D = (2 * dx) - dy
x = x0

© SoftUni Buditel – https://buditel.softuni.bg. Copyrighted document. Unauthorized copy, reproduction or use is not permitted.
 Private High School for Digital Sciences “SoftUni BUDITEL”

for y from y0 to y1
plot(x, y)
if D > 0
x = x + xi
D = D + (2 * (dx - dy))
else
D = D + 2*dx
end if
plotLine(x0, y0, x1, y1) // This is the DrawDiagonalLine() method
if abs(y1 - y0) < abs(x1 - x0)
if x0 > x1
plotLineLow(x1, y1, x0, y0)
else
plotLineLow(x0, y0, x1, y1)
end if
else
if y0 > y1
plotLineHigh(x1, y1, x0, y0)
else
plotLineHigh(x0, y0, x1, y1)
end if
end if

8. File Canvas Drawer

You are given a WinForms application for drawing different geometric figures on the screen and the ability to save
your progress.
The DrawingCanvas class you implemented earlier is here mostly untouched. The constructor has been modified
to support an existing array as an argument.
Some new methods need an implementation:

These methods will be used to create our own bin format that will work only with the DrawingCanvas class.

Warning: Again, don’t modify the Clone() method in the class! It is used for the [Undo] button in
the app! Don't modify any other class you are provided with! (DrawerForm.cs, FigureType.cs,
CanvasColor.cs, ColorExtenstions.cs, Program.cs). You should only make changes in the
DrawingCanvas class!

After the exercise you can still check the code in the DrawerForm.cs if you are curious how the app
works.

With all that said let's get to coding.

© SoftUni Buditel – https://buditel.softuni.bg. Copyrighted document. Unauthorized copy, reproduction or use is not permitted.
 Private High School for Digital Sciences “SoftUni BUDITEL”

File Methods
SaveCanvasToFile(string Path) Method
The SaveCanvasToFile() method. It takes a path for where to save the file to.
The method works by first creating a byte array. The first 8 bytes are for the height and width.
It then fills the rest of the array with the pixels from the canvas and finally saves the file:
1. Get the bytes of the height with the BitConverter class.
2. Get the bytes of the width with the BitConverter class.
3. Create a byte array with widthBytes length + heightBytes length + width + height.
4. Using loops save the according bytes to the array.
5. Using FileStream write the file to the system.

LoadCanvasFromFile(string Path) Method

The LoadCanvasFromFile() method. It takes a path for where to load a canvas file from.
The method works by first reading the file at path, then creating a byte array filling it with the bytes from the file.
It then returns new instance of DrawingCanvas:
1. Load the bytes from the file.

© SoftUni Buditel – https://buditel.softuni.bg. Copyrighted document. Unauthorized copy, reproduction or use is not permitted.
 Private High School for Digital Sciences “SoftUni BUDITEL”

2. Get the height with the BitConverter class.

3. Get the width with the BitConverter class.
4. Create a byte array with heightBytes as rows.
5. Using loops create a widthBytes size array and write the according bytes to the array.
6. Return a new DrawingCanvas instance.

© SoftUni Buditel – https://buditel.softuni.bg. Copyrighted document. Unauthorized copy, reproduction or use is not permitted.