Flutter setState method shows error while the function calling from another page

I have create a method for call bottom dialogue in flutter. But on that case setState method shows error when loading the bottom dialog…

import 'package:chavara/src/utils/theme/app_fonts.dart';
import 'package:flutter/material.dart';
import '../utils/theme/app_colors.dart';
import 'basic_text.dart';

basicBottomSheet(BuildContext context, String heading) {
  int id = 1;
  List<FruitsList> fList = [
    FruitsList(
      index: 1,
      name: "Mango",
    ),
    FruitsList(
      index: 2,
      name: "Apple",
    ),
    FruitsList(
      index: 3,
      name: "Banana",
    ),
    FruitsList(
      index: 4,
      name: "Cherry",
    ),
  ];
  showModalBottomSheet<void>(
    context: context,
    shape: const RoundedRectangleBorder( // <-- SEE HERE
      borderRadius: BorderRadius.vertical(
        top: Radius.circular(20.0),
      ),
    ),
    builder: (BuildContext context) {
      return SizedBox(
        height: 600,
        child: Center(
          child: Column(
            children: <Widget>[
              Column(
                children: const <Widget>[
                  Padding(
                      padding : EdgeInsets.fromLTRB(30, 40, 30, 10),
                      child: SizedBox(
                        width: double.infinity,
                        child: BasicText(
                            text: "Bottom Dialog",
                            textColor: AppColors.black,
                            fontSize: 20,
                            fontWeight:
                            AppFonts.fontWeightSemiBold),
                      )
                  ),
                ],
              ),
              Padding(
                padding : const EdgeInsets.fromLTRB(30, 0, 30, 10),
                child: Container(height: 1, color: AppColors.bottomSheetLine)
              ),
              Expanded(
                  child: SizedBox(
                    height: 350.0,
                    child: Column(
                      children:
                      fList.map((data) => RadioListTile(
                        title: Text(data.name,style: const TextStyle(fontSize: 14)),
                        groupValue: id,
                        value: data.index,
                        onChanged: (val) {
                          setState(() {
                            id = data.index;
                          });
                        },
                      )).toList(),
                    ),
                  )),
            ],
          ),
        ),
      );
    },
  );
}

class FruitsList {
  String name;
  int index;
  FruitsList({required this.name, required this.index});
}

function calls from another page on a button click :

basicBottomSheet(context,"Bottom Dialogue");

Here setState shows an error Error: Method not found: ‘setState’

Anybody knows a solution for this please help me.

>Solution :

You can try wrapping the Column with the RadioListTiles in a StatefulBuilder, like this:

              Expanded(
                  child: SizedBox(
                    height: 350.0,
                    child: StatefulBuilder(
                      builder: (context, setState) {
                        return Column(
                          children:
                          fList.map((data) => RadioListTile(
                            title: Text(data.name,style: const TextStyle(fontSize: 14)),
                            groupValue: id,
                            value: data.index,
                            onChanged: (val) {
                              setState(() {
                                id = data.index;
                              });
                            },
                          )).toList(),
                        );
                      }
                    ),
                  )),

Leave a Reply