home.dart

import 'package:flutter/material.dart';

class HomePage extends StatefulWidget {
  const HomePage({Key? key}) : super(key: key);

  @override
  State<HomePage> createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {
  final textController = TextEditingController();

  @override
  void dispose() {
    textController.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: SizedBox(
          width: 400,
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            crossAxisAlignment: CrossAxisAlignment.stretch,
            children: [
              Container(
                decoration: BoxDecoration(
                  color: Colors.black12,
                  shape: BoxShape.rectangle,
                  borderRadius: BorderRadius.circular(20.0),
                ),
                child: Padding(
                  padding: const EdgeInsets.symmetric(vertical: 10.0),
                  child: TextField(
                    decoration: const InputDecoration(
                      border: InputBorder.none,
                      hintText: 'Use pad to enter number',
                    ),
                    textAlign: TextAlign.center,
                    style: const TextStyle(fontSize: 25),
                    controller: textController,
                  ),
                ),
              ),
              // const SizedBox(height: 10),
              GridView.count(
                mainAxisSpacing: 10,
                crossAxisSpacing: 10,
                physics: const NeverScrollableScrollPhysics(),
                shrinkWrap: true,
                crossAxisCount: 3,
                children: List.generate(
                  9,
                  (index) {
                    return getTextButton(index, context);
                  },
                ),
              ),
              const SizedBox(height: 20),
              TextButton(
                  style: TextButton.styleFrom(
                    side: const BorderSide(),
                    shape: RoundedRectangleBorder(
                        borderRadius: BorderRadius.circular(10.0)),
                  ),
                  onPressed: () {
                    textController.text = "";
                  },
                  child: Padding(
                    padding: const EdgeInsets.symmetric(vertical: 15.0),
                    child: Text(
                      'clear'.toUpperCase(),
                      style: const TextStyle(color: Colors.black, fontSize: 20),
                    ),
                  )),
            ],
          ),
        ),
      ),
    );
  }

  TextButton getTextButton(int index, BuildContext context) {
    return TextButton(
      style: TextButton.styleFrom(
        shape:
            RoundedRectangleBorder(borderRadius: BorderRadius.circular(10.0)),
        side: const BorderSide(),
      ),
      onPressed: () {
        final updatedText = textController.text + (index + 1).toString();
        textController.value = textController.value.copyWith(
          text: updatedText,
          selection: TextSelection.collapsed(offset: updatedText.length),
        );
      },
      child: Text(
        '${index + 1}',
        style: Theme.of(context).textTheme.headline5,
      ),
    );
  }

  Card getCardButton(int index, BuildContext context) {
    return Card(
      child: InkWell(
        onTap: () {
          final updatedText = textController.text + (index + 1).toString();
          textController.value = textController.value.copyWith(
            text: updatedText,
            selection: TextSelection.collapsed(offset: updatedText.length),
          );
        },
        child: Center(
          child: Text(
            '${index + 1}',
            style: Theme.of(context).textTheme.headline5,
          ),
        ),
      ),
    );
  }
}