Flutter package滑动宽度

dm7nw8vv 于 2023-06-07 发布在 Flutter

关注(0)|答案(2)|浏览(251)

我使用flutter_slidable: ^1.2.0封装，我如何调整SlidableAction的宽度？它能编辑半径吗使用BorderRadius，可能是圆形
如果我按下删除按钮，我想运行解除动画功能，如何？

这里是完整的代码

for (var i = 0; i < c.noteList.length; i++)
                  Slidable(
                    key: ValueKey(
                      c.noteList[i]['id'],
                    ),
                    startActionPane: ActionPane(
                      motion: StretchMotion(),
                      dismissible: DismissiblePane(
                        onDismissed: () {
                          handleDeleteSet(
                            c.noteList[i]['id'],
                          );
                        },
                      ),
                      children: [
                        SlidableAction(
                          onPressed: (context) {},
                          backgroundColor: Colors.red,
                          foregroundColor: Colors.white,
                          icon: Icons.delete,
                          label: 'Delete',
                        ),
                      ],
                    ),
                    child: NoteTile(
                      index: i + 1,
                      item: c.noteList[i],
                      deleteItem: (id) {
                        handleDeleteSet(id);
                      },
                      onSaveData: () {
                        saveData();
                      },
                    ),
                  ),

flutter

来源：https://stackoverflow.com/questions/71793578/flutter-package-slidable-width

2条答案

按热度按时间

btxsgosb1#

要编辑可滑动区域的宽度，您应该使用extentRatio参数，该参数接受大于0且小于1的双精度值：

ActionPane(
    extentRatio: 0.7,
    motion: const ScrollMotion(),
    children: []
),

对于半径，只需使用Container和decoration参数：

ActionPane(
    extentRatio: 0.7,
    motion: const ScrollMotion(),
    children: [
      Container(
        height: 180,
        width: width(context, 60),
        decoration: BoxDecoration(
          color: Colors.transparent,
          borderRadius: const BorderRadius.only(
            topLeft: Radius.circular(10),
            bottomLeft: Radius.circular(10),
          ),
        ),
      )
    ]
)

赞(0）回复(0）举报 2023-06-07

6ie5vjzr2#

您的答案将解决问题，但它会导致另一个错误“不正确的父窗口小部件...”
enter image description here

赞(0）回复(0）举报 2023-06-07