android – UI not updating immediately when button is tapped


I have used 2 buttons :
–accident
–theft;

when i click on theft button then widget2() should be shown on the same screen below the buttons;
and for accident widget1() should display. but on clicking the widgets don’t appear.

`class ButtonViewBody extends GetView<ButtonViewBodyController> {
  const ButtonViewBody({super.key});

  @override
  Widget build(BuildContext context) => Padding(
        padding: EdgeInsets.symmetric(horizontal: 16.w, vertical: 10.h),
        child: Form(
          child: Column(
            children: [
              Expanded(
                child: SingleChildScrollView(
                  child: Row(
                    mainAxisSize: MainAxisSize.min,   
                    children: 
                    [
                      AccidentButton(),
                      SizedBox(width: 12.h),
                      TheftButton(),
                    ]
                  ),
                ),
              ),
              if (ButtonViewBodyController.to.showAccidentWidgets.value)
                Column(
                  children: [
                    Widget1(),
                  ],
                ),
              if (ButtonViewBodyController.to.showTheftWidgets.value)
                Column(
                  children: [
                    Widget2(),
                  ],
                ),
            ],
          ),
        ),
      );
}

class TheftButton extends StatefulWidget {
  const TheftButton({Key? key}) : super(key: key);

  @override
  _TheftButtonState createState() => _TheftButtonState();
}
class _TheftButtonState extends State<TheftButton>  {

  @override
  Widget build(BuildContext context) => InkWell(
        onTap: () {
          ButtonViewBodyController.to.toggleTheftWidgets();
          setState(() {}); // Trigger a rebuild
        },
        child: Container(
          width: 130.h,
          height: 31.h,
          decoration: BoxDecoration(
            color: AppColor.primaryEmphasis,
            borderRadius: BorderRadius.circular(200.r),
          ),
          child: Row(
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              Text(
                "Theft",
                style: Get.textTheme.bodyLarge?.copyWith(
                  height: 1,
                  fontSize: 16.sp,
                  letterSpacing: 0.5,
                  fontWeight: FontWeight.w500,
                  color: AppColor.monoWhite,
                ),
              ),
              SizedBox(width: 12.w),
            ],
          ),
        ),
      );
}

class AccidentButton extends StatefulWidget {
  const AccidentButton({Key? key}) : super(key: key);

  @override
  _AccidentButton createState() => _AccidentButton();
}
class _AccidentButton extends State<AccidentButton>  {

  @override
  Widget build(BuildContext context) => InkWell(
        onTap: () {
          ButtonViewBodyController.to.toggleAccidentWidgets();
          setState(() {}); // Trigger a rebuild
        },
        child: Container(
          width: 130.h,
          height: 31.h,
          decoration: BoxDecoration(
            color: AppColor.primaryEmphasis,
            borderRadius: BorderRadius.circular(200.r),
          ),
          child: Row(
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              Text(
                "Accident",
                style: Get.textTheme.bodyLarge?.copyWith(
                  height: 1,
                  fontSize: 16.sp,
                  letterSpacing: 0.5,
                  fontWeight: FontWeight.w500,
                  color: AppColor.monoWhite,
                ),
              ),
              SizedBox(width: 12.w),
            ],
          ),
        ),
      );
}

class ButtonViewBodyController extends GetxController with StateMixin {
  static ButtonViewBodyController get to => Get.find<ButtonViewBodyController>();
final showAccidentWidgets = false.obs;
final showTheftWidgets = false.obs;

void toggleAccidentWidgets() {
  showAccidentWidgets.value = true;
  showTheftWidgets.value = false;
}

void toggleTheftWidgets() {
  showTheftWidgets.value = true;
  showAccidentWidgets.value = false;
}
}`

i tested the app in debug mode, when i click the button widgets doesn’t display but when i hot reload then widgets appear.
I’m a beginner in flutter and facing this issue.

Latest articles

spot_imgspot_img

Related articles

Leave a reply

Please enter your comment!
Please enter your name here

spot_imgspot_img