flutter Dismissible 小部件变量依赖

Question

编辑：修复它.. 往下看

老问题：

我正在尝试使用 Dismissible 小部件。 我可以成功监控到方向的状态，存储在directionVar中。 它输出类似DismissDirection.endToStart

我想使用此信息来更改我显示的图标的位置。 删除项目时，背景为红色，右侧有一个图标。类似 Gmail 的东西。

Widget build(BuildContext context) {
        DismissDirection directionVar;
        return ListView.builder(
          itemBuilder: (BuildContext context, int index) {
            return Dismissible(
              key: Key(products[index]['title']), //Should be unique.
              onDismissed: (DismissDirection direction) {
                directionVar = direction;
              },

我的问题是这部分：

              background: Container(
                 color: Colors.red,
                padding: EdgeInsets.only(left: 20.0),
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.start,
                  children: <Widget>[
                    Icon(
                      Icons.delete,
                    )
                  ],
                ),
              ),);});}

我希望这部分根据directionVar 值进行更改。 padding 应根据 directionVar 的值以及 mainAxisAlignment 的值而变化。

类似的东西：

        if(directionVar == DismissDirection.endToStart){

        } else if (directionVar == DismissDirection.startToEnd){

        }

但我无法访问这些语句中的background: 和padding 属性，因为它们是Dismissible 小部件的属性，不能在onDismissed(){} 中更改

这似乎是一个简单的问题，但似乎无法解决。

编辑：修复它..非常简单..刚刚添加了这个：

   secondaryBackground: Container(
        color: Colors.red,
        padding: EdgeInsets.only(right: 20.0),
        child: Row(
          mainAxisAlignment: MainAxisAlignment.end,
          children: <Widget>[
            Icon(
              Icons.delete,
            )
          ],
        ),
      ),

Answer 1

有几种方法可以实现这一目标。例如，您可以创建一个动态处理方向的方法，然后在您的小部件树中相应地更新它。类似的东西

    List<dynamic> _resolveDirection(DismissDirection direction) {

    switch (direction) {
        case DismissDirection.endToStart:
          return [MainAxisAlignment.center, 20.0];
          break;
        case DismissDirection.startToEnd:
          return [MainAxisAlignment.start, 10.0];
          break;
        case DismissDirection.vertical:
          return [MainAxisAlignment.end, 5.0];
          break;
        // And so on...
        default:
          return [];
      }
    }

然后用

替换你的树

 background: Container(
                 color: Colors.red,
                padding: _resolveDirection(directionVar)[1],
                child: Row(
                  mainAxisAlignment: _resolveDirection(directionVar)[0],
                  children: <Widget>[
                    Icon(
                      Icons.delete,
                    )
                  ],
                ),
              ),);});}

最后，每次滑动时你要做的就是重建你的树并更新方向

setState(() => directionVar = direction);