How to Provide two different cubits for the same page

33 Views Asked by At

I Have two different cubits one for the Scan page [ScanCubit] it responsible for pick image from user if image is null emit ScanFailure state if image not null emit ScanSucces accompanied with the image and the another cubit have varibleImage[image] and method to upload the varibleImage [image] enter image description here

    class DetectionCubit extends Cubit<DetectionState> {
  DetectionCubit() : super(DetectionInitial());
  File? image;

  sendDetectionData() async {
    emit(DetectionLoading());
    try {
      var list = await DetectionRepo.uploadImage(image);
      emit(DetectionSuccess(textResult: list.toString()));
    } catch (e) {
      print(e);
    }
  }
}
class ScanCubit extends Cubit<ScanState> {
  ScanCubit() : super(ScanInitial());

  final ImagePicker imagePicker = ImagePicker();

  dynamic pickImageGallery() async {
    final XFile? imageXFile;
    imageXFile = await imagePicker.pickImage(source: ImageSource.gallery);
    if (imageXFile == null) {
      emit(ScanFailure(err: 'Empty Value'));
      return;
    }
    File? imageFile = File(imageXFile.path);
    emit(ScanSuccess(image: imageFile));
  }
}

This is The ui of the Scan Page ,,, when scanSuccess state is emited take the accompanied image and try to access the the varibleImage[image] in the another cubit [DetectionCubit] Scan Page

class ScanViewBody extends StatelessWidget {
  const ScanViewBody({
    super.key,
  });

  @override
  Widget build(BuildContext context) {
    var screenWidthSize = MediaQuery.of(context).size.width;
    var screenHeightSize = MediaQuery.of(context).size.height;
    return BlocConsumer<ScanCubit, ScanState>(
      listener: (context, state) {
        if (state is ScanFailure) {
          ScaffoldMessenger.of(context)
              .showSnackBar(const SnackBar(content: Text('No Image Selected')));
        }
        if (state is ScanSuccess) {
          BlocProvider.of<DetectionCubit>(context).image = state.image;
          GoRouter.of(context).push(AppRouter.kDetectionResultView);
        }
      },
      builder: (context, state) {
        if (state is ScanLoading) {
          return const Center(
            child: CircularProgressIndicator(),
          );
        }
        

        else {
          return Padding(
            padding: const EdgeInsets.all(16.0),
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.center,
              children: [
                CustomAppBar(
                    title: 'Detection',
                    onPressed: () {
                      GoRouter.of(context).pushReplacement(AppRouter.kHomeView);
                    }),
                SizedBox(
                  height: screenHeightSize * 0.1,
                ),
                Image.asset('assets/derm_-_hero_image_2_1 1 (1).png'),
                SizedBox(
                  height: screenHeightSize * 0.1,
                ),
                const Text('Detect your disease with only one click.... ',
                    style: TextStyle(fontSize: 16)),
                const Text.rich(
                  TextSpan(
                    children: [
                      TextSpan(text: 'Press'),
                      TextSpan(
                          text: ' Scan ',
                          style: TextStyle(
                              color: Colors.deepPurpleAccent,
                              fontWeight: FontWeight.w600)),
                      TextSpan(text: 'now on the Screen to Start Detection'),
                    ],
                  ),
                ),
                SizedBox(
                  height: screenWidthSize * 0.5,
                ),
                const CustomMaterialButton(text: 'Scan'),
                const SizedBox(
                  height: 30,
                ),
              ],
            ),
          );
        }
      },
    );
  }
}

enter image description here

i try to provide the two cubits for the scan page without using the MultiBlocProvider in the MaterialApp in the main ,,,,, because when i provide the DetectionCubit in the main the DetectionSuccess state doesn't change

0

There are 0 best solutions below