Question

似乎Flutter不支持动态更改控制器值，或者我丢失了某些内容。我在Google上搜索了很多，但是找不到这个具体案例。

我要在这里实现的是在PageView中双击图像时将其放大2倍。

我尝试使用“变换”和图像本身的缩放比例，它可以工作，但视口不能很好地使用它，即图像被缩放，但是当左右滑动图像时，PageView可以更改页面。

为简单起见，这只是我的build方法，除了_viewportScale最初设置为1.0之外，除此之外没有什么。

@override
Widget build(BuildContext context) {
  this.controller = PageController(
    initialPage: 0,
    viewportFraction: _viewportScale,
  );
  return PageView(
    controller: controller,
    onPageChanged: (int pageIndex) {
      setState(() {
        _viewportScale = 1.0;
      });
    },
    children: this.urls.map((String url) {
        return Container(
          child: GestureDetector(
            child: Image.network(url),
            onTap: () => Navigator.pop(context),
            onDoubleTap: () {
              setState(() {
                _viewportScale = _viewportScale == 1.0 ? 2.0 : 1.0;
              });
            },
          ),
        );
      }).toList(),
  );
}

这里的问题是onDoubleTap失败，并带有异常：

I/flutter ( 6492): ══╡ EXCEPTION CAUGHT BY WIDGETS LIBRARY ╞═══════════════════════════════════════════════════════════
I/flutter ( 6492): The following assertion was thrown building NotificationListener<ScrollNotification>:
I/flutter ( 6492): Unexpected call to replaceSemanticsActions() method of RawGestureDetectorState.
I/flutter ( 6492): The replaceSemanticsActions() method can only be called outside of the build phase.
I/flutter ( 6492): 
I/flutter ( 6492): When the exception was thrown, this was the stack:
I/flutter ( 6492): #0      RawGestureDetectorState.replaceSemanticsActions.<anonymous closure> (package:flutter/src/widgets/gesture_detector.dart:737:9)
I/flutter ( 6492): #1      RawGestureDetectorState.replaceSemanticsActions (package:flutter/src/widgets/gesture_detector.dart:743:6)
I/flutter ( 6492): #2      ScrollableState.setSemanticsActions (package:flutter/src/widgets/scrollable.dart:379:40)
I/flutter ( 6492): #3      ScrollPosition._updateSemanticActions (package:flutter/src/widgets/scroll_position.dart:445:13)
I/flutter ( 6492): #4      ScrollPosition.notifyListeners (package:flutter/src/widgets/scroll_position.dart:695:5)
I/flutter ( 6492): #5      ScrollPosition.forcePixels (package:flutter/src/widgets/scroll_position.dart:318:5)
I/flutter ( 6492): #6      _PagePosition.viewportFraction= (package:flutter/src/widgets/page_view.dart:263:7)
I/flutter ( 6492): #7      PageController.attach (package:flutter/src/widgets/page_view.dart:173:18)
I/flutter ( 6492): #8      ScrollableState.didUpdateWidget (package:flutter/src/widgets/scrollable.dart:356:26)
I/flutter ( 6492): #9      StatefulElement.update (package:flutter/src/widgets/framework.dart:3884:58)
I/flutter ( 6492): #10     Element.updateChild (package:flutter/src/widgets/framework.dart:2752:15)
I/flutter ( 6492): #11     ComponentElement.performRebuild (package:flutter/src/widgets/framework.dart:3752:16)
I/flutter ( 6492): #12     Element.rebuild (package:flutter/src/widgets/framework.dart:3564:5)
I/flutter ( 6492): #13     StatelessElement.update (package:flutter/src/widgets/framework.dart:3801:5)
I/flutter ( 6492): #14     Element.updateChild (package:flutter/src/widgets/framework.dart:2752:15)
I/flutter ( 6492): #15     ComponentElement.performRebuild (package:flutter/src/widgets/framework.dart:3752:16)
I/flutter ( 6492): #16     Element.rebuild (package:flutter/src/widgets/framework.dart:3564:5)
I/flutter ( 6492): #17     StatefulElement.update (package:flutter/src/widgets/framework.dart:3899:5)
I/flutter ( 6492): #18     Element.updateChild (package:flutter/src/widgets/framework.dart:2752:15)
I/flutter ( 6492): #19     ComponentElement.performRebuild (package:flutter/src/widgets/framework.dart:3752:16)
I/flutter ( 6492): #20     Element.rebuild (package:flutter/src/widgets/framework.dart:3564:5)
I/flutter ( 6492): #21     BuildOwner.buildScope (package:flutter/src/widgets/framework.dart:2277:33)
I/flutter ( 6492): #22     _WidgetsFlutterBinding&BindingBase&GestureBinding&ServicesBinding&SchedulerBinding&PaintingBinding&SemanticsBinding&RendererBinding&WidgetsBinding.drawFrame (package:flutter/src/widgets/binding.dart:700:20)
I/flutter ( 6492): #23     _WidgetsFlutterBinding&BindingBase&GestureBinding&ServicesBinding&SchedulerBinding&PaintingBinding&SemanticsBinding&RendererBinding._handlePersistentFrameCallback (package:flutter/src/rendering/binding.dart:275:5)
I/flutter ( 6492): #24     _WidgetsFlutterBinding&BindingBase&GestureBinding&ServicesBinding&SchedulerBinding._invokeFrameCallback (package:flutter/src/scheduler/binding.dart:990:15)
I/flutter ( 6492): #25     _WidgetsFlutterBinding&BindingBase&GestureBinding&ServicesBinding&SchedulerBinding.handleDrawFrame (package:flutter/src/scheduler/binding.dart:930:9)
I/flutter ( 6492): #26     _WidgetsFlutterBinding&BindingBase&GestureBinding&ServicesBinding&SchedulerBinding._handleDrawFrame (package:flutter/src/scheduler/binding.dart:842:5)
I/flutter ( 6492): #30     _invoke (dart:ui/hooks.dart:209:10)
I/flutter ( 6492): #31     _drawFrame (dart:ui/hooks.dart:168:3)
I/flutter ( 6492): (elided 3 frames from package dart:async)
I/flutter ( 6492): ════════════════════════════════════════════════════════════════════════════════════════════════════

手指交叉以轻松解决...：）

Answer 1

如果您想更改 PageController() 中的最终变量，只需将其分配给您的 pageController 其他 PageController() 实例。

PageController pageController = PageController(
    viewportFraction: 0.8,
);

PageView.builder(
    controller: pageController,
    itemCount: 3,
    scrollDirection: Axis.horizontal,
    itemBuilder: (context, index) => OrderCard(order: state.orders[index]),
)

现在，当您想要更改 viewportFractional 时，将新的 PageController() 分配为其他 viewportFractional 值。

@override
  void initState() {
    Future.delayed(Duration(seconds: 9), () {
      pageController = PageController(viewportFraction: 1);
    });
    super.initState();
}

完整示例：

import 'package:flutter/material.dart';

void main() => runApp(MyHomePage());

class MyHomePage extends StatefulWidget {
  const MyHomePage();

  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  PageController pageController = PageController(
    viewportFraction: 0.8,
  );

  @override
  void initState() {
    Future.delayed(Duration(seconds: 9), () {
      pageController = PageController(viewportFraction: 1);
    });
    super.initState();
  }

  Widget build(BuildContext context) {
    return PageView.builder(
      controller: pageController,
      itemCount: 3,
      scrollDirection: Axis.horizontal,
      itemBuilder: (context, index) => Text('Page $index'),
    );
  }
}

Answer 2

临时解决方案会在page的结束位置添加多余的PageView。

在PageController中动态更改viewportFraction

2 个答案: