flutter - time_range_picker package

Issue

I managed to create a function (which I put in a TextButton) where you can see the Time_range_picker and choose the range.

I just can't show the result either in a text widget or in the button label.

class OpeningHours extends StatefulWidget {

  const OpeningHours({Key? key}) : super(key: key);
@override
  State<OpeningHours> createState() => _OpeningHoursState();
}

class _OpeningHoursState extends State<OpeningHours> {
 
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
          child: TextButton.icon(
            icon: const Icon(
              FontAwesomeIcons.penToSquare,
              color: Colors.white,
            ),
            label: Text(
              result.toString(),   // it does not work
              style: const TextStyle(
                color: Colors.white,
                fontSize: 22,
              ),
            ),
            style: TextButton.styleFrom(
                shadowColor: Colors.red,
                elevation: 18,
                backgroundColor: Colors.red),
            onPressed: () {
              pickTimeRange(context);
            },
          ),
      ),
    );
  }

  Future pickTimeRange(BuildContext context) async {
    final TimeRange? result = await showTimeRangePicker(context: context); 
      }
    }

Solution

first you should initialize the timer value like this TimeRange? resultForPrint; // add this line ,then you should update this value using setSteate

please check my code , it will work

class Oeffnungszeiten extends StatefulWidget {

  const Oeffnungszeiten({Key? key}) : super(key: key);
@override
  State<Oeffnungszeiten> createState() => _OeffnungszeitenState();
}

class _OeffnungszeitenState extends State<Oeffnungszeiten> {

TimeRange? resultForPrint; // add this line

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
          child: TextButton.icon(
            icon: const Icon(
              FontAwesomeIcons.penToSquare,
              color: Colors.white,
            ),
            label: Text(

///////////////////////// add this code

              resultForPrint == null
              ? "Hi Friend"
             : "${resultForPrint!.startTime.format(context)} , ${resultForPrint!.endTime.format(context)}",

/////////////////////////

              style: const TextStyle(
                color: Colors.white,
                fontSize: 22,
              ),
            ),
            style: TextButton.styleFrom(
                shadowColor: Colors.red,
                elevation: 18,
                backgroundColor: Colors.red),
            onPressed: () {
              pickTimeRange(context);
            },
          ),
      ),
    );
  }

  Future pickTimeRange(BuildContext context) async {
    final TimeRange? result = await showTimeRangePicker(context: context); 
 
//////////////////////////// add this code

     setState(() {
              resultForPrint = result;
            });

/////////////////////////

      }
    }

Answered By - Jinto Joseph