Reputation: 35
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
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