 Hello, welcome to another lecture in the course on computer programming. I am Dr. Abhiram Ranade and I am a guest lecturer today. Our session is titled Graphics Objects in Arrays and Structures. So, here is a quick recap. In the last session, we studied the graphics facilities in simple CPP. In this session, we will study how to use graphics objects in arrays and structures. We will also study a fun application. The reference for this material will be chapters 5 and 20 of the book, An Introduction to Programming through C++ written by me and published recently by McGraw-Hill Education. You can make arrays of graphics objects in the usual manner. For example, if you write a rectangle R 10, you will get an array R of 10 rectangles. This statement will create 10 rectangles, but they will be all degenerate in the sense that their heights, widths and position will be some unspecified number, typically 0. This is because when the array is constructed, it will be constructed using the default constructor. Yes, indeed, graphics classes do have default constructors. To give these arrays the position and height, width, etc., that you really want, you have to reset them. For example, you may write R 5 dot reset and pass the arguments 100, 100, 50, 70. In a similar manner, you can reset other graphics objects. For example, if you draw, if you want arrays of circles, you can do things exactly in this manner. You can also create graphics objects in the heap and this also happens in a natural manner. For example, if you write rectangle star RPTR equal to new rectangle 100, 150, 70, you know that this will create, first of all, this will define a name RPTR of type rectangle pointer and it will allocate space for the rectangle on the heap because of the operator new. You also know that in this form that we are calling, the rectangle will be constructed by an appropriate constructor which takes 100, 150, 70 as the arguments. Graphics objects can also be included in structures. For example, if you want, you may create a struct button which contains a rectangle which gives the border of the button and a text label which puts the text on that rectangle. This will create a struct and when you make an instance of it, it will create border and label but these will again be created using the default constructors. To give them the correct values, you will have to make a reset call. Now, I am going to use some of the ideas we have learned today and in the previous sessions on graphics to put together an interesting application. We will create, we will write a program which will produce a puzzle, a puzzle which you have to solve. The puzzle contains a 4 by 4 board and on the board are placed 15 tiles with numbers 1 through 15. Each tile is a single square. So, 15 of the squares are occupied and 1 square is empty. The tiles are placed randomly at the beginning. The goal is to arrange the tiles in order, top to bottom, left to right, so that it looks as shown. So, the first row contains 1, 2, 3, 4, next row contains 5, 6, 7, 8 and so on in the order specified and the blank has to come all the way in the last row and in the last column. How are you allowed to do this? Well, if a tile is adjacent to an empty position, it can be slid into the empty position. So, this is how you are allowed to move the tiles. Let me warn you that getting the required order is not always possible and I will have a remark about this in a minute. So, let me say something about the program that we are going to write. For example, we might say that a tile really consists of a rectangle and a text giving the number, the number that is on the tile. So, we will create a struct for this. The board will be a 2-dimensional array of type slot and we will give the name slots to it. Slots of ij will hold a pointer to the rectangle which is occupying that slot and also a pointer to the text inside that rectangle. We will initialize the board in a random manner. When the user clicks, we check if the clicked slot is next to the empty slot. If so, the rectangle, the text, the rectangle and the text in the clicked slot is moved into the empty slot and we keep on doing this. So, here is a part of our program. As I said, we will create a struct slot which will contain a rectangle and a text. But we are going to place pointers to the rectangle and to the text rather than the rectangle and the text themselves. When we go to the main program, next we come to the main program. We start by creating the canvas. So, the canvas has the title 13, 15, 14 puzzle and the width and height is going to be 600. The board will be a rectangle of height 402 by and width 402 placed at 300, 300 as its center. Ideally, I should not use numbers over here, but I should give the numbers names so that the functions, so that the program gets better documented. Then we will have an array slots of four rows and four columns. Slot ij tells you what is in row i and column j of the board. So, the width of the tiles is going to be 96. So, in this manner, I should really have given names to all these constants also. So, sorry about that, but when you write a program, you indeed should give names to all constants and not use constants like I have done here. The initial contents of the board are going to be these in top to bottom left to right order. So, the first part of the program is to set up everything. So, we are going to populate our board. So, all the slots are going to be populated. Row 3 and column 3 will remain empty and therefore, we are not going to place anything inside it. And all, so for everything else, we will be placing a new rectangle. So, dot r as you can see over here gives a pointer to the rectangle which is to be in the slot. So, in slot ij, dot r, we will create, we will place a new rectangle. These positions have been created so that the created rectangle is has will have this center and the width will be 96 as I have stated above. And similarly, we will create a label for that rectangle as well. The label will be initialized to the value given in this array initial. As I said row 3 and column 3 will be empty. So, empty x and empty y will be used to denote this that is empty x and empty y will give the column position and the row column index and the row index of the empty slot in the slots array. So, this is the last part, the main part of the program. We are going to allow the user to make 100 moves. This of course is completely arbitrary, you can change it. And you could indeed put in let this go on ad infinitum by putting in a while loop if you wish. The first step is to get the user to click. The user clicks somewhere and we get the integer click pass denoting the x and y positions of the click. So, click pass divided by 65536 will give you the x coordinate of the click position. But we do not really want the x coordinate. We want the index of the rectangle in which the clicking is happening. So, we do a little bit of arithmetic to get that index and that is how we get click x. Then similarly we get click y. This 100 stands for the offset of the board from the left side. This 100 stands for the offset of the board from the top and this 100 stands for the space allocated to each click. Remember the rectangle is being drawn of width 96 and not 100 because we want some space to be there between the different rectangles. Next, we are going to check if the click positions, the click indices of the click position are adjacent to the indices of the empty positions. Click x minus empty x absolute value plus absolute value of click y minus empty y should be 1 because either the empty position should be adjacent in the x direction or in the y direction and only one of these. Therefore, if this sum is 1, then we know that the clicked position is next to the empty position in which case we have to move the tile from the click position into the empty position. So, slots of click x click y dot r that is the rectangle that is pointed in the click position is moved to the empty position. Slot of click x click y dot label is moved to this position to the empty position. This is the calculation of where the rectangle has to be moved and where the label has to be moved. So, we only need the centers of the positions where the label and the rectangle are moved and finally, we have to update the board. So, the empty position now becomes filled with what was there in the click position. So, the r component is updated the label component is updated. This by the way is actually physically moving the graphics objects. So, we need to move the graphics objects physically as well as we need to populate our slots board appropriately. Finally, we have to record that the empty position has changed. So, the empty position x coordinate has now become the click position x coordinate and the empty position y coordinate has now become the click position y coordinate. So, that is it that is the program. So, we are now going to compile this program and run it and play our game. So, here we have our board with our tiles inside it. So, if I may remind you our goal is to get 1, 2, 3, 4 positioned over here. So, let us see how that can be done. So, for that we need to get our blank in this position and then we can move one over here. So, how can we do this? Well, I can click on this. So, the blank moves there click click click click click and then one has moved to the correct position. Now, I want to move 2 over here. So, let me move let me get the blank near it. So, suppose I do this I do this I do this 2 is a little bit closer. So, let me take it even closer. So, let me get the blank to the right position. So, 2 is now even a bit closer. So, in this manner you can keep playing and you can get you can try to get all the tiles in their correct position. So, let me make some comments about this puzzle. It turns out that this is a fairly celebrated puzzle. It was invented in the 19th century and it has some interesting mathematical structure. In fact, you can prove the following theorem about it. From an arbitrary initial position you can reach one of the following positions, but not both. So, the position on the left is what we indicated was desirable earlier in the lecture. The position on the right however is more or less the same except you may notice that here the order is wrong. It should be 13, 14, 15, but the order is 13, 15, 14. So, the theorem says that from an arbitrary position you can get to this position or you can get to this position, but not to both. Or in other words if you are starting with this position there is no way you can get to this position. How to prove that this is impossible is outside the scope of this course, but you should be able to get information about this on the internet. So, that concludes this lecture and let me make some remarks. The main goals of the lecture were study how to create arrays structures, arrays and structures of graphics objects. I should point out that nothing really new was stated. Graphics objects are objects like other objects and what we did is really what we have been doing or what you have been doing for creating arrays of objects or structures of objects. So, this is just to assure you reassure you that graphics objects are not really some strange animal, but they are just they are just objects they just happen to have an image on the screen. Then we did a fun example of graphics and I should point out that arrays of graphics will be arrays of graphics objects will be needed if you want lots of graphics objects on the screen. For example, you may be writing a program to simulate the movement of gas molecules bouncing around in a chamber. Perhaps you have studied kinetic theory of gases where you have gas molecules bouncing and you may want to know well let us see what a gas looks like and if you want to do that you will need arrays of molecules maybe you will represent molecules by circles and then you will move them around. I should also know that chapter 20 of the book gives an example of a snake game that uses arrays of graphics objects. And finally, I should point out that point out and hope that the example in this lecture and the snake example and the other examples that we have covered should have convinced you or should have persuaded you that using graphics you can do lots of interesting programming projects and I hope you will have been inspired to do all that. This concludes the lecture series on graphics. I hope you have enjoyed it and I am thankful to you for giving me a patient hearing.