0

我正在尝试从 Instagram 重新创建 MediaPicker。

此屏幕的当前结构如下所示:

    return Scaffold(
      appBar: buildAppBar(context),
      body: PageView(
        physics: NeverScrollableScrollPhysics(), //disable the "normal" pageview scrolling
        onPageChanged: (index) {
          setState(() {
            pageIndex = index;
          });
        },
        controller: pageController,
        children: [
          Column(
            children: [
              Expanded(
                flex: 3,
                child: buildPreviewWidget(selection, _buildCropPreview), //this cropview has a gesture recognizer on it
              ),
              const SizedBox(height: 2),
              Expanded(
                  flex: 2,
                  child: GestureDetector(
                    onHorizontalDragStart: (details) {
                      double offset = screenWidth - details.localPosition.dx;
                      pageController.jumpTo(offset);
                    },
                    onHorizontalDragUpdate: (details) {
                      double offset = screenWidth - details.localPosition.dx;
                      pageController.jumpTo(offset);
                    },
                    child:MediaGrid( //this is the media grid
                            allowMultiSelection: multiSelectable,
                            collection: allCollection),
                  )),
            ],
          ),
          CameraScreen(),
        ],
      ),
      bottomNavigationBar: buildBottomNavigationBar(),
    );
  

最初的问题是,每当我在裁剪视图中拖动时,都会触发页面视图的滑动手势,这不是我想要的。

所以我的想法是禁用标准的滚动方式,NeverScrollableScrollPhysics()然后只MediaGrid()用 a包裹,GestureRecognizer()这样我就可以在 PageViews 的帮助下实现相同的滑动动画,pageController.jumpTo()但只能在MediaGrid()

但是我的实现似乎很糟糕,因为页面浏览量像这样结结巴巴

https://imgur.com/a/EzabR7w

我如何平滑口吃,或者有更好的方法来实现这一点?

4

0 回答 0