Flutter-Buddies / tic_tac_no

Complex variants of tic-tac-toe game
MIT License
19 stars 10 forks source link

Refactor to make game screen look good on all screen sizes #16

Closed Zambrella closed 3 years ago

Zambrella commented 3 years ago

Working on this today

Zambrella commented 3 years ago
Screenshot 2021-02-05 at 10 15 28

Broken on 720p phones

slovnicki commented 3 years ago

Hm... I guess we should manually compute the size of table cells, but based on device height, not width

Zambrella commented 3 years ago

I'm going to have a play but I'm thinking of having the top section be the dynamically sizing part of the screen.

slovnicki commented 3 years ago

Yeah, that in fact sounds better. It would be a little inconvenient to have a small phone AND even smaller grid. Let it always be as wide as it can. That surely leaves some height to be worked with for top section

Zambrella commented 3 years ago

Screenshot_1612537336 Screenshot_1612537334 Screenshot_1612537333

Got it working on 720p, 1080p and 1440p extended height displays. Not the most fool proof but I think it should cover most cases.

If you're wondering I used a combination of LayoutBuilder and AspectRatio widgets (along with Flexible/Expanded).

I have tested both the 'playing state' and the 'won' state.