0

我在应用程序 Flutter 上使用 o Slidable 并将其作为 ListTile 子项

到目前为止还可以。

我的问题是当我将它向左滑动时,文本会一直出现在屏幕上,如下图所示。(红色 == 标题)

在此处输入图像描述

目前,当我滑动时,文本被隐藏,如图所示。(红色 == 标题) 在此处输入图像描述

我看到当我刷这个属性改变状态Slidable.of(context)?.animation.isCompleted

而且我还验证了在我的ListTile的Row标题中,如果我把标题排成End,标题会通过滑动出现msm。

所以我想,当这个Slidable.of(context)?.animation.isCompleted属性改变状态时,我将我的行对齐到开始或结束。

但是我找不到监控这个属性的方法,所以当它发生变化时我可以重建我的行。我试图把它作为 Stream 但我没有成功。因为看起来它没有生成事件,它只是改变了值。

我不知道我该怎么做,如果有人有任何提示......

代码:

    @override
  Widget build(BuildContext) {
    return Slidable(
        key: const ValueKey(1),
        endActionPane: ActionPane(
          motion: const DrawerMotion(),
          children: [
            SlidableAction(
              onPressed: (ctx) => {
                Get.to(() => const CredentialOperationScreen(),
                    arguments:
                        RouteDetailCredential(itemCredential: itemCredential))
              },
              backgroundColor: ConstsColors.orangeAccent,
              foregroundColor: Colors.white,
              icon: Icons.info_outline,
            ),
            SlidableAction(
              onPressed: (ctx) => {
                Get.to(() => const CredentialOperationScreen(),
                    arguments:
                        RouteDeleteCredential(itemCredential: itemCredential))
              },
              backgroundColor: const Color.fromRGBO(219, 32, 32, 1),
              foregroundColor: Colors.white,
              icon: Icons.delete_outline,
            ),
          ],
        ),
        child: Builder(
          builder: (ctx) {
            return Container(
                child: _listTile(ctx),
                decoration: const BoxDecoration(
                    border: Border(
                        bottom:
                            BorderSide(color: ConstsColors.greyColorOpacity))));
          },
        ));
  }

  Widget _listTile(context) {
    return ListTile(
      title: Row(
        mainAxisAlignment: MainAxisAlignment.start,
        children: [
          Icon(
            itemCredential.icon,
            color: Colors.black,
          ),
          Padding(
            padding: const EdgeInsets.only(left: 8.0),
            child: Text(
              itemCredential.name,
              style: const TextStyle(
                fontFamily: 'Roboto',
                fontSize: 16,
              ),
            ),
          ),
        ],
      ),
      onTap: () => {
        Slidable.of(context)?.animation.isCompleted == true
            ? Slidable.of(context)?.close()
            : Slidable.of(context)?.openEndActionPane()
      },
      trailing: const Icon(Icons.check_circle_outline, color: Colors.green),
    );
  }
4

0 回答 0