Show button's value in Text when it is pressed - Flutter

I want when any key is pressed so it should show in Text widget(in place of data) [please see below image]. For Example 1 is pressed so 1, then I press 2 so, it should show 12, etc. Then, if I press call end(bottomright button) so, that field should be cleared.

Image is here

Let me add code below,

Column(
    [
     Text("data"),
     Row(
         mainAxisAlignment: MainAxisAlignment.spaceAround,
         children: [
                  GestureDetector(
                      onTap: () {},
                      child: defaultContainer("1")),
                  GestureDetector(
                      onTap: () {},
                      child: defaultContainer("2")),
                  GestureDetector(
                      onTap: () {},
                      child: defaultContainer("3")),
                ],
              ),
.........
     ],
    )

Widget defaultContainer(String value) {
    return Container(
      width: 60,
      height: 60,
      decoration: BoxDecoration(
        borderRadius: BorderRadius.circular(50),
        boxShadow: const [BoxShadow(blurRadius: 5)],
        color: colors[random.nextInt(8)],
      ),
      child: Center(
          child: Text(
        value,
        style: const TextStyle(fontSize: 30),
      )),
    );
  }

Hope, I could explain.

You can archive this by declaring a variable to store the number and having a function that appends a digit to the number when pressed.

Try the below snippet:

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      debugShowCheckedModeBanner: false,
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: const MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  final String title;

  const MyHomePage({
    Key? key,
    required this.title,
  }) : super(key: key);

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  String number = "";

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Text(number),
            Wrap(
              alignment: WrapAlignment.center,
              children: [
                defaultContainer("1"),
                defaultContainer("2"),
                defaultContainer("3"),
                defaultContainer("4"),
                defaultContainer("5"),
                defaultContainer("6"),
                defaultContainer("7"),
                defaultContainer("8"),
                defaultContainer("9"),
                defaultContainer("0"),
                defaultContainer("0", isClear: true),
              ]
            )
          ],
        ),
      ),
    );
  }
  
  Widget defaultContainer(String value, {bool? isClear}) {
    return InkWell(
    onTap: (){
      setState((){
        if(isClear??false){
          number = "";
        } else {
          number += value;
        }
      });
    },
      child: Container(
      width: 60,
      height: 60,
      decoration: BoxDecoration(
        borderRadius: BorderRadius.circular(50),
        boxShadow: const [BoxShadow(blurRadius: 5)],
        color: Colors.white,
      ),
      child: Center(
          child: isClear??false?
        const Icon(Icons.call_end):
        Text(
        value,
        style: const TextStyle(fontSize: 30),
      )),
    )
    );
  }
}