繁体   English   中英

可关闭的小部件:仅在点击按钮时关闭小部件

[英]Dismissible widget: dismiss widget only when tapping a button

我正在尝试使用 dismissible 小部件仅在按下按钮时才被解雇,而不是通过滑动。 有什么方法可以实现这一点,或者使用 Dismissible 小部件不可能做到这一点(或者我可能必须使用自定义动画或类似的东西来实现我自己的小部件)?

关于如何实现这一目标的任何想法?

我尝试将方向设置更改为 DismissDirection.none 以防止滑动。 那行得通,但是我不知道如何在按下按钮时让它消失。 我希望 Dismissible 会有某种 controller 参数,但它没有。

class MyHomePage extends StatefulWidget {
  const MyHomePage({Key? key}) : super(key: key);
  
  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: Dismissible(
          key: UniqueKey(),
          direction: DismissDirection.none, // This prevents it from being swiped
          child: Container(
            width: 300.0,
            height: 100.0,
            color: Colors.blue,
          )
        ),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: () {}, // I want this to somehow dismiss the Dismissible widget when this is pressed
      ),
    );
  }
}

(我在这里看到了一个类似的问题,但答案并没有解决我的问题,因为我没有尝试实现一个出现在屏幕上的类似通知的小部件。我试图关闭一个出现在我的应用程序的主体。)

Dismissible(
  key: ValueKey(id),
  background: Container(
    color: Theme.of(context).errorColor,
    child: Icon(
      Icons.delete,
      color: Colors.white,
      size: 40,
    ),
    alignment: Alignment.centerRight,
    padding: EdgeInsets.only(right: 20),
  ),
  direction: DismissDirection.endToStart,
  confirmDismiss: (direction) => showDialog(
    context: context,
    builder: ((context) => AlertDialog(
          title: Text('Are you sure?'),
          content: Text('Do you want to remove item from the cart'),
          actions: [
            TextButton(
                onPressed: () => Navigator.of(context).pop(false),
                child: Text('No')),
            TextButton(
                onPressed: () => Navigator.of(context).pop(true),
                child: Text('Yes'))
          ],
        )),
  ),
  onDismissed: (direction) {
    Provider.of<Cart>(context, listen: false).removeItem(productId);
  },
  child: Card(
    margin: EdgeInsets.symmetric(
      horizontal: 15,
      vertical: 4,
    ),
    child: Padding(
      padding: EdgeInsets.all(8),
      child: ListTile(
        leading: CircleAvatar(
            child: Padding(
                padding: EdgeInsets.all(5),
                child: FittedBox(child: Text('\$ $price')))),
        title: Text(title),
        subtitle: Text('Total: \$ ${(price * quantity)}'),
        trailing: Text('$quantity x'),
      ),
    ),
  ),
);



this might help, there's a on dismissed method which you need to apply,and inside the action list, you will get two button i.e yes or no, where you can perform your action.

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM