flutter - Flutter图片浏览时删除图片怎样跳转下一张？

Question

新人正在学习Flutter，使用wechat_assets_picker上传多张图片，使用extended_image做图片浏览，浏览图片时，删除单张图片后extended_image怎样跳转到下一张图片？

post.dart页面代码：

import 'dart:io';import 'package:extended_image/extended_image.dart';import 'package:flutter/material.dart';import 'package:wechat_assets_picker/wechat_assets_picker.dart';class Post extends StatefulWidget {  const Post({super.key});  @override  State<Post> createState() => _PostState();}class _PostState extends State<Post> {  //  已选中图片列表  List<AssetEntity> selectedAssets = [];  // 相册图片初始化索引  int currentIndex = 0;  /// 从相册选取图片  pickImage(BuildContext context) async {    final List<AssetEntity>? result = await AssetPicker.pickAssets(      context,      pickerConfig: AssetPickerConfig(        maxAssets: 4,        requestType: RequestType.image,        textDelegate: const AssetPickerTextDelegate(),        selectedAssets: selectedAssets      ),    );    if (result != null) {      setState(() {        selectedAssets = result;      });    }  }  /// 上传的图片列表（小图预览）  Widget _imagesList() {    return LayoutBuilder(        builder: (BuildContext context, BoxConstraints constraints) {          final double width = (constraints.maxWidth - 5 * 3) / 4;          return Wrap(            spacing: 5,            children: [              for (final asset in selectedAssets)                InkWell(                  onTap: () {                    setState(() {                      currentIndex = selectedAssets.indexOf(asset);                    });                    Get.to(() => gallery()); // 单击单张缩略图进入预览组件                  },                  child: Container(                    clipBehavior: Clip.antiAlias,                    decoration: BoxDecoration(                        borderRadius: BorderRadius.circular(5)                    ),                    child: AssetEntityImage(                      asset,                      width: width,                      height: width,                      fit: BoxFit.cover,                      isOriginal: false, //是否原图，否                    ),                  ),                ),              if(selectedAssets.length < 4)                InkWell(                  onTap: () => pickImage(context),                  child: Container(                    width: width,                    height: width,                    decoration: BoxDecoration(                        color: const Color.fromRGBO(242, 242, 244, 1),                        borderRadius: BorderRadius.circular(5)                    ),                    child: const Icon(Fonts.tianjia, color: Color.fromRGBO(178, 178, 180, 1)),                  ),                )            ],          );        }    );  }  // 图片浏览  Widget gallery() {    return Scaffold(      extendBodyBehindAppBar: true,      appBar: AppBar(        title: Row(          crossAxisAlignment: CrossAxisAlignment.baseline,          textBaseline: TextBaseline.alphabetic,          mainAxisAlignment: MainAxisAlignment.spaceBetween,          children: [            InkWell(                onTap: () => Get.back(),                child: const Icon(Fonts.fanhui)            ),            // 删除按钮            InkWell(              onTap: () {                setState(() {                  selectedAssets.remove(selectedAssets[currentIndex]);                });                //当选中的图片被删除干净后，关掉图片查看器                if(selectedAssets.isEmpty) {                  Get.back();                }              },              child: const Icon(Fonts.shanchu, size: 20, color: Color.fromRGBO(50, 50, 52, 1)),            ),          ],        ),      ),      body: ExtendedImageGesturePageView.builder(          controller: ExtendedPageController(            // 传入图片初始位置            initialPage: currentIndex,          ),          onPageChanged: (int index) {            setState(() {              currentIndex = index;            });          },          itemCount: selectedAssets.length,          itemBuilder: (BuildContext context, int index) {            AssetEntity item = selectedAssets[index];            return ExtendedImage(              image: AssetEntityImageProvider(                  item,                  isOriginal: true              ),              fit: BoxFit.cover,              mode: ExtendedImageMode.gesture,              clearMemoryCacheWhenDispose: true,              initGestureConfigHandler: ((state) {                return GestureConfig(                    minScale: 0.9,                    maxScale: 3.0,                    animationMinScale: 0.7,                    animationMaxScale: 3.5,                    speed: 1.0,                    inertialSpeed: 100.0,                    initialScale: 1.0,                    inPageView: true                );              }),            );          }      ),    );  }  @override  Widget build(BuildContext context) {    return Scaffold(      body: Column(        crossAxisAlignment: CrossAxisAlignment.start,        children: _imagesList()      )    );  }}

目前能正常删除已选中的图片，但是在删除成功后，图片查看器没办法自动转到在一张图片。

Answer 1

假如当前在第1页，执行setState((){selectedAssets.remove(selectedAssets[currentIndex]);  }); 后就会显示第2页的内容 ；代码应该没有问题的     

class Chome extends StatefulWidget {  const Chome({super.key});  @override  State<Chome> createState() => _ChomeState();}class _ChomeState extends State<Chome> {  var currentIndex = 0;  var selectedAssets = [    'A',    'B',    'C',  ];  PageController ctl = PageController(initialPage: 0);  @override  Widget build(BuildContext context) {    return Scaffold(      extendBodyBehindAppBar: true,      appBar: AppBar(        title: Row(          crossAxisAlignment: CrossAxisAlignment.baseline,          textBaseline: TextBaseline.alphabetic,          mainAxisAlignment: MainAxisAlignment.spaceBetween,          children: [            InkWell(onTap: () => () {}, child: const Icon(Icons.arrow_back)),            InkWell(              onTap: () {                setState(() {                  selectedAssets.remove(selectedAssets[currentIndex]);                });              },              child: const Icon(                Icons.delete,              ),            ),          ],        ),      ),      body: ExtendedImageGesturePageView.builder(          controller: ctl,          onPageChanged: (int index) {            setState(() {              currentIndex = index;            });          },          itemCount: selectedAssets.length,          itemBuilder: (BuildContext context, int index) {            return Center(              child: Container(                color: Colors.grey,                child: Text(                  'Page: ${selectedAssets[index]}',                  style: const TextStyle(color: Colors.red, fontSize: 40),                ),              ),            );          }),    );  }

看看这个例子是有改变的