ParentDataWidget 的错误使用。- 如何解决？

Question

我在使用 ParentDataWidget 时遇到错误。

import 'package:flutter/material.dart';
import 'package:font_awesome_flutter/font_awesome_flutter.dart';
import 'package:testapp/constants.dart';
import 'package:testapp/request/quotation_resources.dart';
import 'dart:math';

class AuctionDetails extends StatelessWidget {
  final QuotationResources quotationResources;

  const AuctionDetails({Key key, this.quotationResources}) : super(key: key);
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: kPrimaryColor,
      appBar: buildAppBar,
      body: BodyAuction(),
    );
  }

  AppBar get buildAppBar {
    return AppBar(
      backgroundColor: kBackgroundColor,
      elevation: 0,
      leading: Padding(
        padding: EdgeInsets.only(left: kDefaultPadding),
        child:
            IconButton(icon: Icon(FontAwesomeIcons.backward), onPressed: () {}),
      ),
    );
  }
}

class BodyAuction extends StatelessWidget {
  final QuotationResources quotationResources;

  const BodyAuction({Key key, this.quotationResources}) : super(key: key);
  @override
  Widget build(BuildContext context) {
    Size size = MediaQuery.of(context).size;
    var cardAspectRatio = 10.0 / 14.0;
    var widgetAspectRatio = cardAspectRatio * 1.2;
    return Column(
      children: <Widget>[
        Container(
          padding: EdgeInsets.symmetric(horizontal: kDefaultPadding),
          decoration: BoxDecoration(
            color: kBackgroundColor,
            borderRadius: BorderRadius.only(
              bottomLeft: Radius.circular(50),
              bottomRight: Radius.circular(50),
            ),
          ),
          child: Column(
            children: <Widget>[
              Container(
                margin: EdgeInsets.symmetric(vertical: kDefaultPadding),
                height: size.width * 0.8,
                child: CardSlider(),
              ),
            ],
          ),
        ),
      ],
    );
  }
}

class CardSlider extends StatefulWidget {
  @override
  _CardSliderState createState() => _CardSliderState();
}

var cardAspectRatio = 10.0 / 14.0;
var widgetAspectRatio = cardAspectRatio * 1.2;

class _CardSliderState extends State<CardSlider> {
  var currentPage = images.length - 1.0;
  @override
  Widget build(BuildContext context) {
    PageController controller = PageController(initialPage: images.length - 1);
    controller.addListener(() {
      setState(() {
        currentPage = controller.page;
      });
    });
    return Column(
      children: <Widget>[
        CardScrollWidget(currentPage),
        Positioned.fill(
          child: PageView.builder(
            itemCount: images.length,
            controller: controller,
            reverse: true,
            itemBuilder: (context, index) {
              return Container();
            },
          ),
        )
      ],
    );
  }
}

class CardScrollWidget extends StatelessWidget {
  var currentPage;
  var padding = 20.0;
  var verticalInset = 20.0;

  CardScrollWidget(this.currentPage);

  @override
  Widget build(BuildContext context) {
    return new AspectRatio(
      aspectRatio: widgetAspectRatio,
      child: LayoutBuilder(builder: (context, contraints) {
        var width = contraints.maxWidth;
        var height = contraints.maxHeight;

        var safeWidth = width - 2 * padding;
        var safeHeight = height - 2 * padding;

        var heightOfPrimaryCard = safeHeight;
        var widthOfPrimaryCard = heightOfPrimaryCard * cardAspectRatio;

        var primaryCardLeft = safeWidth - widthOfPrimaryCard;
        var horizontalInset = primaryCardLeft / 2;

        List<Widget> cardList = new List();

        for (var i = 0; i < images.length; i++) {
          var delta = i - currentPage;
          bool isOnRight = delta > 0;

          var start = padding +
              max(
                  primaryCardLeft -
                      horizontalInset * -delta * (isOnRight ? 15 : 1),
                  0.0);

          var cardItem = Positioned.directional(
            top: padding + verticalInset * max(-delta, 0.0),
            bottom: padding + verticalInset * max(-delta, 0.0),
            start: start,
            textDirection: TextDirection.rtl,
            child: ClipRRect(
              borderRadius: BorderRadius.circular(16.0),
              child: Container(
                decoration: BoxDecoration(color: Colors.white, boxShadow: [
                  BoxShadow(
                      color: Colors.black12,
                      offset: Offset(3.0, 6.0),
                      blurRadius: 10.0)
                ]),
                child: AspectRatio(
                  aspectRatio: cardAspectRatio,
                  child: Stack(
                    fit: StackFit.expand,
                    children: <Widget>[
                      Image.asset(images[i], fit: BoxFit.cover),
                      Align(
                        alignment: Alignment.bottomLeft,
                      )
                    ],
                  ),
                ),
              ),
            ),
          );
          cardList.add(cardItem);
        }
        return Stack(
          children: cardList,
        );
      }),
    );
  }
}

错误代码是

The following assertion was thrown while applying parent data.:
Incorrect use of ParentDataWidget.

The ParentDataWidget Positioned(left: 0.0, top: 0.0, right: 0.0, bottom: 0.0) wants to apply ParentData of type StackParentData to a RenderObject, which has been set up to accept ParentData of incompatible type FlexParentData.

Usually, this means that the Positioned widget has the wrong ancestor RenderObjectWidget. Typically, Positioned widgets are placed directly inside Stack widgets.
The offending Positioned is currently placed inside a Column widget.

The ownership chain for the RenderObject that received the incompatible parent data was:
  _ScrollSemantics-[GlobalKey#8af92] ? Scrollable ? NotificationListener<ScrollNotification> ? PageView ? Positioned ? Column ? CardSlider ? ConstrainedBox ? Padding ? Container ? ?
When the exception was thrown, this was the stack: 
#0      RenderObjectElement._updateParentData.<anonymous closure> (package:flutter/src/widgets/framework.dart:5645:11)
#1      RenderObjectElement._updateParentData (package:flutter/src/widgets/framework.dart:5661:6)
#2      RenderObjectElement.attachRenderObject (package:flutter/src/widgets/framework.dart:5682:7)
#3      RenderObjectElement.mount (package:flutter/src/widgets/framework.dart:5376:5)
#4      SingleChildRenderObjectElement.mount (package:flutter/src/widgets/framework.dart:5829:11)
...

Answer 1

错误代码已经显示出了什么问题。“定位小部件直接放置在堆栈小部件内。有问题的定位当前放置在一个列小部件内。” 您必须将 Positioned Widget 放置在 Stacks 中。你不能把它们放在一个列中。

Column(
      children: <Widget>[
        CardScrollWidget(currentPage),
        Positioned.fill(
          child: PageView.builder(
            itemCount: images.length,
            controller: controller,
            reverse: true,
            itemBuilder: (context, index) {
              return Container();
            },
          ),
        )
      ],
    );

只需用 Stack 替换 Column 或不要使用 Positioned.fill。