Anonymous
Flutter) Как использовать несколько images_pickers на одном экране
Сообщение
Anonymous » 06 май 2025, 09:12
Я собираюсь создать несколько контейнеров, которые могут содержать изображения.
Этот контейнер изображения сделан для добавления через кнопку и ListView.Builder.
Так что я пытаюсь поместить каждое изображение в этот контейнер изображения, но есть проблема. < /p>
Когда изображение выбирается через Picker_Image, то же самое изображение. Является в одном и том же изображение. Изображение выводится из недавно созданного контейнера. (Я тестировал в Интернете)
Код: Выделить всё
//image
var _pickedImage;
var _pickWebImage; //web test
PickedFile _image;
bool addImageSelete = false;
bool isWeb = false; //check platform
//image picker
final picker = ImagePicker();
//image container list (add press button)
List _detailImageList = [];
//image picker container list
Container(
height: isWeb ? 300 : MediaQuery.of(context).size.width * 2 / 5,
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceAround,
children: [
//Add image container
Expanded(
child: ListView.builder(
scrollDirection: Axis.horizontal,
shrinkWrap: true,
// physics: NeverScrollableScrollPhysics(),
itemBuilder: (context, index) {
return _detailImageList[index];
},
itemCount: _detailImageList.length,
),
),
],
),
),
//add image container list
_addButton(),
< /code>
Код виджета контейнер < /p>
Widget _detailImage() {
//test
PickedFile _detailImageFile;
return InkWell(
onTap: () async {
//alert (seleted 'add image' or 'remove image')
await _seletedDialogBox(context);
//after alert seleted
if (addImageSelete)
_getImage(_detailImageFile, source: ImageSource.gallery);
setState(() {
addImageSelete = false;
});
},
child: Container(
margin: EdgeInsets.symmetric(horizontal: 10),
width: MediaQuery.of(context).size.width * 2 / 5,
height: MediaQuery.of(context).size.width * 2 / 5,
child: _pickedImage == null
? Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text(
"Not Image Yet",
),
],
))
//output image
: isWeb
? _pickedImage
: Image.file(
_pickedImage,
fit: BoxFit.cover,
),
),
);
< /code>
} < /p>
метод Image_picker < /p>
Future _getImage(PickedFile imageTest, {ImageSource source}) async {
imageTest = await picker.getImage(source: source);
//test
setState(() {
if (imageTest != null) {
if (isWeb) {
_pickedImage = Image.network(
imageTest.path,
fit: BoxFit.cover,
);
} else {
_pickedImage = File(imageTest.path);
}
}
});
}
Я думаю, что image_picker следует создавать с помощью списка, подобного контейнеру, могу ли я узнать, как это сделать?
Спасибо.
Подробнее здесь:
https://stackoverflow.com/questions/698 ... one-screen
1746511963
Anonymous
Я собираюсь создать несколько контейнеров, которые могут содержать изображения. Этот контейнер изображения сделан для добавления через кнопку и ListView.Builder. Так что я пытаюсь поместить каждое изображение в этот контейнер изображения, но есть проблема. < /p> Когда изображение выбирается через Picker_Image, то же самое изображение. Является в одном и том же изображение. Изображение выводится из недавно созданного контейнера. (Я тестировал в Интернете)[code] //image var _pickedImage; var _pickWebImage; //web test PickedFile _image; bool addImageSelete = false; bool isWeb = false; //check platform //image picker final picker = ImagePicker(); //image container list (add press button) List _detailImageList = []; //image picker container list Container( height: isWeb ? 300 : MediaQuery.of(context).size.width * 2 / 5, child: Row( mainAxisAlignment: MainAxisAlignment.spaceAround, children: [ //Add image container Expanded( child: ListView.builder( scrollDirection: Axis.horizontal, shrinkWrap: true, // physics: NeverScrollableScrollPhysics(), itemBuilder: (context, index) { return _detailImageList[index]; }, itemCount: _detailImageList.length, ), ), ], ), ), //add image container list _addButton(), < /code> Код виджета контейнер < /p> Widget _detailImage() { //test PickedFile _detailImageFile; return InkWell( onTap: () async { //alert (seleted 'add image' or 'remove image') await _seletedDialogBox(context); //after alert seleted if (addImageSelete) _getImage(_detailImageFile, source: ImageSource.gallery); setState(() { addImageSelete = false; }); }, child: Container( margin: EdgeInsets.symmetric(horizontal: 10), width: MediaQuery.of(context).size.width * 2 / 5, height: MediaQuery.of(context).size.width * 2 / 5, child: _pickedImage == null ? Center( child: Column( mainAxisAlignment: MainAxisAlignment.center, children: [ Text( "Not Image Yet", ), ], )) //output image : isWeb ? _pickedImage : Image.file( _pickedImage, fit: BoxFit.cover, ), ), ); < /code> } < /p> метод Image_picker < /p> Future _getImage(PickedFile imageTest, {ImageSource source}) async { imageTest = await picker.getImage(source: source); //test setState(() { if (imageTest != null) { if (isWeb) { _pickedImage = Image.network( imageTest.path, fit: BoxFit.cover, ); } else { _pickedImage = File(imageTest.path); } } }); } [/code] Я думаю, что image_picker следует создавать с помощью списка, подобного контейнеру, могу ли я узнать, как это сделать? Спасибо. Подробнее здесь: [url]https://stackoverflow.com/questions/69842550/flutter-how-to-use-multiple-images-pickers-on-one-screen[/url]