Flutter Carousel обрамлена фотографиями в данный момент
Как я могу отобразить карусель, обрамленную фотографиями в данный момент? Эта карусель нуждается в функции для удаления фотографий, если это необходимо. И индикатор того, какое изображение я вижу.
Я использую пакеты: 'image_picker' для получения фотографий из галереи или камеры. И пакет carousel_slider для отображения карусели.
Итак, если нет фото, то нет и карусели.
Проблема в том, что вторая фотография заменяет первую... третья заменяет вторую и первую, я имею в виду, что следующая фотография заменяет предыдущие фотографии. Кроме того, я не могу удалить фотографии из карусели и не могу отобразить индикаторы для изображения, на которое смотрю.
Вот функции, которые я запускаю, чтобы делать снимки:
_takePicture() async {
File auxiliarFile;
final ImagePicker _picker = ImagePicker();
XFile imageFile = await _picker.pickImage(
source: ImageSource.camera, maxWidth: 600) as XFile;
setState(() {
_storedImage = File(imageFile.path);
});
auxiliarFile = _storedImage!;
final appDir = await syspath.getApplicationDocumentsDirectory();
String fileName = path.basename(_storedImage!.path);
final savedImage = await _storedImage!.copy('${appDir.path}/$fileName');
listImages.add(auxiliarFile);
}
_chosePicture() async {
final ImagePicker _picker = ImagePicker();
XFile imageFile = await _picker.pickImage(
source: ImageSource.gallery,
) as XFile;
setState(() {
_storedImage = File(imageFile.path);
});
final appDir = await syspath.getApplicationDocumentsDirectory();
String fileName = path.basename(_storedImage!.path);
final savedImage = await _storedImage!.copy('${appDir.path}/$fileName');
listImages.add(savedImage);
}
Чтобы отобразить карусель, я пробовал:
_storedImage != null
? Column(
children: [
CarouselSlider(
options: CarouselOptions(
enableInfiniteScroll: false,
enlargeCenterPage: true,
enlargeFactor: 0.25,
),
items: listImages.map((i) {
return Builder(builder:
(BuildContext context) {
return Container(
width: MediaQuery.of(context)
.size
.width *
0.75,
decoration: BoxDecoration(
borderRadius:
BorderRadius.circular(10),
border: Border.all(
color: Colors.black87),
color: Colors.grey[350],
),
child: OutlinedButton(
onPressed: _showDeleteDialog,
onLongPress: () =>
_showDeleteDialog(),
child: Image.file(
(_storedImage!),
),
),
);
});
}).toList(),
),
Padding(
padding: const EdgeInsets.all(8),
child: Row(
mainAxisAlignment:
MainAxisAlignment.center,
children: map<Widget>(listImages,
(index, url) {
return InkWell(
onTap: () {
setState(() {
_pageController
.jumpToPage(index);
currentIndex = index;
});
},
child: Container(
width: 10,
height: 10,
margin: const EdgeInsets
.symmetric(
vertical: 10,
horizontal: 5,
),
decoration:
const BoxDecoration(
shape: BoxShape.circle,
color: Colors.grey,
),
),
);
}),
),
),
],
)
: const Text(
'No image',
style: TextStyle(
fontWeight: FontWeight.bold,
),
)