Hello and welcome back. Our app's now looking pretty good with circles and crosses and our ability to drop them in. And the next task in the app itself will be to determine if anyone either circles or crosses have gotten three in a row and won the game. And this requires us to track the slots and their state at any given point, for example, what is in this slot?

This first slot right here, is it empty? Does it have a cross in there? Does it have a circle? And then later on after we have successfully done that, what are the combinations of slots that result in three being in a row that results in a win? But that will do later. First, let's figure out how to track what's in this slot. We're going to start off with this one, this first one you see there are 1, 2, 3, 4, 5, 6, 7, 8, 9 slots total, and we can number them by using tags. So, this slot could be 0, 1, 2, 3, 4, 5, 6, 7, 8, so zero through eight. You may be asking why zero and not one. Well, in computer science, usually with most programming languages, you're going to end up with indexing like this at zero, all right? So, zero through eight. 

So, how do you track multiple numbers or objects like this in one data structure in programming? Well, we can use compound data structures, okay? They're also known as collections, and the one that we'll be using is called an array or a list. So, let's jump into our playground and explore this more. Here we go, so, on top here in the comments, I have listed out how I'm going to track each of the three scenarios. So, a zero will indicate that there is a cross, a one will indicate that it's a circle, and a two will indicate that it's empty. So, you can create a data structure or an array like this, this is a list of integers. So, I'll say val gameState equals and then paste that in, okay? So, I have list of and then open parentheses and then nine twos', okay? 

So, nine empty slots, that's what I'm trying to represent here. So, if I print this out, print line, gameState and run it, that is what an array looks like. You have opening square bracket, then you have all of the individual elements of that array listed one after the other followed by a comma. And I created this array by using listOf. Now here, I have another way of creating a list and this one is mutable listOf, which means I can actually change the values within my array, all right? So, if I had used this command C, paste this in here, command V, you see this is called mutableListOf, and then I just put in some random zeros and ones. 

And if I run this, check it out, I have the same array like structure with opening square brackets, closing square brackets, and zeros, ones, and twos in there, all right? There's another way of creating the same thing right here, arrayListOf and I can change that as well. The only difference between this is that in the first case, listOf you cannot change any of the elements if you use listOf. So, any of the tools, I'm able to change it to anything. So, for our purposes to track gameState, we can use either mutableListOf or arrayListOf. And these were integers, you could also have a list of strings right here. The only thing to remember is when you do have an array or a list like this, you are going to be including the same data types within your list, okay? 

So, this one is an integer list, you can only have integers in it. If you try to put a string in here, it'll give you an error. Same with this one, same with this one. This is list of strings, so if I try to put in an integer over here, I would get an error. You could also have other types in here, you could have objects, methods, you could have other lists within the list, but again, the type has to be the same, all right. So, let's explore this mutable list, but I'll create it using all nine tools to simulate, so that I have a game that has not been played, all right? So, check it out. Now, the interesting thing about lists is that if I run this, I'll explain it better right here, lists are indexed so each one of these slots, you see these nine slots, each one are indexed and are numbered. 

So, you can access this first index is zero, the second index is 1, 2, 3, 4, 5, all the way up to eight. So, you see how nicely that fits into our app right here. If I use 0, 1, 2, 3, 4, 5, 6, 7, 8, that means this one, index zero can correspond to this one index 0, all right? Then this one, index one, can correspond to this one, index 1, index 2, index 2 right here. Actually, sorry, I've been referring to these as indices, they are actually the tags for each of the slots. And ending with this one being tag eight, and that would represent this one right here in our array, all right? And then you can also see what's in any of the slots at any point by simply indicating the index. 

So, first you will have the name of your array and then open and close square brackets, and within it indicate which index you want to see, so let's say 0, 1, 2, we want to see what's in Index 3. This one is easy because all of them are two, but if I try to print this and run it, check it out, it tells me what's in that slot, all right? So, if I changed this to one, and then run it, check it out, it shows me that it's one, okay? Now, how do I do that programmatically? How do I set the value for any of the elements in my list? How do I do that? Well, I can do it by referencing the name first, and then indicating which index I'm talking about, so three in our case, and then I'll set it to one. 

This will take the index 3, which is this one right here, and change it to one. And then if I print that index, it's going to give me one. There you go. And remember one thing that's important is we're only able to do this because we're using mutable list, we're not using ListOf because ListOf is immutable, which means I could not reassign anything once it was created, all right. So, let's put this in action right here. You see we have zero, let's say it's a circle, how do we do that? Well, when it's tapped, what we'll do is we will take the tag of this in our app, so the tag for this first slot will be zero. So, we will set gameState zero, the zero at slot and we'll set it to circle is represented by a one, so we'll set it to one. And if we then print our gameState, the entire gameState array, we can see that the rest of the slots are empty, but the first slot has a circle in it, okay? And similarly, we can do it for all of the other slots. 

So, if you look at something like this, 0, 1, 1, 2, 0, 1, 0, 0, 1, that would look something like this. The first one would be a cross, so write here cross, then a circle right here, then another circle, and then two would be empty, I don't have a way of representing empty. So, imagine this X is an empty, and then zero, so this one is a cross, there we go. This one's a cross, then one, so this is a circle, then a cross, the last one is a circle and then a cross right here. So, this would look like something like this without this one right here which should have been empty, all right? So, that's a basic look at how we can use arrays in our app and keep track of our gameState, and we'll leave it at that in this video. However, there are a lot more to arrays and they are a very powerful data structure. So, in the next video, we'll take a look at a few more interesting things that we can do with arrays before moving back to our app. See you there.