我需要修复相机图标,并且从图库中选择的任何图像都可以滚动。因此,我将第一个单元格用于相机按钮,将其余单元格用于单个子可滚动。但是当用户选择图像然后滚动滚动条时,将适用于所有行,而不仅仅是图像。
单子滚动条的代码是:
class SelectedImagesWidget extends GetView<AddProductController> {
const SelectedImagesWidget({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return Obx(
() => (controller.images.isEmpty)
? const SizedBox.shrink()
: SingleChildScrollView(
scrollDirection: Axis.horizontal,
clipBehavior: Clip.none,
child: SizedBox(
height: 80,
child: ListView.builder(
itemCount: controller.images.length,
scrollDirection: Axis.horizontal,
physics: const NeverScrollableScrollPhysics(),
shrinkWrap: true,
itemBuilder: (context, index) {
print("Assets= ${controller.images[index].name}");
Asset asset = controller.images[index];
return Stack(
clipBehavior: Clip.none,
children: [
Card(
color: Colors.amber,
clipBehavior: Clip.hardEdge,
child: AssetThumb(
asset: asset,
width: 300,
height: 300,
),
),
Positioned(
right: 0,
top: -5,
child: InkWell(
onTap: () => controller.deleteImage(index),
child: const CircleAvatar(
child: Icon(
Icons.delete_outlined,
size: 18,
),
backgroundColor: Colors.red,
radius: 12,
),
),
),
],
);
},
),
),
),
);
}
}
该行的代码包含相机按钮,图像是:
class ImagePickerWidget extends StatelessWidget {
const ImagePickerWidget();
@override
Widget build(BuildContext context) {
return Row(
children: [
IconButton(
onPressed: () async =>
await Get.find<AddProductController>().pickImgFromGallery(),
icon: const Icon(Icons.add_a_photo),
),
const Expanded(
flex: 5,
child: SelectedImagesWidget(),
),
],
);
}
}