Flutter Question posted in
The official Flutter documentation can be found here.

Accessing statefull widget method in button widget file in flutter

I have this class name inside that class I have function onBtnTap

import 'buttonWidget.dart';
import 'button_values.dart';


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

  @override
  State<CalculatorScreen> createState() => _CalculatorScreenState();

}



class _CalculatorScreenState extends State<CalculatorScreen> {


  String firstNumber = ""; //. 0-9
  String operand = ""; //+-*/
  String secondNumber = "";


  @override
  Widget build(BuildContext context) {
    
  }
  void onBtnTap(String value){
    setState((){
      firstNumber+=value;
    });
  }

}

and trying to access onBtnTap inside my widget file buildButton

import 'calculator_screen.dart';
import 'button_values.dart';

Widget buildButton(value){

  return Padding(
  );

  
}

i tried global key but it didn’t work also
final CalculatorScreen calScreen = new CalculatorScreen(); this method didn’t work
Notei removed most of the code that was unnecessary for my question.

Tags:

2

Answers


  1. 0

    You could put your buildButton function inside the _CalculatorScreenState, then use setState directly in buildButton.

    Otherwise, pass onBtnTap as a parameter to the child widget, or the build function.

        return buildButton(10,onBtnTap);

    Widget buildButton(int value, VoidCallback onTap) {
  return TextButton(
    onPressed: onTap,
    child: Text("$value"),
  );
}
    Login or Signup to reply.
  2. 0

    More detailed answer on how to create reusable component with callback.
    First create Button component

    // button_component.dart

import "package:flutter/material.dart";

Widget buildButton(VoidCallback onPressed, Widget child) {
  return TextButton(
    onPressed: onPressed,
    child: child,
  );
}

    Then you can use above component in your stateful widget as shown below

    // calculator_component.dart
import "package:flutter/material.dart";
import "package:test_project/components/button_component.dart";

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

  @override
  State<CalculatorScreen> createState() => _CalculatorScreenState();
}

class _CalculatorScreenState extends State<CalculatorScreen> {
  String _output = "0";

  /* Btn Pressed Handler */
  void _onButtonPressed(String value) {
    setState(() {
      _output = value;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Column(
        children: [
          Text(_output),
          Expanded(
            child: ListView.builder(itemBuilder: (context, index) {
              return Row(
                children: [
                  buildButton(() => _onButtonPressed("1"), const Text("1")),
                  buildButton(() => _onButtonPressed("2"), const Text("2")),
                  buildButton(() => _onButtonPressed("3"), const Text("3")),
                ],
              );
            }),
          ),
        ],
      ),
    );
  }
}
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search