flutter VoidCallBack ValueChange<T> 的函数定义

在 Flutter 中,VoidCallbackValueChanged<T> 是两种常用的回调函数类型,它们通常用于处理事件或传递数据。下面是它们的详细定义及使用方式。

1. VoidCallback 函数类型

VoidCallback 是一个没有参数也没有返回值的回调函数类型。它通常用于简单的事件处理,比如按钮点击、切换状态等。

定义:

dart 复制代码
typedef VoidCallback = void Function();
  • VoidCallback 表示一个没有参数和返回值的回调函数。
  • 这种类型通常用于 UI 控件的事件(如点击、拖动等)。

示例:使用 VoidCallback 处理按钮点击

dart 复制代码
import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(title: Text('VoidCallback Example')),
        body: Center(
          child: MyButton(
            onPressed: () {
              print('Button pressed!');
            },
          ),
        ),
      ),
    );
  }
}

// 自定义按钮组件
class MyButton extends StatelessWidget {
  final VoidCallback onPressed; // VoidCallback 类型的回调

  MyButton({required this.onPressed});

  @override
  Widget build(BuildContext context) {
    return ElevatedButton(
      onPressed: onPressed, // 触发 onPressed 回调
      child: Text('Press Me'),
    );
  }
}

在这个例子中:

  • MyButton 组件接收一个 VoidCallback 类型的 onPressed 参数。
  • 当按钮被点击时,onPressed 回调函数被执行,打印消息。

2. ValueChanged 函数类型

ValueChanged<T> 是一个带有一个类型为 T 参数的回调函数类型,并且没有返回值。它通常用于将数据传递给父组件,处理用户输入或组件状态的变化。

定义:

dart 复制代码
typedef ValueChanged<T> = void Function(T value);
  • ValueChanged 表示一个接受类型为 T 的参数,并且没有返回值的回调函数。
  • T 是类型参数,表示这个回调函数接受的数据类型可以是任意类型。

示例:使用 ValueChanged 处理输入变化

dart 复制代码
import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(title: Text('ValueChanged Example')),
        body: Center(
          child: MyTextField(
            onChanged: (text) {
              print('Text changed: $text');
            },
          ),
        ),
      ),
    );
  }
}

// 自定义文本输入框组件
class MyTextField extends StatelessWidget {
  final ValueChanged<String> onChanged; // ValueChanged 类型的回调

  MyTextField({required this.onChanged});

  @override
  Widget build(BuildContext context) {
    return TextField(
      onChanged: onChanged, // 触发 onChanged 回调
      decoration: InputDecoration(
        labelText: 'Enter something',
      ),
    );
  }
}

在这个例子中:

  • MyTextField 组件接收一个 ValueChanged 类型的 onChanged 回调函数。
  • 每当文本框内容变化时,onChanged 被触发,新的文本值被传递给父组件。
相关推荐
大龄秃头程序员1 小时前
一次 Flutter 动画 Demo 的整理与复盘
flutter
AlexMaybeBot5 小时前
躺在沙发上开发 Openclaw 的移动端APP
前端·flutter
天空之城--5 小时前
Android Flutter行业动态与学习参考(2026年8月)
android·flutter
FungLeo6 小时前
Flutter Web token 存储陷阱:crypto.subtle 在非安全上下文失效排查实录
前端·安全·flutter
FungLeo7 小时前
Flutter Web 中文字体困境与渲染器选择:CanvasKit vs HTML renderer 实战
前端·flutter·html
杉氧7 小时前
原生交互:如何在 Flutter 中嵌入 Android/iOS 原生组件并解决手势冲突
android·flutter·dart
恋猫de小郭9 小时前
Flutter iOS Deep Link 为什么会突然失效:一系列难以言喻的问题
android·前端·flutter
FungLeo1 天前
Flutter fl_chart 0.70 破坏性 API 迁移实录:duration/getTooltipColor/withValues 全解
flutter·fl_chart
FungLeo1 天前
Flutter 吸顶分组列表实战:语义桶分组 + 点击头平滑滚动
android·flutter
FungLeo1 天前
Flutter 超长 StatefulWidget 拆分术:part of + extension on State 实战
android·flutter·dart