0

我需要修复相机图标,并且从图库中选择的任何图像都可以滚动。因此,我将第一个单元格用于相机按钮,将其余单元格用于单个子可滚动。但是当用户选择图像然后滚动滚动条时,将适用于所有行,而不仅仅是图像。

单子滚动条的代码是:

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(),
        ),
      ],
    );
  }
}
4

0 回答 0