cardWidget.dart

import 'package:flutter/material.dart';
import 'package:card/utils/margin_utils.dart';

class CardWidget extends StatelessWidget {
  final String amount;
  final String name;
  final String expiry;

  const CardWidget({Key key, @required this.amount, @required this.name, @required this.expiry});

  @override
  Widget build(BuildContext context) {
    return Padding(
      padding: EdgeInsets.symmetric(horizontal: 10),
      child: Container(
        height: 50,
        padding: EdgeInsets.only(bottom: 20),
        decoration: new BoxDecoration(
          image: new DecorationImage(
            image: 'assets/images/card.png'),
            fit: BoxFit.cover,
          ),
        ),
        child: Center(
          child: Padding(
            padding: const EdgeInsets.symmetric(horizontal: 42.0, vertical: 18),
            child: Column(
                mainAxisAlignment: MainAxisAlignment.center,
                children: <Widget>[
                  _buildTitle(),
                  customYMargin(35),
                  _buildName(),
                  customYMargin(40),
                  _buildExpiry()
                ]),
          ),
        ),
      ),
    );
  }

  _buildTitle() => Row(
        mainAxisAlignment: MainAxisAlignment.start,
        children: <Widget>[
          Row(
            mainAxisAlignment: MainAxisAlignment.start,
            children: <Widget>[
              Text(
                'D E B I T',
                style: TextStyle(
                    color: Colors.white,
                    fontSize: 11,
                    fontWeight: FontWeight.w200),
              ),
            ],
          ),
          customYMargin(35),
          Row(
            mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
              Text(
                '$amount',
                style: TextStyle(
                    color: Colors.white,
                    fontSize: 27,
                    fontFamily: 'Roboto',
                    fontWeight: FontWeight.w400),
              ),
            ],
          ),
          customYMargin(40),
        ],
      );

  _buildName() => Row(
        mainAxisAlignment: MainAxisAlignment.center,
        children: <Widget>[
          Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: <Widget>[
              Text(
                'CARD HOLDER',
                style: TextStyle(
                    fontSize: 12,
                    color: Colors.white,
                    fontWeight: FontWeight.w200),
              ),
              yMargin5,
              Text(
                '$name',
                style: TextStyle(
                    color: Colors.white,
                    fontFamily: 'OCRAEXT',
                    fontSize: 14.4,
                    fontWeight: FontWeight.w600),
              ),
            ],
          )
        ],
      );

  _buildExpiry() =>
      Row(mainAxisAlignment: MainAxisAlignment.spaceBetween, children: <Widget>[
        Column(crossAxisAlignment: CrossAxisAlignment.end, children: <Widget>[
          Text(
            'EXPIRES',
            style: TextStyle(
                fontSize: 12, color: Colors.white, fontWeight: FontWeight.w200),
          ),
          yMargin5,
          Text(
            '$expiry',
            style: TextStyle(
                color: Colors.white,
                fontFamily: 'OCRAEXT',
                fontSize: 14.4,
                fontWeight: FontWeight.w600),
          ),
        ])
      ]);
}