Faith.youssef.abk
Faith.youssef.abk

Reputation: 35

multi image picker flutter

below is my code, i need to make the camera when pressed to add multiple images on the screen\containers it shows errors without explaining why

    
         final ImagePicker imgpicker = ImagePicker();
          List<XFile>? imagefiles;
        
          openImages() async {
            try {
              var pickedfiles = await imgpicker.pickMultiImage();
              //you can use ImageCourse.camera for Camera capture
              if(pickedfiles != null){
                imagefiles = pickedfiles;
                setState(() {
                });
              }else{
                print("No image is selected.");
              }
            }catch (e) {
              print("error while picking file.");
            }
          }
          final formKey = new GlobalKey<FormState>();
        
         File? singleImage;
        
          final singlePicker = ImagePicker();
          final multiPicker = ImagePicker();
          List<XFile>? images = [];
           @override
          Widget build(BuildContext context) {
        
            return DefaultTabController(
              length: 2,
              child: MaterialApp(
              theme: ThemeData(fontFamily: 'Harmattan',),
                home: Scaffold(
                  key: _scaffoldKey,
                    appBar: AppBar(
                      actions: [>>>>>>
                    
     
        
              SizedBox(height: 2),
                                Row(
                                  mainAxisAlignment: MainAxisAlignment.start,
                                  children: [
                                    Column(children: [Text('  enter image ',style: TextStyle(),),
                                      IconButton(onPressed: getMultiImages, icon: Icon(Icons.camera_alt,size: 30,),color: Colors.lightBlue,),],),
                                ],),
        
                                       SizedBox(
                                         height: 5,
                                       ),
                                       Text(
                                         'Mohab Erabi',
                                         style: TextStyle(fontWeight: FontWeight.bold),
                                       ),
                                       SizedBox(
                                         height: 10,
                                       ),
                                       Container(
                                         height: 1,
                                         width: double.infinity,
                                         color: Colors.grey.withOpacity(0.2),
                                       ),
                                       SizedBox(
                                         height: 10,
                                       ),
                                       Text('You Can Add Phoots Here'),
                                       SizedBox(
                                         height: 20,
                                       ),
                                       Expanded(
                                         child: InkWell(
                                           onTap: () {
                                             getMultiImages();
                                           },
                                           child: GridView.builder(
                                               itemCount: images!.isEmpty ? 1 : images!.length,
                                               gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
                                                   crossAxisCount: 3),
                                               itemBuilder: (context, index) => Container(
                                                   decoration: BoxDecoration(
                                                       color: Colors.white,
                                                       border: Border.all(
                                                           color: Colors.grey.withOpacity(0.5))),
                                                   child: images!.isEmpty
                                                       ? Icon(
                                                     CupertinoIcons.camera,
                                                     color: Colors.grey.withOpacity(0.5),
                                                   )
                                                       : Image.file(
                                                     File(images![index].path),
                                                     fit: BoxFit.cover,
                                                   ))),
                                         ),
                                       )
                                     ],
                            ),
                          ),
                        ),.......
        
                                 Container(
                                  height: 50,
                                  width: 200,
                                  child: ElevatedButton(
                                    //style: ElevatedButton.styleFrom(side: BorderSide(width: 1,style: BorderStyle.solid),
                                    style: ButtonStyle(
                                        shape: MaterialStateProperty.all<
                                                RoundedRectangleBorder>(
                                            RoundedRectangleBorder(
                                                borderRadius: BorderRadius.circular(50.0),
                                                side: BorderSide(color: Colors.white)))),
                                    //style: ButtonStyle(shape: OutlinedBorder()),
                                    child: Text(
                                      'save',
                                      style: TextStyle(color: Colors.white, fontSize: 20),
                                    ),
        .........        
        
          Future getMultiImages() async {
            final List<XFile>? selectedImages = await multiPicker.pickMultiImage();
            setState(() {
              if (selectedImages!.isNotEmpty) {
                images!.addAll(selectedImages);
              } else {
                print('No Images Selected ');
              }
            });
          }

The following assertion was thrown during performLayout(): 'package:flutter/src/rendering/shifted_box.dart': Failed assertion: line 348 pos 12: 'child!.hasSize': is not true.

Either the assertion indicates an error in the framework itself, or we should provide substantially more information in this error message to help you determine and fix the underlying cause. In either case, please report this assertion by filing a bug on GitHub: https://github.com/flutter/flutter/issues/new?template=2_bug.md

Upvotes: 0

Views: 1091

Answers (1)

Kaushik Chandru
Kaushik Chandru

Reputation: 17772

This expanded widget has no bounds I think. If you have added this to a column wrap the column with a sizedBox of height and width same as the device

SizedBox(
 height: MediaQuery.of(context).size.height,
 width: MediaQuery.of(context).size.width,
 child: Column(
  children : [
   Expanded(
       child: InkWell(
         onTap: () {
          getMultiImages();
          },
          child: GridView.builder(
           itemCount: images!.isEmpty ? 1 : images!.length,
           gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(crossAxisCount: 3),
           itemBuilder: (context, index) => Container(decoration: BoxDecoration(
             color: Colors.white,
              border: Border.all(
                color: Colors.grey.withOpacity(0.5))),
                child: images!.isEmpty? Icon(
                   CupertinoIcons.camera,
                   color: Colors.grey.withOpacity(0.5),
                ): Image.file(File(images![index].path),                                                   fit: BoxFit.cover,
              ))),
          ),
      )
  ]
 ),
)

Upvotes: 1

Related Questions