Skip to content

Commit b8cd9e3

Browse files
committed
TicTacToe UI update Day6
1 parent 2b4d3b3 commit b8cd9e3

File tree

7 files changed

+347
-302
lines changed

7 files changed

+347
-302
lines changed

Day 6/tictactoe/.idea/workspace.xml

+165-193
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

Day 6/tictactoe/images/cropttt.jpeg

114 KB
Loading

Day 6/tictactoe/images/finalttt.jpg

168 KB
Loading

Day 6/tictactoe/lib/homepage.dart

+141-106
Original file line numberDiff line numberDiff line change
@@ -10,8 +10,6 @@ class HomePage extends StatefulWidget {
1010
class _HomePageState extends State<HomePage> {
1111

1212

13-
14-
1513
List<GameButton> buttonList;
1614
var player1, player2, activePlayer;
1715

@@ -21,7 +19,7 @@ class _HomePageState extends State<HomePage> {
2119
buttonList = doInit();
2220
}
2321

24-
List<GameButton> doInit(){
22+
List<GameButton> doInit() {
2523
//making a list of the moves player1 has choosed. This will help in judgement of the winner
2624
player1 = new List();
2725
player2 = new List();
@@ -42,120 +40,139 @@ class _HomePageState extends State<HomePage> {
4240
return gameButtons;
4341
}
4442

45-
void playGame(GameButton gb){
46-
43+
void playGame(GameButton gb) {
4744
//setting the state because every time I press the button I want the changes on the screen to be saved instantaneously
4845
setState(() {
49-
if(activePlayer==1) {
46+
if (activePlayer == 1) {
5047
gb.text = 'X';
5148
gb.bg = Colors.red;
5249
activePlayer = 2;
5350
player1.add(gb.id);
5451
//adding the id of the gameButton currently pressed by player1 to the list,so that we can evaluate later.
5552
}
5653
else {
57-
5854
gb.text = "0";
5955
gb.bg = Colors.black;
6056
activePlayer = 1;
6157
player2.add(gb.id);
6258
//adding the id of the gameButton currently pressed by player2 to the list,so that we can evaluate later.
63-
}
64-
gb.enabled = false; //because we want to disable the button which are played
65-
int winner = checkWinner();
59+
}
60+
gb.enabled =
61+
false; //because we want to disable the button which are played
62+
int winner = checkWinner();
6663

67-
//TIED GAME Check
68-
if(winner == -1){
69-
if(buttonList.every((p)=>p.text!="")){
64+
//TIED GAME Check
65+
if (winner == -1) {
66+
if (buttonList.every((p) => p.text != "")) {
7067
showDialog(
7168
context: context,
72-
builder: (_) => new CustomDialog("Game Tied", "Press The Reset Button to Start Again", resetGame)
69+
builder: (_) =>
70+
new CustomDialog(
71+
"Game Tied", "Press The Reset Button to Start Again",
72+
resetGame)
7373
);
7474
}
7575
}
7676
});
77-
}
77+
}
7878

7979

80-
int checkWinner(){
80+
int checkWinner() {
8181
int winner = -1;
8282

8383
//WINNER Check Code
8484

85-
if(player1.contains(1) && player1.contains(2) && player1.contains(3)) //ROW 1
86-
winner=1;
87-
if(player2.contains(1) && player2.contains(2) && player2.contains(3)) //ROW 1
88-
winner=2;
85+
if (player1.contains(1) && player1.contains(2) &&
86+
player1.contains(3)) //ROW 1
87+
winner = 1;
88+
if (player2.contains(1) && player2.contains(2) &&
89+
player2.contains(3)) //ROW 1
90+
winner = 2;
8991

9092

91-
if (player1.contains(4) && player1.contains(5) && player1.contains(6)) //ROW 2
92-
winner=1;
93-
if (player2.contains(4) && player2.contains(5) && player2.contains(6)) //ROW 2
94-
winner=2;
93+
if (player1.contains(4) && player1.contains(5) &&
94+
player1.contains(6)) //ROW 2
95+
winner = 1;
96+
if (player2.contains(4) && player2.contains(5) &&
97+
player2.contains(6)) //ROW 2
98+
winner = 2;
9599

96100

97-
if (player1.contains(7) && player1.contains(8) && player1.contains(9)) //ROW 3
98-
winner=1;
99-
if (player2.contains(7) && player2.contains(8) && player2.contains(9)) //ROW 3
100-
winner=2;
101+
if (player1.contains(7) && player1.contains(8) &&
102+
player1.contains(9)) //ROW 3
103+
winner = 1;
104+
if (player2.contains(7) && player2.contains(8) &&
105+
player2.contains(9)) //ROW 3
106+
winner = 2;
101107

102-
if (player1.contains(1) && player1.contains(4) && player1.contains(7)) //COLUMN 1
103-
winner=1;
104-
if (player2.contains(1) && player2.contains(4) && player2.contains(7)) //COLUMN 1
105-
winner=2;
108+
if (player1.contains(1) && player1.contains(4) &&
109+
player1.contains(7)) //COLUMN 1
110+
winner = 1;
111+
if (player2.contains(1) && player2.contains(4) &&
112+
player2.contains(7)) //COLUMN 1
113+
winner = 2;
106114

107115

108-
if (player1.contains(2) && player1.contains(5) && player1.contains(8)) //COLUMN 2
109-
winner=1;
110-
if (player2.contains(2) && player2.contains(5) && player2.contains(8)) //COLUMN 2
111-
winner=2;
116+
if (player1.contains(2) && player1.contains(5) &&
117+
player1.contains(8)) //COLUMN 2
118+
winner = 1;
119+
if (player2.contains(2) && player2.contains(5) &&
120+
player2.contains(8)) //COLUMN 2
121+
winner = 2;
112122

113123

114-
if (player1.contains(3) && player1.contains(6) && player1.contains(9)) //COLUMN 3
115-
winner=1;
116-
if (player2.contains(3) && player2.contains(6) && player2.contains(9)) //COLUMN 3
117-
winner=2;
124+
if (player1.contains(3) && player1.contains(6) &&
125+
player1.contains(9)) //COLUMN 3
126+
winner = 1;
127+
if (player2.contains(3) && player2.contains(6) &&
128+
player2.contains(9)) //COLUMN 3
129+
winner = 2;
118130

119131

120-
if (player1.contains(1) && player1.contains(5) && player1.contains(9)) //DIAGONAL 1
121-
winner=1;
122-
if (player2.contains(1) && player2.contains(5) && player2.contains(9)) //DIAGONAL 1
123-
winner=2;
132+
if (player1.contains(1) && player1.contains(5) &&
133+
player1.contains(9)) //DIAGONAL 1
134+
winner = 1;
135+
if (player2.contains(1) && player2.contains(5) &&
136+
player2.contains(9)) //DIAGONAL 1
137+
winner = 2;
124138

125139

126-
if (player1.contains(3) && player1.contains(5) && player1.contains(7)) //DIAGONAL 2
127-
winner=1;
128-
if (player2.contains(3) && player2.contains(5) && player2.contains(7)) //DIAGONAL 2
129-
winner=2;
130-
140+
if (player1.contains(3) && player1.contains(5) &&
141+
player1.contains(7)) //DIAGONAL 2
142+
winner = 1;
143+
if (player2.contains(3) && player2.contains(5) &&
144+
player2.contains(7)) //DIAGONAL 2
145+
winner = 2;
131146

132147

133148
//check for winner
134149

135-
if(winner!=-1)
136-
{
137-
if(winner == 1){
150+
if (winner != -1) {
151+
if (winner == 1) {
138152
showDialog(
139-
context: context,
140-
builder: (_) => new CustomDialog("Player 1 Won!!", "Reset the Game", resetGame));
141-
}
142-
else {
143-
showDialog(
144-
context: context,
145-
builder: (_) => new CustomDialog("Player 2 Won!!", "Reset the Game", resetGame));
146-
}
147-
153+
context: context,
154+
builder: (_) =>
155+
new CustomDialog("Player 1 Won!!", "Reset the Game", resetGame));
156+
}
157+
else {
158+
showDialog(
159+
context: context,
160+
builder: (_) =>
161+
new CustomDialog("Player 2 Won!!", "Reset the Game", resetGame));
162+
}
148163
}
149-
return winner;
164+
return winner;
150165
}
151166

152-
void resetGame(){
153-
if(Navigator.canPop(context)) Navigator.pop(context); //For closing the AlertDialog
154-
{
155-
setState(() {
156-
buttonList = doInit(); //Initializing the buttons again to the start by calling the doInit()
157-
});
158-
}
167+
void resetGame() {
168+
if (Navigator.canPop(context)) Navigator.pop(
169+
context); //For closing the AlertDialog
170+
{
171+
setState(() {
172+
buttonList =
173+
doInit(); //Initializing the buttons again to the start by calling the doInit()
174+
});
175+
}
159176
}
160177

161178
@override
@@ -165,49 +182,67 @@ void playGame(GameButton gb){
165182
title: Center(child: new Text('Tic Tac Toe')),
166183
backgroundColor: Colors.black,
167184
),
168-
body: new Column(
169-
mainAxisAlignment: MainAxisAlignment.center,
170-
crossAxisAlignment: CrossAxisAlignment.stretch,
185+
body: new Stack(
186+
fit: StackFit
187+
.expand,
171188
children: <Widget>[
172-
Expanded(
173-
child: new GridView.builder(
174-
padding: const EdgeInsets.all(10.0),
175-
gridDelegate: new SliverGridDelegateWithFixedCrossAxisCount(
176-
crossAxisCount: 3,
177-
childAspectRatio: 1.0,
178-
crossAxisSpacing: 9.0,
179-
mainAxisSpacing: 9.0,
180-
181-
),
182-
itemCount: buttonList.length,
183-
itemBuilder: (context,index){
184-
return new SizedBox(
185-
width: 100.0,
186-
height: 100.0,
187-
child: new RaisedButton(
188-
padding: const EdgeInsets.all(8.0),
189-
onPressed: buttonList[index].enabled ? ()=> playGame(buttonList[index]):null,
190-
child: new Text(
191-
buttonList[index].text,
192-
style: new TextStyle(color: Colors.white, fontSize: 20.0),
193-
),
194-
color: buttonList[index].bg,
195-
disabledColor: buttonList[index].bg,
196-
),
197-
);
198-
},
199189

200-
),
190+
new Image(
191+
image: new AssetImage('images/finalttt.jpg'),
192+
fit: BoxFit.cover, //covers the entire screen top to bottom
193+
color: Colors.black54,
194+
colorBlendMode: BlendMode.darken,
201195
),
202-
new RaisedButton(
203-
child: Center(child: new Text("Reset", style: new TextStyle(color: Colors.black),)),
204-
color: Colors.red,
205-
onPressed: resetGame
206-
)
207196

197+
new Column(
198+
mainAxisAlignment: MainAxisAlignment.center,
199+
crossAxisAlignment: CrossAxisAlignment.stretch,
200+
children: <Widget>[
201+
Expanded(
202+
child: new GridView.builder(
203+
padding: const EdgeInsets.all(10.0),
204+
gridDelegate: new SliverGridDelegateWithFixedCrossAxisCount(
205+
crossAxisCount: 3,
206+
childAspectRatio: 1.0,
207+
crossAxisSpacing: 9.0,
208+
mainAxisSpacing: 9.0,
209+
210+
),
211+
itemCount: buttonList.length,
212+
itemBuilder: (context, index) {
213+
return new SizedBox(
214+
width: 100.0,
215+
height: 100.0,
216+
child: new RaisedButton(
217+
padding: const EdgeInsets.all(8.0),
218+
onPressed: buttonList[index].enabled ? () =>
219+
playGame(buttonList[index]) : null,
220+
child: new Text(
221+
buttonList[index].text,
222+
style: new TextStyle(
223+
color: Colors.white, fontSize: 20.0),
224+
),
225+
color: buttonList[index].bg,
226+
disabledColor: buttonList[index].bg,
227+
),
228+
);
229+
},
230+
231+
),
232+
),
233+
new RaisedButton(
234+
child: Center(child: new Text(
235+
"Reset", style: new TextStyle(color: Colors.black),)),
236+
color: Colors.red,
237+
onPressed: resetGame
238+
)
239+
240+
],
241+
),
208242
],
243+
209244
),
210245

211246
);
212247
}
213-
}
248+
}

Day 6/tictactoe/lib/landing_page.dart

+36
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
import 'package:flutter/material.dart';
2+
import './homepage.dart';
3+
4+
class LandingPage extends StatelessWidget {
5+
@override
6+
Widget build(BuildContext context) {
7+
return Material(
8+
color: Colors.greenAccent,
9+
child: new Stack(
10+
fit: StackFit.expand,
11+
children: <Widget>[
12+
new Image(
13+
image: new AssetImage('images/cropttt.jpeg'),
14+
fit: BoxFit.fill,
15+
),
16+
new Column(
17+
mainAxisAlignment: MainAxisAlignment.end,
18+
children: <Widget>[
19+
new Container(
20+
height: 60.0,
21+
width: 250.0,
22+
padding: new EdgeInsets.only(bottom: 20.0),
23+
child: new RaisedButton(
24+
child: new Text('Play', style: new TextStyle(color: Colors.white),),
25+
onPressed: () => Navigator.of(context).push(new MaterialPageRoute(builder: (BuildContext context) => new HomePage())),
26+
color: Colors.greenAccent,
27+
shape: new RoundedRectangleBorder(borderRadius: new BorderRadius.circular(20.0)),
28+
),
29+
)
30+
],
31+
)
32+
],
33+
)
34+
);
35+
}
36+
}

Day 6/tictactoe/lib/main.dart

+2-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
import 'package:flutter/material.dart';
22
import 'package:tictactoe/homepage.dart';
3+
import 'package:tictactoe/landing_page.dart';
34

45
void main() {
56
runApp(new MyApp());
@@ -13,7 +14,7 @@ class MyApp extends StatelessWidget {
1314
// theme: new ThemeData(
1415
// primarySwatch: Colors.black
1516
// ),
16-
home: new HomePage(),
17+
home: new LandingPage(),
1718
debugShowCheckedModeBanner: false,
1819
);
1920
}

Day 6/tictactoe/pubspec.yaml

+3-2
Original file line numberDiff line numberDiff line change
@@ -26,8 +26,9 @@ flutter:
2626
uses-material-design: true
2727

2828
# To add assets to your application, add an assets section, like this:
29-
# assets:
30-
# - images/a_dot_burr.jpeg
29+
assets:
30+
- images/finalttt.jpg
31+
- images/cropttt.jpeg
3132
# - images/a_dot_ham.jpeg
3233

3334
# An image asset can refer to one or more resolution-specific "variants", see

0 commit comments

Comments
 (0)