import 'package:flutter/material.dart';
import 'package:flutter_staggered_grid_view/flutter_staggered_grid_view.dart';
import 'package:hris_selfservice_mobile/Screens/Home/background.dart';

class HomeView extends StatefulWidget {
  @override
  _HomeView createState() => _HomeView();
}

class _HomeView extends State<HomeView> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
        resizeToAvoidBottomInset: false,
        //backgroundColor: Colors.white,
        body: Stack(
          children: <Widget>[
            //Background(),
            HomeScreen(),
          ],
        ));
  }
}

class HomeScreen extends StatelessWidget {
  const HomeScreen({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    var size = MediaQuery.of(context).size;
    return Scaffold(
      body: Stack(
        children: <Widget>[
          Container(
            alignment: Alignment.topCenter,
            margin: EdgeInsets.only(top: 15),
            child: Card(
              child: Container(
                height: 200,
                width: size.width - 20,
                padding: EdgeInsets.all(15),
                decoration: BoxDecoration(
                    color: Colors.red,
                    borderRadius: BorderRadius.all(Radius.circular(10))),
              ),
            ),
          ),
          GridView.count(
            padding: EdgeInsets.all(5),
            crossAxisCount: 2,
            children: [
              CustomCard(
                  title: "Absensi",
                  image: 'assets/icons/menu/ic_menu_absensi2.png'),
              CustomCard(
                  title: "Slip Gaji",
                  image: 'assets/icons/menu/ic_menu_slipgaji2.png'),
              CustomCard(
                  title: "Ajukan Cuti",
                  image: 'assets/icons/menu/ic_menu_ajukancuti2.png'),
              CustomCard(
                  title: "Berita",
                  image: 'assets/icons/menu/ic_menu_berita2.png'),
              CustomCard(
                  title: "About",
                  image: 'assets/icons/menu/ic_menu_about2.png'),
              CustomCard(
                  title: "Lainnya",
                  image: 'assets/icons/menu/ic_menu_lainnya.png'),
            ],
          )
        ],
      ),
    );
  }
}

class CustomCard extends StatelessWidget {
  CustomCard({required this.title, required this.image});

  String title;
  String image;

  @override
  Widget build(BuildContext context) {
    return SizedBox(
        height: 150,
        width: 30,
        child: Card(
          margin: EdgeInsets.fromLTRB(20, 5, 20, 5),
          color: Color(0xFFD9D9D9),
          elevation: 5,
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Container(
                height: 75,
                decoration: BoxDecoration(
                    image: DecorationImage(
                        image: AssetImage(image),
                        //fit: BoxFit.cover,
                        alignment: Alignment.center)),
              ),
              Container(
                alignment: Alignment.bottomCenter,
                padding: const EdgeInsets.all(15),
                child: Text(
                  title,
                  textAlign: TextAlign.center,
                ),
              )
            ],
          ),
        ));
  }
}
