cu-traffic-lights-ex-1.dart

import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Traffic Lights',
      theme: ThemeData(
        primarySwatch: Colors.blue,
        visualDensity: VisualDensity.adaptivePlatformDensity,
      ),
      home: Scaffold(
        appBar: AppBar(
          title: Text('Flutter Traffic Lights'),
        ),
        body: SafeArea(
          child: SingleChildScrollView(
            padding: const EdgeInsets.symmetric(
              vertical: 32,
              horizontal: 16,
            ),
            child: Container(
              child: Center(
                child: PedestrianLight(),
              ),
            ),
          ),
        ),
      ),
    );
  }
}

class PedestrianLight extends StatefulWidget {
  @override
  _PedestrianLightState createState() => _PedestrianLightState();
}

class _PedestrianLightState extends State<PedestrianLight> {
  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        Container(
          color: MyColors.darkGrey,
          child: Column(
            mainAxisSize: MainAxisSize.min,
            children: <Widget>[
              Container(
                height: 70,
                width: 70,
                margin: EdgeInsets.all(8),
                decoration: BoxDecoration(
                  color: MyColors.lightGrey,
                  shape: BoxShape.circle,
                ),
                child: Icon(
                  Icons.person,
                  size: 48,
                  color: Colors.red,
                ),
              ),
              Container(
                height: 70,
                width: 70,
                margin: EdgeInsets.all(8),
                decoration: BoxDecoration(
                  color: MyColors.lightGrey,
                  shape: BoxShape.circle,
                ),
                child: Icon(
                  Icons.person,
                  size: 48,
                  color: Colors.green,
                ),
              )
            ],
          ),
        ),
        RaisedButton(
          onPressed: () {},
          child: Text('Press to cross'),
        ),
      ],
    );
  }
}

class MyColors {
  static const darkGrey = Color.fromRGBO(42, 43, 46, 1);
  static const lightGrey = Color.fromRGBO(95, 96, 99, 1);
}