JunKenPon – Como eu fiz este aplicativo em Flutter

por

#1 - Criação do Interface

import 'package:flutter/material.dart';
import 'package:jankenpon/Game.dart';

void main(){
  runApp(MaterialApp(
    home: Game(),
    debugShowCheckedModeBanner: false,
  ));
}
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';

class Game extends StatefulWidget {
  @override
  _GameState createState() => _GameState();
}

class _GameState extends State<Game> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
          title: Text("JanKenPon")
      ),
      body: Column(
          crossAxisAlignment: CrossAxisAlignment.center,
          children: <Widget>[
            Padding(
              padding: EdgeInsets.only(top: 24, bottom: 8),
              child: Text(
                "App choice",
                textAlign: TextAlign.center,
                style: TextStyle(
                    fontSize: 22,
                    fontWeight: FontWeight.bold
                ),
              ),
            ),
            Image.asset("images/base.png", height: 80,),
            Padding(
              padding: EdgeInsets.only(top: 24, bottom: 8),
              child: Text(
                "Batle field",
                textAlign: TextAlign.center,
                style: TextStyle(
                    fontSize: 22,
                    fontWeight: FontWeight.bold
                ),
              ),
            ),
            Image.asset("images/base.png", height: 120,),
            Padding(
              padding: EdgeInsets.only(top: 24, bottom: 8),
              child: Text(
                "Choose your option",
                textAlign: TextAlign.center,
                style: TextStyle(
                    fontSize: 22,
                    fontWeight: FontWeight.bold
                ),
              ),
            ),
            Row(
              mainAxisAlignment: MainAxisAlignment.center,
              children: <Widget>[
                Image.asset("images/rock.png", height: 80,),
                Image.asset("images/paper.png", height: 80,),
                Image.asset("images/scissors.png", height: 80,),
              ],
            ),
            Row(
              mainAxisAlignment: MainAxisAlignment.center,
              children: <Widget>[
                Image.asset("images/lizard.png", height: 80,),
                Image.asset("images/spock.png", height: 80,),
              ],
            ),
            Padding(
              padding: EdgeInsets.only(top: 24, bottom: 8),
              child: Text(
                "- Points -",
                textAlign: TextAlign.center,
                style: TextStyle(
                  fontSize: 22,
                  fontWeight: FontWeight.normal,
                ),
              ),
            ),
          ]),
    );
  }
}

Deixe um comentário