adds animation

[sirine2907]

import 'package:flutter/material.dart';
import 'package:google_fonts/google_fonts.dart';
import 'package:smarthomeui/util/smart_device_box.dart';

class HomePage extends StatefulWidget {
const HomePage({super.key});

@OverRide
State createState() => _HomePageState();
}

class _HomePageState extends State {
// padding constants
final double horizontalPadding = 40;
final double verticalPadding = 25;

// list of smart devices
List mySmartDevices = [
// [ smartDeviceName, iconPath , powerStatus ]
["Smart Light", "lib/icons/light-bulb.png", true],
["Smart AC", "lib/icons/air-conditioner.png", false],
["Smart TV", "lib/icons/smart-tv.png", false],
["Smart Fan", "lib/icons/fan.png", false],
];

// power button switched
void powerSwitchChanged(bool value, int index) {
setState(() {
mySmartDevices[index][2] = value;
});
}

@OverRide
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: Colors.grey[300],
body: SafeArea(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
// app bar
Padding(
padding: EdgeInsets.symmetric(
horizontal: horizontalPadding,
vertical: verticalPadding,
),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
// menu icon
Image.asset(
'lib/icons/menu.png',
height: 45,
color: Colors.grey[800],
),

              // account icon
              Icon(
                Icons.person,
                size: 45,
                color: Colors.grey[800],
              )
            ],
          ),
        ),

        const SizedBox(height: 20),

        // welcome home
        Padding(
          padding: EdgeInsets.symmetric(horizontal: horizontalPadding),
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Text(
                "Welcome Home,",
                style: TextStyle(fontSize: 20, color: Colors.grey.shade800),
              ),
              Text(
                'Mitch Koko',
                style: GoogleFonts.bebasNeue(fontSize: 72),
              ),
            ],
          ),
        ),

        const SizedBox(height: 25),

        const Padding(
          padding: EdgeInsets.symmetric(horizontal: 40.0),
          child: Divider(
            thickness: 1,
            color: Color.fromARGB(255, 204, 204, 204),
          ),
        ),

        const SizedBox(height: 25),

        // smart devices grid
        Padding(
          padding: EdgeInsets.symmetric(horizontal: horizontalPadding),
          child: Text(
            "Smart Devices",
            style: TextStyle(
              fontWeight: FontWeight.bold,
              fontSize: 24,
              color: Colors.grey.shade800,
            ),
          ),
        ),
        const SizedBox(height: 10),

        // grid
        Expanded(
          child: GridView.builder(
            itemCount: 4,
            physics: const NeverScrollableScrollPhysics(),
            padding: const EdgeInsets.symmetric(horizontal: 25),
            gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
              crossAxisCount: 2,
              childAspectRatio: 1 / 1.3,
            ),
            itemBuilder: (context, index) {
              return SmartDeviceBox(
                smartDeviceName: mySmartDevices[index][0],
                iconPath: mySmartDevices[index][1],
                powerOn: mySmartDevices[index][2],
                onChanged: (value) => powerSwitchChanged(value, index),
              );
            },
          ),
        )
      ],
    ),
  ),
);

}
}