flutterdart

How to make reusable ElevatedButton with onPressed property on Flutter


I am trying to make a scalable Button widget using flutter, all the property is working except onPressed which required a VoidCallback data type, what is wrong in here code:

// ignore_for_file: public_member_api_docs, sort_constructors_first
import 'package:flutter/material.dart';

// ignore: must_be_immutable
class PrimaryButton extends StatelessWidget {
  // NOTE: if VoidCallback + required this.onPressedData is uncommented then route error
  // VoidCallback onPressedData;
  String textButtonData;
  PrimaryButton({
    super.key,
    // required this.onPressedData,
    required this.textButtonData,
  });

  @override
  Widget build(BuildContext context) {
    return ElevatedButton(
      //TODO: implement onPressed to each button
      onPressed: () {},
      // onPressedData,
      style: ButtonStyle(
        fixedSize: WidgetStatePropertyAll(Size(368, 49),),
        backgroundColor: WidgetStatePropertyAll(
          Theme.of(context).colorScheme.primaryContainer
          ),
      ),
      child: Text(
        textButtonData,
        style: TextStyle(
          color: Theme.of(context).colorScheme.onPrimaryContainer,
          fontWeight: FontWeight.bold,
          fontSize: 18)),
    );
  }
}

I tried using the commented solution but it did not work due to something


Solution

  • You do not actually need to declare it as VoidCallBack simply change it to this: also declare it as final and git rid of immutability warning, hope it works for you

    import 'package:flutter/material.dart';
    
    class PrimaryButton extends StatelessWidget {
      final void Function() onPressedData;
      final String textButtonData;
      PrimaryButton({
        super.key,
        required this.onPressedData,
        required this.textButtonData,
      });
    
      @override
      Widget build(BuildContext context) {
        return ElevatedButton(
          //TODO: implement onPressed to each button
          onPressed: onPressedData,
          // onPressedData,
          style: ButtonStyle(
            fixedSize: WidgetStatePropertyAll(Size(368, 49),),
            backgroundColor: WidgetStatePropertyAll(
              Theme.of(context).colorScheme.primaryContainer
              ),
          ),
          child: Text(
            textButtonData,
            style: TextStyle(
              color: Theme.of(context).colorScheme.onPrimaryContainer,
              fontWeight: FontWeight.bold,
              fontSize: 18)),
        );
      }
    }