We won’t miss that out either, so again we’ll go for index checking of 1,5 and 9 and for the opposite diagonal we go for 3,5 and 7.
And that’s it, there is your main game logic.
Yes, it is that simple.
//TODO: check for win logiccheckWin() {if ((gameState[0] != 'empty') && (gameState[0] == gameState[1]) &&(gameState[1] == gameState[2])) {// if any user Win update the message state setState(() { this.
message = '${this.
gameState[0]} wins'; this.
Delay(); });} else if ((gameState[3] != 'empty') && (gameState[3] == gameState[4]) && (gameState[4] == gameState[5])) { setState(() { this.
message = '${this.
gameState[3]} wins'; this.
Delay(); });} else if ((gameState[6] != 'empty') && (gameState[6] == gameState[7]) && (gameState[7] == gameState[8])) { setState(() { this.
message = '${this.
gameState[6]} wins'; this.
Delay(); });} else if ((gameState[0] != 'empty') && (gameState[0] == gameState[3]) && (gameState[3] == gameState[6])) { setState(() { this.
message = '${this.
gameState[0]} wins'; this.
Delay(); });} else if ((gameState[1] != 'empty') && (gameState[1] == gameState[4]) && (gameState[4] == gameState[7])) { setState(() { this.
message = '${this.
gameState[1]} wins'; this.
Delay(); });} else if ((gameState[2] != 'empty') && (gameState[2] == gameState[5]) && (gameState[5] == gameState[8])) { setState(() { this.
message = '${this.
gameState[2]} wins'; this.
Delay(); });} else if ((gameState[0] != 'empty') && (gameState[0] == gameState[4]) && (gameState[4] == gameState[8])) { setState(() { this.
message = '${this.
gameState[0]} wins'; this.
Delay(); });} else if ((gameState[2] != 'empty') && (gameState[2] == gameState[4]) && (gameState[4] == gameState[6])) { setState(() { this.
message = '${this.
gameState[2]} wins'; this.
Delay(); });} else if (!gameState.
contains('empty')) { setState(() { this.
message = 'Game Draw'; this.
Delay(); });}}The UIIn Flutter whenever we want to create something that is boxed or clustered and in a fixed space and size the best option to go for is a Grid Layout.
In this project, we use something called GridView.
builder(), this builder gives us some properties like itemCount and itemBuilder, which helps us to count the total number of elements which will be present in the grid as well as return specific indexes of those contexts which the user taps on.
To see the full UI construction visit here ????S-ayanide/Flutter-TicTacToe UI starts on Line 160 github.
comPhoto by Aaron Burden on UnsplashLast but not the least, Thank you for reading this, Since I’m a beginner and I may make mistakes, feel free to point it out so that I can rectify them along the way.
If you want to see more Flutter projects consider exploring my GitHub account.
Peace Out.
.