Python/Pygame Checkers Tutorial (Part 2) - Pieces and Movement

[Music] okay so now we have peace and if we want to see them well we need to start creating some pieces so inside of my board class under create board i'm going to create a bunch of pieces we're going to start obviously by making the white pieces will be at the top and then the red pieces at the bottom so this is not too complicated but it is a little bit of a for loop kind of in indentation thing that you'll see here because we need to obviously have them be spread out we're only going to have i believe four in each row and then they need to be staggering and then the white needs to go up there there needs to be a space and then it needs to be the black or the red sorry the white and then the red my bad all right so four row in range rows for call in range calls we can import calls up here technically again i mean i can change this here to be calls doesn't matter because they are the same value but say we had a checkerboard that wasn't exactly square then these would matter so four range or four row in range rows four call in range calls what we're going to do is we're going to start by saying self self dot board dot append and empty list the reason for this is because we want to have interior lists for each row right so we want to have a list that represent what each row is going to have inside of it and we'll just do that by appending one for each row that we have next what we're going to say is if call mod 2 equals equals a little bit of fancy math here row plus 1 mod 2 what this is saying essentially is if the current column that we are on modulus two so if it's divisible by two if that equals whatever the row plus one so say we're on row zero technically we're on row one mod two then what we can actually do is we can draw the red or white cube now if we look at the checkerboard i'll kind of explain to you how this works by going through a few examples so on when row is i'm trying to be able to view the code at the same time so when geez bring back my pi game uh we've got two of them open let's close one okay there we go so let's say row is zero we're on the first row then the uh row plus one mod two is going to be equal to one right so that here that i can't highlight unless it will put away this is equal to one and then call so if we're on column zero in this case call mod two will not be equal to that so that'll be this first square here this red one so we won't draw the checker all right i think that's why you call it like a checker piece i guess and then the next cube over right so the row stays the same but the column now is column one mod two so that's equal to it so we draw white all right move next now it's column two so we're not drawing that next we go column three we will be drawing that so on so forth now you increment the row when you increment the row what happens is row plus one so one plus one is two mod two is equal to zero which means we'll only draw on the even columns right and then the next one will draw on the odd columns so that's kind of how this is going to work and that's like the basis behind this math that i'm explaining okay so in this case we can draw so if this happens we can draw something but we only want to draw when we're in a certain row so we have to say if row is less than 3 because 0 1 2 are the first three rows that we want to draw the white pieces in then what we will do is we'll say and we're not actually drawing here we're just creating the pieces but same promise we'll say dot board row dot append and we'll create a piece and what will what will we do here we'll say row column and then the color we're going to put here is going to be white so i think i imported white i did not so first of all let's import calls properly and now let's import white okay so black row red square size calls white great and then we can append white in there l if row is um i guess we'll say less than should be five six seven is where so if we say if rho is less than four then we'll simply continue uh actually let's just do this if row is greater than four so if row is five six or seven then we can say self.board row dot append piece row call red so hopefully this makes sense uh and we need to import piece which we'll do in a second but the idea being that we're just creating this board we're gonna do it with the checkerboard pattern and then obviously we're not going to do anything in the rows that are three or four what am i saying three or four yeah in rows three or four we are not going to add any pieces now when we don't add a piece though what i want to do is i actually want to add a zero instead so i'm going to say else and in this case we're going to say self.board row dot append 0. the reason for this is that's just going to be like our blank piece like we'll have zero white zero white zero white so we can keep track of by looking at the board what row and column each piece is in by having these kind of blank separators next we're going to say else self dot board row dot append zero so essentially if we don't add a piece we are going to add a zero so that we can separate the pieces and be able to look at this list and figure out where the pieces are now we need to import piece so let's say from dot piece import piece like that okay so that should be good that should create the board for us now what i want to do just to make sure this is working is actually draw the board so i'm going to make a new method here called draw and what this is going to do is say self win and this will draw all of the pieces and the squares so this is going to say self.drawsquares so we'll draw the squares on the window and then we'll loop through all the pieces and draw those so let's say 4 row in oops range if we can do this here for row in range all capital rows and then we'll say for call and range all capital calls what we'll do is loop through the board so we'll say piece equals self dot board row column like that we'll say if piece does not equal zero because if the piece is zero obviously we're not going to draw anything right so if the piece does not equal zero then piece dot draw on the window so i think that should be good let's test this so i'm going to go to main now and rather than board.draw squares i'm just going to call board.draw and let's just make a quick test here and see if we crash invalid syntax where is the invalid syntax okay so i don't know what arrow is having but i managed to fix it i think it was because i was actually in the python console accidentally but anyways when i'm running this i'm getting an error now that says list index out of range now the reason for that is that we have this create board method but we haven't called it so i haven't actually created a board so we have this draw that's trying to loop through all these rows and columns yet they don't exist in the board so let's actually fix that by saying self dot create board inside of our init so that right when this object gets created we automatically create the board let's try this now and pie game is not defined okay so i guess i didn't import pie game inside of some place here that would be inside a piece so let's say import pie game like that inside of our piece module file whatever you want to call it okay now we can run it and there we go we can see our red and white pieces and they look to be working fine now i'm not a fan of how big these are so i'm going to make them a little bit smaller we can do that really easily by just changing our padding right so if i change the padding to 15 and run this file now we can see they move down a little bit and you guys can experiment those make those bigger smaller whatever you like okay so i think that is good for right now next what we're going to do is we are going to actually work i guess on a bit of the logic of the game so we have now the ability to draw these things we can see everything now we need to actually move them figure out the valid moves for each piece as well as we need to figure out what happens if one of these pieces is a king so first thing i'm going to do actually is start working on how we can draw the crown for a king piece we'll test that out and then we'll get into the logic so to make a king first what we're going to need to do is we're actually i need to download an asset for a little crown that we will draw on our piece if it is a king piece so let me see if i can bring this up for you i have an image of it i'm going to pop it over here you can see this is what the crown looks like it's a transparent background so go to the link in the description it will say like download asset here or something you're going to download a compressed zip folder what you need to do is right click on that compressed zip folder press uncompress or unzip here so just make it so that you don't have that like zipped up folder anymore it's an unzipped folder and then take that unzipped folder it should be called assets and just put it inside of this directory right here so inside of this checkers directory so it's going to go inside of the checkers directory not like inside of the root directory although you could put it inside the root directory but we're just going to put it inside of this checkers directory so let me actually do that i need to grab that folder so i'm just going to look for it on my system so i have assets right here i'm going to copy that and i'll put that into my checkers folder like that so now we have the assets and is this inside of the right one yes it is now we should be able to load it so what i'm going to do is inside of constants.pi i'm actually going to load that image so i'm simply going to say crown equals pygame dot image dot load and i'm gonna load assets slash crown dot and in this case i think it is png okay so we'll go crown dot png now what i need to do actually is i need to resize this so it's actually too big by default we need to make it small enough that it will fit on the actual check checkers pieces so to do that we're just going to use a method from pi game i just have to find it because i forget exactly what it is we're going to say pie game dot transform i think is it pie game dot transform or pie game dot image no and it's pie game dot transform dot scale and what we do is we put the image first and then we put the resolution that we want to scale it to so i've just kind of hard coded these numbers in you could do this mathematically i guess but i'm going to go with 45 and 25 this relatively keeps the aspect ratio of this image and it makes it small enough that we can actually put it on the direct center of all of our pieces and we can tell them hey you know this is a king piece so i'm going to make this sorry capital again don't know why i made that lowercase and now let's go to piece and from constants import red white square size gray and crown inside of the draw we're going to add a really basic if uh the piece is king so if self.king then what we will do is we'll say win dot blitz the crown blitz simply means put some image onto the screen or put some surface onto the screen that's what it's saying these are just special pie game methods to draw directly onto the display whereas this one where you know just blitting the image and then we need to pick our xy position that we want to put this on now i want this to be perfectly centered so i'm going to use a little bit of math here to do this what we're going to say is self dot x minus crown dot get underscore with get underscore width is going to get the width of the image now we already know what the width of the image is but what i'm trying to say here is that let me actually just go to a kind of drawing whiteboard so i can show you what i mean if we have a square okay got it come on let me draw why can't i draw okay so apparently uh windows or microsoft ink just doesn't work so i can't draw the thing for you right now i don't know the solution to that what i'm trying to say is imagine that the x and y position you'd have to imagine the x and y position we have is in the middle of the square so let me just load the other game and at least i can maybe show this to you so the xy position is right in the middle so where my mouse is now we want to draw the crown right in the middle so it's perfectly centered but if i just draw at the x y it's going to move the crown it'll be kind of to the right because the x y is the top left of an image when we're drawing it other than a circle right where we have the radius so i can't just draw it at the x y i need to draw it someplace to the left and up a bit such that it will be perfectly equal distance from this left side and the right side of the circle so all i have to do is get the width of the image and subtract half of that to figure out where the starting x position should be because that will say okay from this point if this is the center we just move half of the image's width to the left and that will mean that it's being drawn perfectly center in the cube or on the circle same thing with the y position we can do that as well to make sure it happens perfectly in the center so that's what we'll do we'll say self.x minus crown.get underscore with integer division two just so we don't have any rounding errors then we'll say self.y minus crown dot get underscore height over over two great so that should draw the crown for us in the middle so what i'll do is just set all of these crowns to be true just so we can make sure that this is working and test it out uh pygame.transform has no attribute scale well it would help if i spelt scale correctly so scale there we go all right let's check check this now cannot load assets slash crown dot png okay so let's try to fix this um i believe the issue we're having is something to do with kind of the path system in python so what i'm going to do is just take this folder and put it outside so put it in the main root directory rather than inside of the checkers directly directory and now it should probably load so let's try this now and there we go that is working just to reemphasize what was happening there this i had assets crown.png i had that folder inside of this checkers folder i specifically told you to put it there but i was wrong so what we need to do is take it out and just put it alongside the checkers directory so it's in that root directory because when we run this main.pi file that's not inside of the checkers folder the path that python will look at to load images will be in this directory where we loaded main.pi so i would have to say checkers slash assets slash if i wanted to load the image the way that we were doing it before without moving this folder anyways not a huge deal but hopefully that's loading for us and i think that this is working fine we can see the crown on all of the pieces again perfectly in the center alright so let's go back and remove that now so peace we no longer want to draw the crown so we will say false and now i gotta figure out what we are going to do next so i'm thinking probably what we should do next is actually set up a way to move pieces around and delete pieces so from board what i'm going to do is i'm going to make a move method so i'm going to say define move i'm going to say self and i'm going to say piece so you tell me the piece you want to move and what row and column you want to move it to now what we'll have to do to move the piece is we'll have to delete the piece from where it is and we'll have to change its position so that reminds me that we actually need to go to piece and we need to add a move method as well so define move like this self row call so what will happen when we move a piece well we're going to have to say self dot row equals the new row right because this needs to say updated self.call equals the new call and then self.calc position so remember calc position which is right here simply tells us what the xy position of our piece should be so we have to recalculate that when we change our row and column so we have move now on piece so board what we'll need to do is we'll actually need to first of all move the piece within the list right because we have this list that represents all our pieces and then we'll have to also actually change the piece itself so piece dot move to wherever it's going to go to update on the pieces side all right so what we'll do is we will say self.board and we're going to say peace.row peace.call comma self.board row call equals and we're going to say self.board and we're literally going to copy these just in reverse so i'll talk about how this works but this is a easy way to swap things in python or swap positions in a list so what i'm saying with this line here and i'll zoom out so you guys can read it is essentially that the piece that's in the position piece.row peace.call so the one we want to move and i need to spell piece correctly and then the piece that's in the position that we want to move to we're going to swap their values by simply reversing it like this so this piece here will move to this one here so row call and then the other one will move to this one so they'll essentially swap that's just how this works and this means we don't need to make like a temp variable delete something re-add it in all that that we would usually have to do all right so now that we have that what we'll actually do is we'll say self. actually we don't need itself we'll just say piece dot move row column there we go so if uh or not if but when we move this actual piece we'll just move it row column now i just want to look and make sure i've done this correctly i think we have but there might be some other things that we want to consider here all right so now we've moved the piece this should actually work we'll test this out after but we need to do is make sure that we haven't moved well we don't need to check that we need to make sure if we've moved into a position where we'll become a king we become a king right so if we move and we hit the last row or the first row then whatever our piece is should become a king so what we can simply do is just check if the row column that we moved to is actually a position that should make us a king and if it is then we will make that piece a king and we will also update the variables we have here for the amount of kings that we have so what i'm going to say is if piece dot row or i guess we could actually just say row if row equals equals rows or row equals equals zero what we can do and say self are not self peace dot make not make move make king so this will make that piece a king and then we'll need to update the red or black is it red red or white kings so the reason this works is because if we move into a position that is 0 or 7 for the row that means that we are at the end or the beginning of the board now some of you might be asking well won't this break because we already have pieces in those positions that are the same color right so like the white piece is already in row 0 and the red pieces are already in row 7 or row 8 whatever you want to call it so won't those just become kings well no they won't because they have to move into that position so we're not going to let them move backwards unless they're a king which means that they won't become a king unless they actually move to the other side of the board from where they start at now there will be a situation where a king will move into not its own side and become a king again but that's fine if it's already a king there's no difference in making it a king again right it's not double kinging or anything like that all right so if row equals equals rows or row equals equals zero p stop make king we need to update the red and uh white king so if peace dot color equals equals white then self.whitekings plus equals one else so if it's not white it must be red self.red kings plus equals one okay so that should be it for move what we can do now is check to make sure this is working so what we'll do is just simply put inside of this actually we'll just do it right here say board dot move ah and now we run to our first problem we need a piece right we actually need to pass a piece object like this to this move function or move method so that it can move it so how am i actually going to get a piece well we'll write a method here that says define get underscore piece and we'll say self row call so essentially you give this board object a row and a column and it will give you a piece back so this will simply return dot board row call all right so now let's just say piece equals board dot get piece and let's pass a row and column we know there's going to be a piece in so in this case i believe there's one in 0 1 because i don't think it starts in the top left corner so we'll get a piece at 0 1 and then we'll say board dot move that piece right here and let's move this to i don't know where do we want to move this somewhere where there's not already a piece let's go row 4 column 3. all right so that should move it into the center of the board or relatively into the center of board and what is it saying oh missing one required positional argument column so oops i shouldn't have put these in a tuple i should just have them separated out like this so four three let's run this now and what is the other one piece is not defined well it would help if i spelt piece correctly where is it telling me this is undefined uh it is undefined here looks like yeah piece is spelt wrong okay so let's go back to board let's go to move and let's fix that there we go okay run work and there we go we can see that now that piece here is moved over here so this move method does work now we want to figure out a way that we can do it using our mouse right so this will be a bit more complicated but very doable and the next part of this series here or this video so what i'm going to do is i'm going to make a method that says define get row underscore call from mouse so this will simply take the position of our mouse and it will tell us based on the position of our mouse what row and column we're in so we're going to say x y equals position because this is going to be a tuple that will have the x position of our mouse and the y position of our mouse and then based on the square size we can calculate really easily what row and column we're in so we can simply say well we'll make a bit easier we'll say row equals y integer divided by square size so this is really easy right and we need to import square size but if the square size is 100 and we're trying to figure out what row we're in if our y is at 650 then we know we must be in row six right and if our y is 700 we must be in row seven right it's pretty straightforward so that is how this works that's how we get the row and the column just a little bit of division so we say call xx or divide divided by square size now we'll need to import square size like that and we can return the row column great so get row column from mouse position now what we'll do is when we press the mouse down we will get what row in column we're in we will select that piece and then we will move that piece to wherever we want to move so we'll be able to select the piece and then we can select where we want to move it to so if pygame dot mouse button down then we will say row call equals and first we'll say position equals pi game dot mouse dot get underscore pause this will get the mouse position say row call equals get row call from mouse position then we can get the piece associated with this so we can say piece equals and we can say board dot get piece row column and we can move it now what i'll do right now is just because i don't want to code everything is i will simply just move whatever piece we select to the same position so we'll just move it to four 3 just so you can see that this does work when we press on the piece um but we will obviously make it so that you're moving it where you want to move it afterwards okay so let's just test this out and make sure this works so if i select this piece you can see that all these pieces obviously are going to be hidden by that white piece because that's there but they get moved to that position so when i press them they move there again obviously all of them are moving to the same one so you can't really see but that is how this works

Channel: Tech With Tim

Views: 25,521

Keywords: tech with tim, python, python checkers, checkers python, python checkers tutorial, pygame checkers, checkers pygame, python pygame, pygame, pygame python, pygame tutorial, python pygame tutorial, pygame tutorial for beginners, pygame games, python programming, python tutorial, pygame tutorial python 3

Id: LSYj8GZMjWY

Length: 27min 4sec (1624 seconds)

Published: Wed Sep 09 2020