Flutter 中的 onPressed 属性

在 Flutter 中，onPressed 属性用于为按钮、图标等交互式元素提供响应函数。该属性接收一个回调函数，在用户点击该元素时执行该函数。

示例代码

ElevatedButton(
  onPressed: () {
    // 响应函数代码
  },
  child: Text('点击'),
)

传递上下文

常常需要在 onPressed 回调函数中获取当前组件的上下文，以进行导航、显示 SnackBar 等操作。可以通过以下两种方式传递上下文：

1. 匿名函数中传递

ElevatedButton(
  onPressed: () {
    Navigator.push(context, MaterialPageRoute(builder: (context) => NextPage()));
  },
  child: Text('跳转'),
)

2. 使用 GlobalKey 获取组件引用

final GlobalKey<ScaffoldState> _scaffoldKey = GlobalKey<ScaffoldState>();

Scaffold(
  key: _scaffoldKey,
  body: ElevatedButton(
    onPressed: () {
      _scaffoldKey.currentState.showSnackBar(SnackBar(content: Text('SnackBar')));
    },
    child: Text('显示 SnackBar'),
  ),
);

颤动

在用户点击按钮时添加震动反馈可以增强用户体验。可以使用 vibrate 插件来实现这个功能。

import 'package:vibrate/vibrate.dart';

ElevatedButton(
  onPressed: () {
    Vibrate.vibrate(duration: 100);
    // 响应函数代码
  },
  child: Text('点击'),
)

以上就是 onPressed 属性的用法及其相关注意事项。