Flutter中stack的children声明有啥区别

Posted 2023-02-23

【中文标题】Flutter中stack的children声明有啥区别

【英文标题】：What's the difference between stack's children declaration in FlutterFlutter中stack的children声明有什么区别

【发布时间】：2019-11-09 11:10:09

【问题描述】：

我在我的代码中编写了 List 和 [items]。使用 [items] 时，动画可以正常工作，但在 List 的情况下，它根本不起作用。这两个声明有什么区别？

附：我是一个完全的新手。希望能得到一些帮助。

class _MyAppState extends State<MyApp> with TickerProviderStateMixin 
  List<Widget> cards = [];
  AnimationController _controller;
  double _point = 2.3;

  Widget _initCard(int index) 
    Animation _animLeft = Tween(begin: _point * index, end: _point * 8 * index)
        .animate(CurvedAnimation(parent: _controller, curve: Curves.linear))
          ..addListener(() 
            setState(() );
          );

    return Container(
      width: 50.0,
      height: 50.0,
      color: Colors.red
      margin: EdgeInsets.only(
          left: _animLeft.value.toDouble(),
    );
  

  @override
  void initState() 
    _controller = AnimationController(vsync: this, duration: Duration(seconds: 3));
    for (int i = 0; i < 5; ++i) 
      cards.add(_initCard(i));
    
    _controller.forward();
    super.initState();
  

  @override
  Widget build(BuildContext context) 
    return Scaffold(
        body: Container(
            width: 320,
            height: 520,
            color: Colors.deepOrange,
            child: Stack(
              overflow: Overflow.visible,
              children: cards,
      //         children: <Widget>[
      //           _initCard(0),
      //           _initCard(1),
      // ],
    )));
  

【问题讨论】：

你能把代码分享给我们，让我们看看你做了什么吗？

@override Widget build(BuildContext context) return Scaffold( body: Container( width: 320, height: 520, color: Colors.deepOrange, child: Stack( overflow: Overflow.visible, //孩子：卡片，孩子：[ _initCard(0), _initCard(1), _initCard(2), _initCard(3), _initCard(4), ], )));

P.S_2。很抱歉像这样过去了代码，但我不知道如何更改语法。

@seda 您应该将其粘贴到问题的正文中。

@alexpfx 我这样做了，但它显示了无法修复的语法错误，因为我遵循了 Flutter 的语法

【参考方案1】：

堆栈用于相对排列孩子。如果要显示某些数据的列表，请使用 Listview 或 Listview.Builder()。

或者

如果您只想使用 Stack，您可以使用 Position 和 Center 小部件显示数据

【讨论】：

我不需要 Listview.Builder()。我已经使用了 Positioned Widget 及其左参数，就像这样 left:animation.value。 animation.value 在其执行过程中反复变化，但小部件不会移动。这发生在编写 children:cards 的情况下，其中 cards 是 List 的类型。

好的，我认为问题是你在堆栈中使用了两个孩子。我有关于溢出的搜索。有时它不起作用。如果你想显示两种列表类型的东西..你可以在堆栈的孩子中使用 Column 。

谢谢。我们需要将小部件一个接一个地显示（如 Stack），而不是一个接一个。

这里可以看到代码截图。 [i.stack.imgur.com/NznrH.png] [i.stack.imgur.com/XhpB0.png]

如果我没记错的话。我认为你应该写cards[0]、cards[1]、..等等而不是initCards[0]。因为您已经在卡片列表中添加了 initCards 小部件。现在您必须将该列表元素称为堆栈子项。