Firstly, I am using getx state management. There may be delays while receiving data from the API. So I tried to use circular progress indicator but got error.
error: Conditions must have a static type of 'bool'. (non_bool_condition at [app] lib\screens\app\app.dart:56)
import 'package:get/get.dart';
class LoadingController extends GetxController {
late RxBool isLoading;
void getLoading() {
isLoading = true.obs;
Future.delayed(const Duration(seconds: 2), () {
isLoading = false.obs;
});
}
@override
void onInit() {
getLoading();
super.onInit();
}
}
All pages consist of stateless widgets
LoadingController loading = Get.put(LoadingController());
child: loading.isLoading
? Center(
child: CircularProgressIndicator(),
)
: Container(
decoration: BoxDecoration(
color: cCardColor,
borderRadius: BorderRadius.circular(8.r),
),
I don't want to turn the pages statefull but I couldn't find a way
This error happened because you defined an observable variable but used and assigned value to it like a normal variable
You used an Observable
variable so you have to use the Obx
or GetX
widget to rebuild UI.
Change UI codes like this :
LoadingController loading = Get.put(LoadingController());
child: Obx(()=>loading.isLoading.value
? Center(
child: CircularProgressIndicator(),
)
: Container(
decoration: BoxDecoration(
color: cCardColor,
borderRadius: BorderRadius.circular(8.r),
),
),
Also, there is an issue in the controller. Please check the below code.
import 'package:get/get.dart';
class LoadingController extends GetxController {
RxBool isLoading = false.obs;
void getLoading() {
isLoading(true);
Future.delayed(const Duration(seconds: 2), () {
isLoading(false);
});
}
@override
void onInit() {
getLoading();
super.onInit();
}
}