Question

我正在使用Slidable小部件，该小部件效果很好，但是在滑动容器时出现了奇怪的行为。这是代码和GIF，用于显示不应出现的垂直线。

编辑：我在朋友列表中使用此幻灯片功能。因此，我在循环内调用createSlidable（）。在Slidable Widget中，还有另一种方法来创建子容器getFriendContainer（）。

  Widget getFriendContainer(Friend friend, int i) {
    return Container(
      padding: const EdgeInsets.only(left: 10.0, right: 10.0, top: 20, bottom: 10.0),
      decoration: BoxDecoration(
        color: Color.fromRGBO(13, 13, 56, 1.0),
        borderRadius: i==0 ? BorderRadius.only(
          topLeft: Radius.circular(25.0),
          topRight: Radius.circular(25.0),
        ) : null,
      ),
    child: Row(
      children: <Widget>[
        Expanded(
          flex: 15,
          child: Column(
            children: <Widget>[
              Container(
                padding: const EdgeInsets.all(9.0),
                height: 40.0,
                decoration: BoxDecoration(
                  shape: BoxShape.circle,
                  border: Border.all(color: Color.fromRGBO(119, 119, 136, 1.0), width: 0.5),
                ),
                child: Image.asset('assets/icon.png', width: 70.0, height: 70.0, color:  Color.fromRGBO(119, 119, 136, 1.0),),
              ),
            ],
          ),
        ),
        Expanded(
          flex: 70,
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: <Widget>[
              Container(
                  padding: const EdgeInsets.only(left: 10.0),
                  child: Text(
                    "${friend.name}",
                    style: TextStyle(
                      fontWeight: FontWeight.w500,
                      fontSize: 14.0,
                      color: Colors.white,
                    ),
                  )
              ),
            ],
          ),
        ),
        Expanded(
          flex: 15,
          child: friend.muted ? friendMutedIcon(friend) : Container(),
        ),
      ],
      ),
    );
}

Widget createSlidable(Friend friend, int i) {
    return Slidable(
      actionPane: SlidableDrawerActionPane(),
      controller: _slidableController,
      actionExtentRatio: 0.15,
      child: ...,
      secondaryActions: <Widget>[
        SlideAction(
          color: getFriendContainer(Friend friend, int i),
          onTap: () {

          },
          child: Container(
            height: 50.0,
            width: 100.0,
            decoration: BoxDecoration(
              color: ...,
              borderRadius: BorderRadius.only(
                topLeft: const Radius.circular(25.0),
                bottomLeft: const Radius.circular(25.0),
              ),
            ),
            child: Icon(Icons.volume_off, color: ...,),
          ),
        ),
        SlideAction(
          color: ...,
          onTap: () {

          },
          child: Container(
            height: 50.0,
            width: 100.0,
            color: ...,
            child: Icon(Icons.delete, color: ...,),
          ),
        ),
      ],
    );
}

我将不胜感激。

Answer 1

我为此找到了解决方案。使用openssl enc小部件而不是IconSlideAction，问题得到解决。

滑动小部件在滑动时显示垂直线-Flutter_slidable

1 个答案: